Your SlideShare is downloading. ×
  • Like
  • Save
How to Communicate to the Visual Cortex - mLearn13
Upcoming SlideShare
Loading in...5

Thanks for flagging this SlideShare!

Oops! An error has occurred.


Now you can save presentations on your phone or tablet

Available for both IPhone and Android

Text the download link to your phone

Standard text messaging rates apply

How to Communicate to the Visual Cortex - mLearn13


By taking advantage of what learners already know from experience, we have a perceived affordance with visual design for eLearning and mLearning.

By taking advantage of what learners already know from experience, we have a perceived affordance with visual design for eLearning and mLearning.

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads


Total Views
On SlideShare
From Embeds
Number of Embeds



Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

    No notes for slide
  • Half of the brains resources are dedicated to seeing and interpreting what we see.What our eyes physically perceive is only one part.The image coming in are changed and interpreted and it’s the brain that “sees”
  • We *think* that everything in our world our eyes are sending information to our brains. Our brains then process the information and tell us what it is we’re seeing. In fact our brains may be interpreting something entirely different that what we actually see.What do you see?Triangle with black border in the backgroundWhite triangle on topNot really there. Your brain creates the shape of the upside down triangle out of empty space. It “expects” to see it.
  • Light enters through cornea and lens.Lens focuses image on the retinaOn the retina it is always 2D representation even if object is 3DImage sent to visual cortex in the brain
  • Recognition of patterns. Visual cortex turns 2D image into 3D representation
  • Biz card exercise
  • Marketers annoy us all the time. That’s why they have obnoxious flashy blinky ads in the periphery of a web page – we can’t help but notice.


  • 1. To Communicate to theVisual CortexWhat Learners Don’t SeeKevin Thorn
  • 2. Vision trumps all other senses
  • 3. VisionVisual CortexCentral & PeripheralVisual Alphabet and TheoriesPerceived Affordances
  • 4. Kanizsa TriangleDeveloped by Italian Psychologist, Gaetano Kanizsa in 1955
  • 5. Brain creates shortcuts100 Things Every Designer Should Know About People – Suzan Weinschenk
  • 6. STOPPEACEWARNOWInfluence by shapes and colorSTOPPEACEWARNOW100 Things Every Designer Should Know About People – Suzan Weinschenk
  • 7. 2D 3DNOTWE SEE
  • 8. • Light enters through cornea and lens.• Lens focuses image on the retina• On the retina it is always 2D representation even if object is 3D• Image sent to visual cortex in the brain
  • 9. VisualCortex
  • 10. Visual CortexRetina receives electrical patternsCreates several tracks from those patterns – asmany as 12 tracks(color, motion, location, edges, angles, etc.)All data combined into two tracksMovement: Is the object moving?Location: Where is the object in relation tome?
  • 11. Ventral & Dorsal StreamsVisualCortexVentralstreamDorsalstream
  • 12. Visual Cortex – V2• Dorsal: “Where” or “How” pathway– Motion– Representation of object locations– Control of the eyes and arms; reaching• Ventral: “What” pathway– Form recognition– Object representation– Storage of long-term memory
  • 13. These motor skills begin to developin the first year of life.Once learned, these are stored inlong-term memory.
  • 14. Peripheral VisionTWO TYPES:• Central – look at things directly• Peripheral – everything else
  • 15. Stop Clicky, Clicky, Bling, BlingPeople can’t help notice things moving in theirperipheral vision.EX: Reading text on screen and some animationor blinking is off to the side. Think of sidebaradvertisement.ANNOYING
  • 16. Dave Gray – http://www.davegrayinfo.comVisual Alphabet
  • 17. Geon TheoryIrving Bierderman –
  • 18. Irving Bierderman –
  • 19. Every OBJECT if first a shapeThat SHAPE occupies a spaceThat SPACE defines the OBJECTThorn – NuggetHead Theory
  • 20. What is it? How did you know?
  • 21. Shape Mashing
  • 22. Mashed Shapes
  • 23. • schedule• deadline• meeting• retirement• center piece• end of an era• celebration• timeless• commitment• reliable• steadfast• passing of timeSame Image; Different Meaning
  • 24. Instruction w/ WordsTo make a peanut butter and jelly sandwich,you will need two slices of bread, peanutbutter, your favorite flavor of jelly, and a knife.With the knife, spread the peanut butter onone slice of bread. Also with the knife, spreadthe jelly on top of the peanut butter. Whenfinished, place the other slice of bread on topof the already prepared slice with the peanutbutter and jelly. Smash and eat!
  • 25. Same Instructions w/ no Words
  • 26. Perceived Affordances
  • 27. Perceived Affordances
  • 28. Perceived Affordances
  • 29. Perceived Affordances
  • 30. Pull or Push?
  • 31. Pull or Push?
  • 32. Digital Learning Instructional TextTo open the doorgrasp the handlewith a firm gripand push downrotating the leveruntil the latchfrees from thedoor jamb whileslightly applyingforward pressureuntil the doorswings open.Trust your learners thatthey know how to clickthe next button withoutyou telling them how.
  • 33. Pull or Push?
  • 34. Pull or Push?
  • 35. The following slides represent goodvisual design that does not require“how to navigate this app” instructions.Amazon ShoppingeBayFabGoComicsNARR8Smithsonian ChannelArtRage
  • 36. To continue click theNext button to beginOld school sidebarMenu designDistracting?First screen. Why is this arrow here? >Why do we design with an attitude that our audience are idiots?Wasted real estate?Wasted real estate?Company Logo< If we have to remind users who they work for, we have bigger problems.
  • 37. Design starts here
  • 38. Design Differently
  • 39. Thank You! Thorn, Chief NuggetHead