Elements - PowerPoint PPT Presentation

Loading...

PPT – Elements PowerPoint presentation | free to view - id: 837260-NzdlZ



Loading


The Adobe Flash plugin is needed to view this content

Get the plugin now

View by Category
About This Presentation
Title:

Elements

Description:

Elements & Principles of Design By Laura McKee Box Elder High School – PowerPoint PPT presentation

Number of Views:168
Avg rating:3.0/5.0
Slides: 35
Provided by: Laur4388
Category:
Tags: elements | music

less

Write a Comment
User Comments (0)
Transcript and Presenter's Notes

Title: Elements


1
Elements Principles of Design
  • By
  • Laura McKee
  • Box Elder High School

2
Magazine Questions
  1. What attracts you to the cover?
  2. What do you think the message is?

3
Vocabulary
As in just about any field of endeavor, it helps
to have a common language to describe things. If
I say 'dohickey' and you say 'doodad', we may not
know we're talking about the same thing.
Vocabulary is vital for correct principles to be
taught in any discipline.
4
Design Concepts
  • Alignment
  • Left, right, center, justified
  • Proximity
  • Placement of graphic/pictures to related text

5
Design Concepts (continued)
  • Repetition
  • Use of bullets, numbers, symbols, graphics, or
    pictures used more than once. Creates unity.
  • Contrast
  • Large vs. small
  • Dark vs. light
  • Thick vs. thin

6
Elements of Design
  • Line
  • Shape
  • Form
  • Space
  • Color
  • Texture
  • Value

7
Line
  • A straight or curved mark connecting any two
    points.
  • Most obvious lines are rules, boxes, and borders.
    Less obvious-but more powerful-are lines that
    direct your eye or define the mood.

8
Identify which line represents Formality,
romance, excitement, mystery, tranquility, or
anger
1
2
3
4
6
5
9
Mood Definition
  • FormalityUsed for professional, conservative or
    structured documents. Recognized by straight
    lines and even patterns.
  • ExcitementRepresented by straight lines, sharp
    angles, and irregular patterns.
  • Tranquility or RomanceUsed in fashion ads, movie
    promotions and travel brochures because the lines
    are made with soft curves regular patterns.

10
Mood Definition (continued)
  • Mystery is used if you need to entice your
    audience to figure out a puzzle. Made with
    unusual lines patternsespecially those with
    optical illusions.
  • Anger is seen as highs lows with sharp peaks
    valleysand incites action.

11
  • Do you want to make any changes to your choices?

12
Answers
13
Shapes
  • Shapes define objects, attract attention, provide
    identity and communicate ideas.

Organic shapes look like things from nature.
Geometric shapes
14
Forms
  • Forms are 3-dimensional. Where shapes are flat,
    forms have height, width and thickness.

15
Space
  • The absence of elements or the area between or
    around elements.
  • Space is used to rest the eye, to visually
    organize, and to make text more readable.

16
Color
  • The most critical design element on the page.
  • It is the most difficult to work with and the
    most effective in achieving the results you want.

17
Primary Colors
Secondary Colors
Tertiary Colors
12-Step Color Wheel
18
Primary Complementary Colors
19
Warm Colors
  • Reds, oranges, and yellows are considered warm
    colors. Warm colors are said to come towards
    you.

20
Cool Colors
  • Blues, greens, and purples are considered cool
    colors. Cool colors are said to move away from
    you, or appear more distant.

21
Texture
  • The structure or grain of a surface gives added
    dimension to a layout.
  • Design is FUN

22
Value
  • Relative darkness or lightness of a color.
  • Adds contrast and texture to a page and can set
    the moodgreat for web page backgrounds.

23
Principles of Design
  • Balance
  • Unity
  • Emphasis
  • Rhythm
  • Pattern
  • Contrast
  • Movement

24
Balance
  • The distribution of weight may be either
    symmetrical or asymmetrical. If you see something
    hanging crooked it makes you feel uneasy until it
    is balanced.

Asymmetrical (informal) balance means each side
of an imaginary line are different yet equal.
Symmetrical (formal) balance means both sides of
an imaginary line are the same.
25
Pattern/Rhythm
  • Artists create pattern by repeating a line, shape
    or color over and over again.

26
Rhythm
  • A regular or harmonious pattern created by the
    alternation of contrasting elements.
  • This can be music, speech, poetry, and dance. On
    the printed page, repetition of elements at
    regular intervals communicates calmness
    stability.
  • Variations or abrupt changes in size, color or
    spacing of repeated elements can add a sense of
    liveliness and excitement.

27
Proportion
  • Describes the size, location or amount of one
    thing compared to another.

28
Emphasis
  • Special weight or importance placed upon
    something.
  • In speech we talk louder or whisper. In
    appearance we dress or style our hair differently
    from the norm. With objects, we paint them bold
    colors, build them enormous or make them noisy.
    We make them different!
  • Use contrast
  • Add texture
  • Color headings graphics or backgrounds
  • Lead the reader to the most important thing on
    the page

29
Unity
  • Each element in a layout should have a visual
    connection with something else in the layout to
    establish unity. Even elements that are
    unrelated and separate can be aligned to make
    them look as if they all belong together.

30
Hexadecimal Numbers
  • Hexa 6
  • Six digit number made up of letters from A to F
    and numbers 0 9.
  • FFCC99
  • Hexadecimal numbers are used in designing a web
    page because hexadecimal numbers will appear the
    same color on each different brower.

31
Three Colors of Hexadecimal
  • Red
  • Green
  • Blue
  • Each of the two-digit color codes are in the
    range of 00..FF

32
Create and Prepare Images
  • Adjust the Appearance
  • Brightness Contrast
  • Color Balance
  • Resize the Image
  • Pixiels size for Interent use
  • Scan at 300 dpi
  • No more than 400 pixels
  • Crop
  • Save GIF/JPG

33
Good Web Page Design
  • Page download quickly
  • Every graphic has an Alt tag
  • Link colors coordiante with page colors
  • Background does not interrupt the text
  • Navigation buttons and bars are easy to
    understand and use
  • Navigation is consistent throughout the site

34
Good Web Page Design
  • Every web page in the site looks like it belongs
    to the same site
  • Animated graphic to not distract from the page.
  • Text is big enough to read, but not too big.
  • The hierarchy of information is perffectly clear.
  • Link colors coordiante with page colors
About PowerShow.com