1. Basic Principles of Design How to make your websites and video graphics look more professional

2. Basic Principles Contrast Repetition Alignment Proximity Limit your fonts

3. Contrast Making elements different from each other to make them stand out. Guides your eye around the page - or to where you want the viewer to look Adds visual interest and makes layout more attractive to the viewer. Rule - if something is different from another element, be sure to make it very different.

4. How to Use Contrast: Color Watch your color choices. There’s a difference between color difference and value difference Value is most important

5. Value: Contrast’s Best Friend Why is the left column better than the right column? VALUE DIFFERENCES!

6. How to Use Contrast: Size Create a focal point / dominating force No focal point creates confusion Control where the eye goes first, then second, etc.

7. Where does your eye go?

8. Repetition Repeating certain elements that tie everything together Each web page or super should look like it belongs to the same site or video The heart of a theme Helps viewers navigate a site quicker (they don’t have to re-learn where elements are)

9. Bad Repetition These pages are from the same site. They don’t look alike.

10. Good Repetition Recurring fonts Recurring colors Recurring symbols Recurring placement Pages don’t have to be exactly the same - only the elements that make them up

11. Alignment Simply put - the items on your page line up with each other. Without alignment, you have items placed randomly on the screen, creating chaos One of the biggest problems on the web

12. What Alignment does creates order organizes page elements groups items creates visual connections Good alignment is invisible - most readers won't consciously notice that everything is lined up neatly but they will feel it when things are out of alignment.

13. Avoid Center Alignment

14. Small Tweak = Big Improvement

15. Poor Alignment

16. Proximity Relationships that items develop when they’re close together Used in conjunction with alignment Group things that deserve grouping Subheads with block text Pictures with captions

17. Proximity: Grouping Examples

18. Limit Your Fonts! Good design is based around consistency. An easy way to achieve consistency is by limiting artistic motifs (themes) on your site or in your video Fonts are at the core of a theme Long story short: USE ONLY TWO FONTS! A third font is a rule breaker, but can be used on purpose to make an element stand out

19. Good Use of Fonts

20. Bad Use of Fonts

21. Terrible Use of Fonts

22. One last thought on fonts According to some experts… If your fancy font looks modern or contemporary, then your basic font should be a sans-serif. If your fancy font looks old fashioned, then use a serif font for your secondary font.

23. What do you think?