Successfully reported this slideshow.

Designing for Visual Efficiency [Ignite Format]

3,621 views

Published on

My presentation deck from #igniteto on November 25, 2009.

Published in: Design, Technology, Sports
  • Be the first to comment

Designing for Visual Efficiency [Ignite Format]

  1. 1. Why is Waldo<br />so !#@%!ng<br />hard to find?<br />
  2. 2. At any one time,<br />most of the world is <br />FOCUS<br />out of<br />Photo: VictoriaPeckham (Flickr)<br />
  3. 3. Represents Approx. 5% of our visual field…<br />… but uses HALF of our visual processing power.<br />Approximate size of what’s in focus at any given time.<br />
  4. 4. Problem Solving<br />Eye Movements<br />Pattern Testing<br />Based on illustration by Colin Ware, Visual Thinking for Design<br />
  5. 5. Visual Efficiency <br />=<br />Reducing <br />Visual Queries<br />
  6. 6. Neurons are tuned for specific features<br />
  7. 7. Features<br />Pattern Processing<br />Objects<br />
  8. 8. Photo: Woodlywonderworks (Flickr)<br />
  9. 9. = “Face”<br />
  10. 10. Photo: Gaetan Lee, Clip_Works, BaylorBear78, Chidorian, (Flickr)<br />
  11. 11. Photo: thetruthabout, wootang01, dno1967, sylvar (Flickr)<br />
  12. 12. Make it Pop!<br />Colour<br />Proximity<br />Shape<br />Motion<br />
  13. 13.
  14. 14. Ensure highest contrast goes to the emphasized elements.<br />Ensure highest contrast goes to the emphasized elements. <br />
  15. 15.
  16. 16.
  17. 17. Word<br />Word<br />Word<br />Word<br />Word<br />Word<br />Word<br />Word<br />Word<br />Image: Pink Sherbet Photography (Flickr)<br />
  18. 18. Appeal to low-level features.<br />Make it POP! <br />Use one channel at a time.<br />Stay Consistent, train your viewer.<br />
  19. 19. Where’s Waldo Example<br />(Cognitively Difficult)<br />
  20. 20. THANKS!<br />I’ll post the deck at:<br />http://ryancoleman.ca/ignite<br />

×