Elements of Design Presentation designed by Dr. James Lenze Model: Williams R. (2004), The...
19
Elements of Design Presentation designed by Dr. James Lenze Model: Williams R. (2004), The Non-Designer’s Design Book, Second Edition, Peachpit Press What makes website look good? Is it the color choices? Is it the visual layout? Is it the grouping of information? Is it the consistency throughout the site? Repetiti on PROXIMIT Y Alignmen t Contrast
-
Upload
harvey-ward -
Category
Documents
-
view
215 -
download
2
Transcript of Elements of Design Presentation designed by Dr. James Lenze Model: Williams R. (2004), The...
Elements of Design
Presentation designed by Dr. James LenzeModel: Williams R. (2004), The Non-Designer’s Design Book, Second Edition, Peachpit Press
What makes website look good?Is it the color choices?
Is it the visual layout?Is it the grouping of information?
Is it the consistency throughout the site?
RepetitionPROXIMITY Alignmen
t
Contrast
Elements of Design
Presentation designed by Dr. James LenzeModel: Williams R. (2004), The Non-Designer’s Design Book, Second Edition, Peachpit Press
• Robin Williams presents to her readers four Elements of Design.
• These elements are the basic elements that can be applied to a variety of media formats.
Elements of Design
Presentation designed by Dr. James LenzeModel: Williams R. (2004), The Non-Designer’s Design Book, Second Edition, Peachpit Press
ProximityProximity
Proximity
Proximity
ProximityProximity
Alignment
Alignment
Alignment
Alignment
Repetition Repetition Repetition Repetition Repetition
ContrastContrast
Elements of Design
Presentation designed by Dr. James LenzeModel: Williams R. (2004), The Non-Designer’s Design Book, Second Edition, Peachpit Press
ProximityProximity
Proximity
Proximity
ProximityProximity
Alignment
Alignment
Alignment
Alignment
Repetition Repetition Repetition Repetition Repetition
ContrastContrast
Elements of Design
Presentation designed by Dr. James LenzeModel: Williams R. (2004), The Non-Designer’s Design Book, Second Edition, Peachpit Press
Proximity– Proximity is defined as the grouping of related items together, move them
physically close to each other so the related items are seen as one cohesive group.
– Robin Williams explains how the basic purpose of proximity is to organize items together.
– This can be done by grouping related items together to be seen as one cohesive group.
Elements of Design
Presentation designed by Dr. James LenzeModel: Williams R. (2004), The Non-Designer’s Design Book, Second Edition, Peachpit Press
Proximity
How to get it:Squint and count the number of elements on a page. Limit yourself to
between 3 and 5 elements.
What to Avoid:Avoid corners and the middle of the page.Avoid equal amounts of white space between all elementsForce relationships between headings and contentDon’t put unrelated content elements together
Elements of Design
Presentation designed by Dr. James LenzeModel: Williams R. (2004), The Non-Designer’s Design Book, Second Edition, Peachpit Press
ProximityProximity
Proximity
Proximity
ProximityProximity
Alignment
Alignment
Alignment
Alignment
Repetition Repetition Repetition Repetition Repetition
ContrastContrast
Elements of Design
Presentation designed by Dr. James LenzeModel: Williams R. (2004), The Non-Designer’s Design Book, Second Edition, Peachpit Press
Alignment– Alignment is defined as the element where nothing is placed on the page
arbitrarily resulting in every item having a visual connection with something else on the page.
– Robin Williams explains how the basic purpose of alignment is to bring unity and organize items together.
– This can be done by creating a strong alignment create a variety of looks. Alignment allows the designer to create a sophisticated, formal, fun, or serious look.
Elements of Design
Presentation designed by Dr. James LenzeModel: Williams R. (2004), The Non-Designer’s Design Book, Second Edition, Peachpit Press
Alignment
How to get it:Always align elements on the page, even those that are far apart.
What to Avoid:Don’t center some text and left align other text.Avoid centering anyway!
Elements of Design
Presentation designed by Dr. James LenzeModel: Williams R. (2004), The Non-Designer’s Design Book, Second Edition, Peachpit Press
ProximityProximity
Proximity
Proximity
ProximityProximity
Alignment
Alignment
Alignment
Alignment
Repetition Repetition Repetition Repetition Repetition
ContrastContrast
Elements of Design
Presentation designed by Dr. James LenzeModel: Williams R. (2004), The Non-Designer’s Design Book, Second Edition, Peachpit Press
Repetition– Repetition is defined by some aspect of the design that is consistent
throughout the entire piece.
– Robin Williams explains how the basic purpose of repetition is to bring unity and add visual interest.
– This element is important in one page pieces and is critical in multiple page pieces. This is called being consistent throughout the media piece.
Elements of Design
Presentation designed by Dr. James LenzeModel: Williams R. (2004), The Non-Designer’s Design Book, Second Edition, Peachpit Press
Repetition
How to get it:Choose design characteristics (type face, color, size, cartoon style, picture
style) and repeat them.Find existing repetitions and strengthen them by contrast or uniqueness.Accent the repetition. Think black hat, black shirt, black pants, black
shoes, white corsage.
What to Avoid:Don’t keep repeating if it is becoming annoying.Don’t repeat mistakes.Don’t repeat phrases.Avoid RANSOm NOTing
Elements of Design
Presentation designed by Dr. James LenzeModel: Williams R. (2004), The Non-Designer’s Design Book, Second Edition, Peachpit Press
ProximityProximity
Proximity
Proximity
ProximityProximity
Alignment
Alignment
Alignment
Alignment
Repetition Repetition Repetition Repetition Repetition
ContrastContrast
Elements of Design
Presentation designed by Dr. James LenzeModel: Williams R. (2004), The Non-Designer’s Design Book, Second Edition, Peachpit Press
Contrast– Contrast is defined by creating two elements that are different and making
them really different because they are not the same.
– Robin Williams explains how the basic purpose of contrast is to draw our eyes to the page.
– This element is important because it creates and interest on the page
Elements of Design
Presentation designed by Dr. James LenzeModel: Williams R. (2004), The Non-Designer’s Design Book, Second Edition, Peachpit Press
Contrast
How to get it:Be bold!Use color, size, and space to differentiate between contentBreak the rules when it works! This goes for all four elements.
What to Avoid:Avoid wimpy contrast! Yellow and white don’t go together. Avoid two different fonts that look alike. Calibri and Arial.
Elements of Design
Presentation designed by Dr. James LenzeModel: Williams R. (2004), The Non-Designer’s Design Book, Second Edition, Peachpit Press
ProximityProximity
Proximity
Proximity
ProximityProximity
Alignment
Alignment
Alignment
Alignment
Repetition Repetition Repetition Repetition Repetition
ContrastContrast
Elements of Design
Presentation designed by Dr. James LenzeModel: Williams R. (2004), The Non-Designer’s Design Book, Second Edition, Peachpit Press
What makes website look good?Is it the color choices?
Is it the visual layout?Is it the grouping of information?
Is it the consistency throughout the site?
RepetitionPROXIMITY Alignmen
t
Contrast
Elements of Design
Presentation designed by Dr. James LenzeModel: Williams R. (2004), The Non-Designer’s Design Book, Second Edition, Peachpit Press
Is it the color choices?
Is it the visual layout?
Is it the grouping of information?
Is it the consistency throughout the site?
ProximityAlignmentRepetitionContrast
What makes a website look good?
Elements of Design
Presentation designed by Dr. James LenzeModel: Williams R. (2004), The Non-Designer’s Design Book, Second Edition, Peachpit Press
• Next Steps– It is time to critique websites on their design according to the Robin Williams
Elements of Design using the four quadrant matrix.
Contrast Repetition
Alignment Proximity
