Your SlideShare is downloading. ×
 visual designprinciples_1 visual hierarchy
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

visual designprinciples_1 visual hierarchy

559
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
559
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
0
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
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
  • Transcript

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

    ×