visual designprinciples_1 visual hierarchy

842 views

Published on

Published in: Technology, Art & Photos
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
842
On SlideShare
0
From Embeds
0
Number of Embeds
43
Actions
Shares
0
Downloads
0
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide
  • Clickability – is clickable, but doesn’t look it
  • Clickability – logo is not clickable, but it should be
  • Visual hierarchy; breaking up pages into clearly defined areas
  • Visual hierarchy; breaking up pages into clearly defined areas
  • visual designprinciples_1 visual hierarchy

    1. 1. Visual Design Principles 1<br />
    2. 2. Don’t make users think<br />Interfaces should be:<br />Self-evident<br />Obvious<br />Self-explanatory<br />
    3. 3. Things that make us Think<br />Names (buttons, links)<br />Clickability<br />Choices<br />
    4. 4.
    5. 5.
    6. 6. Principles 101<br />Visual hierarchy<br />Conventions<br />Break up pages into clearly defined areas<br />Clickability<br />Reduce noise<br />
    7. 7. Visual hierarchy<br />Visual weight<br />Focal point<br />Balance<br />Communicate messages<br />Take action<br />Organize information<br />Visual hierarchy tells a story with a beginning, an end, a point<br />
    8. 8.
    9. 9.
    10. 10.
    11. 11.
    12. 12.
    13. 13.
    14. 14.
    15. 15.
    16. 16.
    17. 17.
    18. 18. http://webstyleguide.com<br />
    19. 19.
    20. 20.
    21. 21.
    22. 22.
    23. 23. http://www.chriscmerritt.com/<br />http://www.chriscmerritt.com<br />http://designshack.co.uk/articles/graphics/how-to-use-visual-hierarchy-in-web-design<br />
    24. 24. 1<br />2<br />http://designshack.co.uk/articles/graphics/how-to-use-visual-hierarchy-in-web-design<br />
    25. 25.
    26. 26. 3<br />2<br />1<br />6<br />5<br />4<br />

    ×