Downloaded 88 times
Uploaded byRyan Coleman
Designing for Visual Efficiency [Ignite Format]
The document discusses why Waldo is difficult to find and provides tips for making important elements stand out visually. It notes that our field of focus is small but uses half our visual processing, and our eyes and neurons are tuned to detect specific features like patterns, objects, and faces. To emphasize elements, ensure high contrast against other items and use techniques like proximity, shape, color, and motion. Consistency trains viewers to detect priority information. While Waldo puzzles are cognitively challenging, these visual design principles can help elements "pop" out.
More Related Content
Similar to Designing for Visual Efficiency [Ignite Format]
![[INFOGRAPHIC] 10 Visual Content Ideas For Your Business](https://cdn.slidesharecdn.com/ss_thumbnails/10visualcontentideasforyourbusiness-190402050658-thumbnail.jpg?width=640&height=640&fit=bounds)
![[Netchange] Defining And Measuring Social Success](https://cdn.slidesharecdn.com/ss_thumbnails/netchangedefiningandmeasuringsocialsuccess-090625134251-phpapp02-thumbnail.jpg?width=640&height=640&fit=bounds)
Designing for Visual Efficiency [Ignite Format]
- 1. Why is Waldoso!#@%!nghard to find?
- 2. At any onetime,most of the world is FOCUSout ofPhoto: VictoriaPeckham (Flickr)
- 3. Represents Approx. 5%of our visual field…… but uses HALF of our visual processing power.Approximate size of what’s in focus at any given time.
- 4. Problem SolvingEye MovementsPatternTestingBased on illustration by Colin Ware, Visual Thinking for Design
- 5. Visual Efficiency =ReducingVisual Queries
- 6. Neurons are tunedfor specific features
- 7.
- 8.
- 9.
- 10. Photo: Gaetan Lee,Clip_Works, BaylorBear78, Chidorian, (Flickr)
- 11. Photo: thetruthabout, wootang01,dno1967, sylvar (Flickr)
- 12.
- 14. Ensure highest contrastgoes to the emphasized elements.Ensure highest contrast goes to the emphasized elements.
- 17. WordWordWordWordWordWordWordWordWordImage: Pink SherbetPhotography (Flickr)
- 18. Appeal to low-levelfeatures.Make it POP! Use one channel at a time.Stay Consistent, train your viewer.
- 19. Where’s Waldo Example(CognitivelyDifficult)
- 20. THANKS!I’ll post thedeck at:http://ryancoleman.ca/ignite
Editor's Notes
- #3 Instead, we see through a series of visual queries http://www.flickr.com/photos/victoriapeckham/
- #4 Detail of pinhead in the centre > Fuzzy blobs on the outside edges
- #5 Generalities >>> SpecificsPROBLEM SOLVING: Brain generates a series of steps to solve a visual problem (VISUAL QUERIES) and executes themEYE MOVEMENTS: Visual searching stage > Scanning the scene for candidates. When it finds something it passes it to the PATTERN TESTING LOOP which validates it.
- #6 EYE MOVEMENTS!
- #8 Patterns become objects as they’re needed.Visual Working Memory = ~3 objects at a time
- #9 (REMOVE ALL COLOUR BUT RED)Colour search is much more efficient the fewer colours there are….http://www.flickr.com/photos/wwworks/2473052504/
- #11 Gaetan Lee http://www.flickr.com/photos/gaetanlee/421366255/ (Flickr)Clip Works http://www.flickr.com/photos/14947022@N06/2531389299/Chidorian http://www.flickr.com/photos/chidorian/14752550/BaylorBear78 http://www.flickr.com/photos/baylorbear78/3424910337/
- #12 Visual Queries can be primed / tunedStay consistent. Use the same highlight techniques across charts/graphics. If people know what element they’re seeking then they can find it faster. Colour receptors (or other receptors) will adjust to be more sensitive to the item being soughtPatterns are learned over time(Letters > Words, Charts, Signs, Etc.)Over time, higher level patterns are combinedMuch faster to process (2/10ths of a second)HAVE to be learned though…Much faster to process (2/10ths of a second)HAVE to be learned though…Proxies- Some of these learned patterns can be used as “proxies”… basically shortcuts to a bigger conceptsThetruthabout http://www.flickr.com/photos/thetruthabout/2666835568/Wootang01 http://www.flickr.com/photos/mckln/2894346353/Dno1967 http://www.flickr.com/photos/dno1967/3244178416/Sylvar http://www.flickr.com/photos/sylvar/3360734315/
- #14 Our eyes process colour from three perspectives > Red<>Green | Blue <> Yellow | Black <> WhiteThe extremes of each of these contrasts are the most unique/effectivecolours
- #16 Avoid visual conjunctionsOur low-level search can only be tuned for one element at a time. Not Both (Pg. 30 in Ware)Find Value a) then find b) among the a candidatesAt the lowest level we can search for only one criteria. We can search for the colour blue OR a square shape.
- #17 Channels can be layeredStill Takes additional cycles to process… but more efficient than multiple charts etc
- #18 Be aware of visual interferenceVisual Interference…. (like interferes w/like) http://www.flickr.com/photos/pinksherbet/