4 principles of design 2
DESCRIPTION
4 principles of designTRANSCRIPT
![Page 1: 4 principles of design 2](https://reader034.vdocuments.mx/reader034/viewer/2022051611/54b3436c4a795937528b45bf/html5/thumbnails/1.jpg)
4 Principles of Design
Contrast
Repetition
Alignment
Proximity
![Page 2: 4 principles of design 2](https://reader034.vdocuments.mx/reader034/viewer/2022051611/54b3436c4a795937528b45bf/html5/thumbnails/2.jpg)
Contrast
This is a headingThis is a subheadingThis is lots of text. This is lots of text . This is lots of text. This is lots of text
The type is only slightly different in style.
![Page 3: 4 principles of design 2](https://reader034.vdocuments.mx/reader034/viewer/2022051611/54b3436c4a795937528b45bf/html5/thumbnails/3.jpg)
Contrast
This is a headingThis is a subheadingThis is lots of text. This is lots of text . This is lots of text. This is lots of text
This is a headingThis is a subheadingThis is lots of text. This is lots of text . This is lots of text. This is lots of text
Don’t be wimpy – make things dramatically different!
![Page 4: 4 principles of design 2](https://reader034.vdocuments.mx/reader034/viewer/2022051611/54b3436c4a795937528b45bf/html5/thumbnails/4.jpg)
Can you identify where contrast has been used on this design?
![Page 5: 4 principles of design 2](https://reader034.vdocuments.mx/reader034/viewer/2022051611/54b3436c4a795937528b45bf/html5/thumbnails/5.jpg)
Can you identify where contrast has been used on this design?
Contrast in size & type style
![Page 6: 4 principles of design 2](https://reader034.vdocuments.mx/reader034/viewer/2022051611/54b3436c4a795937528b45bf/html5/thumbnails/6.jpg)
Can you identify where contrast has been used on this design?
Contrast in size & type style
Contrast in size & color
![Page 7: 4 principles of design 2](https://reader034.vdocuments.mx/reader034/viewer/2022051611/54b3436c4a795937528b45bf/html5/thumbnails/7.jpg)
Repetition
Repeat an element to help create unity.
Color
Type
Shape (bullets)
![Page 8: 4 principles of design 2](https://reader034.vdocuments.mx/reader034/viewer/2022051611/54b3436c4a795937528b45bf/html5/thumbnails/8.jpg)
Repetition
Repeat an element to help create unity.
Color
Type
Shape (bullets)
![Page 9: 4 principles of design 2](https://reader034.vdocuments.mx/reader034/viewer/2022051611/54b3436c4a795937528b45bf/html5/thumbnails/9.jpg)
Repetition
Repeat an element to help create unity.
Color
Type
Shape (bullets)
![Page 10: 4 principles of design 2](https://reader034.vdocuments.mx/reader034/viewer/2022051611/54b3436c4a795937528b45bf/html5/thumbnails/10.jpg)
Alignment
This is a heading
This is a subheadingThis is body text. This is body text. This is body text. This is body text.
This is body text.
This is a heading
This is a subheadingThis is body text. This is body text. This is body text. This is body text.This is body text.
Avoid mixing different alignments. Choose one and stick to it.
![Page 11: 4 principles of design 2](https://reader034.vdocuments.mx/reader034/viewer/2022051611/54b3436c4a795937528b45bf/html5/thumbnails/11.jpg)
Alignment
This is a heading
This is a subheadingThis is body text. This is body text. This is body text. This is body text.
This is body text.
This is a heading
This is a subheadingThis is body text. This is body text. This is body text. This is body text.This is body text.
Avoid mixing different alignments. Choose one and stick to it.
![Page 12: 4 principles of design 2](https://reader034.vdocuments.mx/reader034/viewer/2022051611/54b3436c4a795937528b45bf/html5/thumbnails/12.jpg)
Can you pick the dominant alignment here?
![Page 13: 4 principles of design 2](https://reader034.vdocuments.mx/reader034/viewer/2022051611/54b3436c4a795937528b45bf/html5/thumbnails/13.jpg)
Can you pick the dominant alignment here?
Left
![Page 14: 4 principles of design 2](https://reader034.vdocuments.mx/reader034/viewer/2022051611/54b3436c4a795937528b45bf/html5/thumbnails/14.jpg)
ProximityGroup related items together.
![Page 15: 4 principles of design 2](https://reader034.vdocuments.mx/reader034/viewer/2022051611/54b3436c4a795937528b45bf/html5/thumbnails/15.jpg)
Proximity in a page layout might look like this…
![Page 16: 4 principles of design 2](https://reader034.vdocuments.mx/reader034/viewer/2022051611/54b3436c4a795937528b45bf/html5/thumbnails/16.jpg)
Proximity in a page layout might look like this…
![Page 17: 4 principles of design 2](https://reader034.vdocuments.mx/reader034/viewer/2022051611/54b3436c4a795937528b45bf/html5/thumbnails/17.jpg)
Which design uses Proximity more effectively?
![Page 18: 4 principles of design 2](https://reader034.vdocuments.mx/reader034/viewer/2022051611/54b3436c4a795937528b45bf/html5/thumbnails/18.jpg)
Which design uses Proximity more effectively?
![Page 19: 4 principles of design 2](https://reader034.vdocuments.mx/reader034/viewer/2022051611/54b3436c4a795937528b45bf/html5/thumbnails/19.jpg)
Can you think of a memorable ACRONYM for the 4 Principles of design?
C ontrastR epetitionA lignmentP roximity
![Page 20: 4 principles of design 2](https://reader034.vdocuments.mx/reader034/viewer/2022051611/54b3436c4a795937528b45bf/html5/thumbnails/20.jpg)
Can you think of a memorable ACRONYM for the 4 Principles of design?
C ontrastR epetitionA lignmentP roximity
can be improved with these principles of design!