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? Repetition PROXIMITY Alignment Contrast

Elements of Design Presentation designed by Dr. James Lenze Model: 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 Lenze Model: Williams R. (2004), The Non-Designer’s Design Book, Second Edition, Peachpit Press Proximity Alignment Repetition Repetition Repetition Repetition Repetition Contrast

Elements of Design Presentation designed by Dr. James Lenze Model: Williams R. (2004), The Non-Designer’s Design Book, Second Edition, Peachpit Press Proximity Alignment Repetition Repetition Repetition Repetition Repetition Contrast

Elements of Design Presentation designed by Dr. James Lenze Model: 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 Lenze Model: 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 elements Force relationships between headings and content Don’t put unrelated content elements together

Elements of Design Presentation designed by Dr. James Lenze Model: Williams R. (2004), The Non-Designer’s Design Book, Second Edition, Peachpit Press Proximity Alignment Repetition Repetition Repetition Repetition Repetition Contrast

Elements of Design Presentation designed by Dr. James Lenze Model: 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 Lenze Model: 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 Lenze Model: Williams R. (2004), The Non-Designer’s Design Book, Second Edition, Peachpit Press Proximity Alignment Repetition Repetition Repetition Repetition Repetition Contrast

Elements of Design Presentation designed by Dr. James Lenze Model: 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 Lenze Model: 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 R A N S O m N O T i n g

Elements of Design Presentation designed by Dr. James Lenze Model: Williams R. (2004), The Non-Designer’s Design Book, Second Edition, Peachpit Press Proximity Alignment Repetition Repetition Repetition Repetition Repetition Contrast

Elements of Design Presentation designed by Dr. James Lenze Model: 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 Lenze Model: 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 content Break 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 Lenze Model: Williams R. (2004), The Non-Designer’s Design Book, Second Edition, Peachpit Press Proximity Alignment Repetition Repetition Repetition Repetition Repetition Contrast

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? Repetition PROXIMITY Alignment Contrast

Elements of Design Presentation designed by Dr. James Lenze Model: 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? Proximity Alignment Repetition Contrast What makes a website look good?

Elements of Design Presentation designed by Dr. James Lenze Model: 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. ContrastRepetition AlignmentProximity