CS2020:   Web Science, Sytems and Design

Contrast, Allignment, Repitition and Proximity

 

  • "The basic principles of design..." by Robin Williams in The Non-Designers Design Book

contrast If elements are not the same...make them different

Contrast attracts attention

 

 

 

An example in contrast.......

ABC

 

? Must it always include black?

Repetition

  • repeat visual elements throughout site and page:
    • logo
    • buttons
    • navigation links
    • images
  • Develops organization.....usability
  • Develops brand

    repetition

Alignment

  • do not place things randomly
  • elements have visual connection with others on another page

Alignment example

Proximity

  • Items related to each other should be grouped close togehter
  • grouping organizes information and reduces clutter

Proximity

 

 

 

Analize sites

 

© Lynne Grewe