26
Lesson 4: Design Principles This lesson will cover the four primary principles of design: Contrast Repetition Alignment Proximity

Lesson 4: Design Principles

  • Upload
    hayden

  • View
    32

  • Download
    0

Embed Size (px)

DESCRIPTION

Lesson 4: Design Principles. This lesson will cover the four primary principles of design: Contrast Repetition Alignment Proximity. Design Principles: Contrast. - PowerPoint PPT Presentation

Citation preview

Page 1: Lesson 4: Design Principles

Lesson 4: Design Principles

This lesson will cover the four primary principles of design:● Contrast● Repetition● Alignment● Proximity

Page 2: Lesson 4: Design Principles

Design Principles: Contrast

Contrast is a visually important aspect of design. Contrast can be “striking,” drawing the attention of the viewer to your page. Contrast must be strong. However, contrast and conflict are very different.

Page 3: Lesson 4: Design Principles

Design Principles: Contrast

Ways of creating contrast: Type (text): Large text with small text Color: a bold color with a soft color Horizontal rule/vertical rule: thin horizontal rule with a thick vertical rule Graphics: Small graphic with a large graphic

Page 4: Lesson 4: Design Principles

Design Principles: Contrast

Contrast is “critical” to organizing the information on your publication. Contrast makes the “purpose and organization of the document” clear to the audience. For examples of contrast, refer to your course book The Non-Design Design Book on pages 53-62.

Page 5: Lesson 4: Design Principles

Design Principles: Repetition

Repetition is the design principle in which visual elements are repeated throughout the page(s) of your publication.

Page 6: Lesson 4: Design Principles

Design Principles: Repetition

Incorporating repetition into your web page

(publication) will “strengthen the unity” of your

design and page.

Page 7: Lesson 4: Design Principles

Design Principles: Repetition

Ways to incorporate Repetition: Type (text): Use same font throughout your document, bolding particular words consistently Color: Use the same color, colors, or color patterns throughout the document Bullets: make them the same throughout the document

Page 8: Lesson 4: Design Principles

Design Principles: Repetition

Ways to incorporate Repetition continued: Design elements: horizontal rules, graphics Headlines/Subtitles: should be consistent throughout your web page (publication).

Page 9: Lesson 4: Design Principles

Design Principles: RepetitionExercise 4.1

I have created a web page for Angelo State University’s CDJ Department. View the URL below AND the link within it entitled:“View Advertising Course Descriptions”http://webclass.angelo.edu/comm6301/stanley/lessonexercises/coursedescrip.htm(Name at least four elements of Repetition within these two web pages.)

Page 10: Lesson 4: Design Principles

Design Principles: Alignment

“Lack of alignment is probably the biggest cause of unpleasant-looking documents. Our eyes like to see order; it creates a calm, secure feeling” (p. 35).

Page 11: Lesson 4: Design Principles

Design Principles: Alignment

1. The principle of Alignment states that “nothing should be placed on a page arbitrarily.”

Page 12: Lesson 4: Design Principles

Design Principles: Alignment

2. A visual connection between the elements on the page is critical to creating a “clean and sophisticated look.”

Page 13: Lesson 4: Design Principles

Design Principles: Alignment

3. There must be a “reason” and purpose for the placement of all design elements.

Page 14: Lesson 4: Design Principles

Design Principles: Alignment

Here is an example of my business card. The elements on the card look as though they were placed at random and have no connection to one another.

Page 15: Lesson 4: Design Principles

Design Principles: Alignment

The information on this business card has been aligned centered. It looks all right, but I want something that has more of an impact.

Page 16: Lesson 4: Design Principles

Design Principles: Alignment

The information on this card is right aligned (flush right). It has a strong invisible vertical line that has more of an impact than the other two cards. (Another example: Center Alley p. 40)

Page 17: Lesson 4: Design Principles

Design Principles: Alignment

Newsletter Tip:1. Do not center headlines over body

copy that is left aligned (flush left) or indented.

Page 18: Lesson 4: Design Principles

Design Principles: Alignment

Turn to page 38 in your Non-Design Design Book, and see if you can find all of the items that are not aligned correctly. Example: Ladle Rat Rotten Hut

Page 19: Lesson 4: Design Principles

Design Principles: Alignment

It tends to be the bad examples that pop out at us.Why? Probably because when the alignment is right (correct), it's invisible.

Page 20: Lesson 4: Design Principles

Design Principles: Proximity

Finally, let’s review the design principle of Proximity. Proximity means that related items are grouped together.

Page 21: Lesson 4: Design Principles

Design Principles: Proximity

When elements that have a relation are grouped together, your page will have a cohesive appearance. Let’s look at the business cards once again:

Page 22: Lesson 4: Design Principles

Design Principles: Proximity

In this example, the eye stops 5 times. It is difficult to know where to begin reading. Visually, it is confusing to look at. Thus, it will be overlooked.

Page 23: Lesson 4: Design Principles

Design Principles: Proximity

In this example, your eye knows exactly where to begin reading. Related information is grouped together, and it makes sense.

Page 24: Lesson 4: Design Principles

Design Principles

In this lesson, we have discussed the four primary design principles:

Contrast

Repetition

Alignment

Proximity

Page 25: Lesson 4: Design Principles

Design Principles

You may have noticed before now that CRAP is an acronym to remember these design principles. Consequently, if you do not incorporate contrast, repetition (consistency), alignment, and proximity into your web page designs, your pages will look like crap.

Page 26: Lesson 4: Design Principles

Design Principles

Go to Blackboard Course Documents Save Design Style Sheet

Begin working on your design style sheet.