Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Wayfinding on the Web

Chris Basham
October 24, 2014

Wayfinding on the Web

Presented at Midwest UX 2014 with Tara Bazler.
http://2014.midwestuxconference.com/speakers/chris-basham.html

Inspired by adventuring in the great outdoors, we will explore principles, practices, and patterns that can guide those designing a web navigation experience. How do we design for users wanting to browse content or just wanting to efficiently accomplish a given task? How does context, such as resource constraints, prior knowledge, knowledge acquisition, and personal experience affect how a user traverses an interface? How can navigational experiences adapt for context?

Recording: https://vimeo.com/110190912

Chris Basham

October 24, 2014
Tweet

More Decks by Chris Basham

Other Decks in Design

Transcript

  1. Wayfinding  on  the  Web:  
    Design  Principles  from  
    Exploring  the  Great  Outdoors  
    Tara  Bazler  ·∙  Chris  Basham

    View Slide

  2. WAYFINDING  
    BEHAVIORS

    View Slide

  3. Locate  
    Get  to  the  end.  

    View Slide

  4. “NavigaOng  around  a  web  site  or  
    applicaOon  is  like  commuOng.  You  
    have  to  do  it  to  get  where  you  need  
    to  go,  but  it's  dull,  it’s  someOmes  
    infuriaOng,  and  the  Ome  and  energy  
    you  spend  on  it  just  seems  wasted.”
    —  Jennifer  Tidwell,  Designing  Interfaces

    View Slide

  5. Explore  
    Enjoy  the  journey.  

    View Slide

  6. Meander  
    Aimless  wandering.  

    View Slide

  7. NAVIGATING  THE  
    PHYSICAL  WORLD

    View Slide

  8. Signposts

    View Slide

  9. Maps

    View Slide

  10. Trails

    View Slide

  11. Landmarks

    View Slide

  12. Stars

    View Slide

  13. NAVIGATING  THE  
    DIGITAL  WORLD

    View Slide

  14. Links  
    Magical  portals.  

    View Slide

  15. Links  
    Magical  portals.  Stargates.  

    View Slide

  16. Search  
    The  omniscient  librarian.  

    View Slide

  17. Sitemaps  
    The  mall  directory.  

    View Slide

  18. Breadcrumbs  
    The  marked  trail.  

    View Slide

  19. Terminology  
    Page  Btles,  headings,  logos.  

    View Slide

  20. WAYFINDING  
    QUESTIONS

    View Slide

  21. Where  am  I?  
    3   K E Y   Q U E S T I O N S

    View Slide

  22. Where  am  I?  
    Where  can  I  go?  
    3   K E Y   Q U E S T I O N S

    View Slide

  23. Where  am  I?  
    Where  can  I  go?  
    How  do  I  return?
    3   K E Y   Q U E S T I O N S

    View Slide

  24. PRINCIPLES

    View Slide

  25. Understand  users’  goals  &  
    behaviors.

    View Slide

  26. Provide  clear  paths  for  users  
    to  aaain  their  goals.

    View Slide

  27. Choose  wording  wisely.

    View Slide

  28. Simplify  the  process.

    View Slide

  29. Create  a  logical  structure  
    through  content  organizaOon,  
    landmarks,  &  convenOons.

    View Slide

  30. “We  must  move  beyond  the  page  
    metaphor,  think  of  informaOon  as  
    an  environment,  consider  how  
    people  interact  with  that  
    environment,  and  apply  design  
    principles  that  opOmize  
    wayfinding.”
    —  Tyler  Tate,  InformaBon  Wayfinding

    View Slide

  31. Tara  Bazler         @taranoba  
    Chris  Basham     @chrisbasham  
    I N D I A N A   U N I V E R S I T Y   ·∙   U I T S 


    M I DW E S T   U X 

    O C TO B E R   2 0 1 4

    View Slide