design - contrast
TRANSCRIPT
![Page 1: Design - contrast](https://reader033.vdocuments.us/reader033/viewer/2022052700/55a220e81a28ab3a368b4756/html5/thumbnails/1.jpg)
Design Principle 1: Contrast
What is Contrast and how do I use it?
![Page 2: Design - contrast](https://reader033.vdocuments.us/reader033/viewer/2022052700/55a220e81a28ab3a368b4756/html5/thumbnails/2.jpg)
Principle of Contrast
If two items are not exactly the same, then make them different. Really different.
![Page 3: Design - contrast](https://reader033.vdocuments.us/reader033/viewer/2022052700/55a220e81a28ab3a368b4756/html5/thumbnails/3.jpg)
Key Points
• Contrast draws your attention
• Make elements very different
For contrast to be effective, it must be strong. Don’t be a wimp.
![Page 4: Design - contrast](https://reader033.vdocuments.us/reader033/viewer/2022052700/55a220e81a28ab3a368b4756/html5/thumbnails/4.jpg)
How is Contrast Created?
• It’s created when two elements are different
• NOTE:– If two elements are sort of different, but
not really, you don’t have contrast, you have conflict!
![Page 5: Design - contrast](https://reader033.vdocuments.us/reader033/viewer/2022052700/55a220e81a28ab3a368b4756/html5/thumbnails/5.jpg)
Creating Contrast
• Contrast large type with small type• Thin line with a thick line• A cool color with a warm color• Smooth texture with a rough texture• Horizontal element with a vertical element• Widely spaced lines with closely packed
lines• Small graphic with a large graphic
![Page 6: Design - contrast](https://reader033.vdocuments.us/reader033/viewer/2022052700/55a220e81a28ab3a368b4756/html5/thumbnails/6.jpg)
Main Purpose
• Create an interest on the page
• Aid in the organization of information
![Page 7: Design - contrast](https://reader033.vdocuments.us/reader033/viewer/2022052700/55a220e81a28ab3a368b4756/html5/thumbnails/7.jpg)
![Page 8: Design - contrast](https://reader033.vdocuments.us/reader033/viewer/2022052700/55a220e81a28ab3a368b4756/html5/thumbnails/8.jpg)
![Page 9: Design - contrast](https://reader033.vdocuments.us/reader033/viewer/2022052700/55a220e81a28ab3a368b4756/html5/thumbnails/9.jpg)
![Page 10: Design - contrast](https://reader033.vdocuments.us/reader033/viewer/2022052700/55a220e81a28ab3a368b4756/html5/thumbnails/10.jpg)
![Page 11: Design - contrast](https://reader033.vdocuments.us/reader033/viewer/2022052700/55a220e81a28ab3a368b4756/html5/thumbnails/11.jpg)
![Page 12: Design - contrast](https://reader033.vdocuments.us/reader033/viewer/2022052700/55a220e81a28ab3a368b4756/html5/thumbnails/12.jpg)
![Page 13: Design - contrast](https://reader033.vdocuments.us/reader033/viewer/2022052700/55a220e81a28ab3a368b4756/html5/thumbnails/13.jpg)
![Page 14: Design - contrast](https://reader033.vdocuments.us/reader033/viewer/2022052700/55a220e81a28ab3a368b4756/html5/thumbnails/14.jpg)
![Page 15: Design - contrast](https://reader033.vdocuments.us/reader033/viewer/2022052700/55a220e81a28ab3a368b4756/html5/thumbnails/15.jpg)
What to avoid:
• Avoid making slight differences– Sort-of-heavy line with a sort-of-heavier line
• Brown text with black text
• Two or more typefaces that are similar
REMEMBER: IF THEY’RE NOT EXACTLY THE SAME, MAKE THEM DIFFERENT!