Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Navigation models… … how people find stuff David Humphreys … user preference vs. efficiency.
Who are we?  Some of our clients
About David & Peak Usability <ul><li>David Humphreys </li></ul><ul><li>Senior Usability Consultant  </li></ul><ul><li>Peak...
Our collective thoughts Our team had pretty strong opinions about a lot of nav models… … but we had no solid test data bas...
The usual suspects Fly-out menus Dropdowns Index pages Mega-dropdowns Contextual dropdowns
Index pages – What we like <ul><li>Supports user decision making – provides context </li></ul>
Index pages – What we don’t like Too much text!  Too much scrolling! Operational Procedures under Policies & Procedures fo...
Vertical drop downs Good for sites with frequent repeat users e.g. intranets Work well with index pages Needs a good IA & ...
Variant – Contextual vertical drop downs Provides more context to support user @iiNet  Looks good, particularly the menus/...
Flyout menus <ul><li>Evil! </li></ul><ul><li>Users hate them! </li></ul>“ that thing annoys me so much!” <ul><li>So many i...
Mega drop downs <ul><li>We have never tested a site with them </li></ul><ul><li>EBay uses them & Amazon used to.  Why? </l...
Mega drop downs
Mega drop downs
Aims of the research <ul><li>Meet our curiosity and provide evidence </li></ul><ul><li>Resolve office arguments </li></ul>...
Approach <ul><li>Worked with final year HCI students form University of Queensland </li></ul><ul><li>2 user groups using d...
Tool we recommended - Naview by Volkside
What was actually tested – RSL Group Drop downs Fly-outs
What was actually tested (RSL Group) Index pages “ Mega-menu” or contextual dropdowns
QUT Library prototypes for testing Drop downs Fly-outs
QUT Library prototypes for testing Index pages Mega drop down
Early results
Navigation model preference – RSL group <ul><li>Users preferred mega menus (contextual dropdowns) for efficiency* </li></u...
<ul><li>Single dropdowns & homepage landing pages were preferred </li></ul><ul><li>The mega dropdown menu was least prefer...
Efficiency (time) - RSL group <ul><li>Mega menus (contextual drop downs) were most efficient!* </li></ul><ul><li>Split the...
Efficiency (time) – QUT Library <ul><li>The fly-outs performed well for this group </li></ul><ul><li>What was different? <...
Task completion rate – RSL group <ul><li>Mega menus (contextual drop-down) performed the best* </li></ul><ul><li>Fly-outs ...
QUT Library task completion <ul><li>Landing page was best performer </li></ul><ul><li>Followed by fly-outs </li></ul><ul><...
Thanks to our Research Students <ul><li>Group 1 – RSL  </li></ul><ul><ul><li>Chin Zhun (Jerry) Ong </li></ul></ul><ul><ul>...
A few caveats <ul><li>We haven’t tested every nav model on the web </li></ul><ul><li>Not statistically valid </li></ul><ul...
Conclusions & Questions <ul><li>Refine further research - landing pages and dropdowns together </li></ul><ul><li>Contextua...
<ul><li>Which nav should I use on my site? </li></ul>It depends!
Thank you David Humphreys [email_address] @peakusability @davemonkey http:// www.volkside.com/go/ozia /
Upcoming SlideShare
Loading in …5
×

Navigation Models: Efficiency versus user preference

5,148 views

Published on

Presented at OZIA 09. Thoughts on navigation models from the hive mind of Queensland's leading usability and user centered design services and the results from some initial research into the usability of various navigation UI models.

Published in: Technology, Business
  • Wondered if you had ever taken this any further. I thought it was a really interesting read but can't see any references to it on your website. Fascinating that people liked megamenus and that they could be the most efficient. Especially liked it because you initially expressed distaste for them!
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

Navigation Models: Efficiency versus user preference

  1. Navigation models… … how people find stuff David Humphreys … user preference vs. efficiency.
  2. Who are we? Some of our clients
  3. About David & Peak Usability <ul><li>David Humphreys </li></ul><ul><li>Senior Usability Consultant </li></ul><ul><li>Peak Usability are Brisbane based </li></ul><ul><li>Usability & UX services & training </li></ul>
  4. Our collective thoughts Our team had pretty strong opinions about a lot of nav models… … but we had no solid test data based on navigation models alone
  5. The usual suspects Fly-out menus Dropdowns Index pages Mega-dropdowns Contextual dropdowns
  6. Index pages – What we like <ul><li>Supports user decision making – provides context </li></ul>
  7. Index pages – What we don’t like Too much text! Too much scrolling! Operational Procedures under Policies & Procedures for QAS and QFRS. 1st of 84 pages only Related information or form appears as a link here which just looks like another link. Related information or form appears as a link here which just looks like another link.
  8. Vertical drop downs Good for sites with frequent repeat users e.g. intranets Work well with index pages Needs a good IA & labels
  9. Variant – Contextual vertical drop downs Provides more context to support user @iiNet Looks good, particularly the menus/left nav, 10 points for putting phone numbers right there in the 'contact' menu. - @ben_h
  10. Flyout menus <ul><li>Evil! </li></ul><ul><li>Users hate them! </li></ul>“ that thing annoys me so much!” <ul><li>So many issues </li></ul><ul><li>Don’t support users </li></ul><ul><li>Users will follow as far at they go </li></ul><ul><li>Don’t support natural mouse movement </li></ul><ul><li>Poor fine motor skills? No chance </li></ul>
  11. Mega drop downs <ul><li>We have never tested a site with them </li></ul><ul><li>EBay uses them & Amazon used to. Why? </li></ul><ul><li>Allow clearer chunking with subheadings </li></ul>“ We know from user testing that mega drop-downs work” Alertbox 23 March 2009
  12. Mega drop downs
  13. Mega drop downs
  14. Aims of the research <ul><li>Meet our curiosity and provide evidence </li></ul><ul><li>Resolve office arguments </li></ul><ul><li>Which nav models: </li></ul><ul><ul><li>Do users prefer ? </li></ul></ul><ul><ul><li>Is the most efficient to use? </li></ul></ul><ul><ul><li>Has the best completion rate? </li></ul></ul><ul><li>These became our test measures </li></ul>
  15. Approach <ul><li>Worked with final year HCI students form University of Queensland </li></ul><ul><li>2 user groups using different user bases and website IAs </li></ul><ul><ul><li>QLD RSL (9 users) </li></ul></ul><ul><ul><li>QUT Library (7 users) </li></ul></ul><ul><li>Built ‘pure’ interfaces – ‘white sites’ </li></ul><ul><li>The IA and the UI </li></ul><ul><li>Fewer variables </li></ul><ul><li>Tested 4 scenarios on each nav UI </li></ul>
  16. Tool we recommended - Naview by Volkside
  17. What was actually tested – RSL Group Drop downs Fly-outs
  18. What was actually tested (RSL Group) Index pages “ Mega-menu” or contextual dropdowns
  19. QUT Library prototypes for testing Drop downs Fly-outs
  20. QUT Library prototypes for testing Index pages Mega drop down
  21. Early results
  22. Navigation model preference – RSL group <ul><li>Users preferred mega menus (contextual dropdowns) for efficiency* </li></ul><ul><li>Landing pages were seen as inefficient* </li></ul><ul><li>Users preferred drop downs for ease of use </li></ul><ul><li>Fly-outs were seen as hard to use. </li></ul>Source: UQ Research Group 1 Source: UQ Research Group 1
  23. <ul><li>Single dropdowns & homepage landing pages were preferred </li></ul><ul><li>The mega dropdown menu was least preferred </li></ul><ul><li>Fly outs were better than expected </li></ul>Navigation model preference – QUT group Source: UQ Research Group 2
  24. Efficiency (time) - RSL group <ul><li>Mega menus (contextual drop downs) were most efficient!* </li></ul><ul><li>Split the difference between dropdowns & landing pages </li></ul><ul><li>The fly-outs caused difficulty for this group </li></ul>Source: UQ Research Group 1 Source: UQ Research Group 1
  25. Efficiency (time) – QUT Library <ul><li>The fly-outs performed well for this group </li></ul><ul><li>What was different? </li></ul><ul><li>Homepage style landing page also a strong performer </li></ul><ul><li>The two dropdowns were generally less efficient </li></ul>Source: UQ Research Group 2 Source: UQ Research Group 2
  26. Task completion rate – RSL group <ul><li>Mega menus (contextual drop-down) performed the best* </li></ul><ul><li>Fly-outs the worst </li></ul><ul><li>Landing pages caused some problems* </li></ul><ul><li>Dropdowns performed marginally worse </li></ul>Source: UQ Research Group 1
  27. QUT Library task completion <ul><li>Landing page was best performer </li></ul><ul><li>Followed by fly-outs </li></ul><ul><li>Seemed to be general difficulty with Tasks 3&4 </li></ul>Source: UQ Research Group 2
  28. Thanks to our Research Students <ul><li>Group 1 – RSL </li></ul><ul><ul><li>Chin Zhun (Jerry) Ong </li></ul></ul><ul><ul><li>Jason Antony Marles </li></ul></ul><ul><ul><li>Chin Wai Ng </li></ul></ul><ul><ul><li>Jared Robert Mallett </li></ul></ul><ul><li>Group 2 – QUT Library </li></ul><ul><ul><li>Daniel Jon Dawson </li></ul></ul><ul><ul><li>Jacob Ryan Appleton </li></ul></ul><ul><ul><li>Jenny Spiers </li></ul></ul>
  29. A few caveats <ul><li>We haven’t tested every nav model on the web </li></ul><ul><li>Not statistically valid </li></ul><ul><li>Not conclusive </li></ul><ul><li>We have more to do! </li></ul><ul><li>Raises more questions than it answers </li></ul>
  30. Conclusions & Questions <ul><li>Refine further research - landing pages and dropdowns together </li></ul><ul><li>Contextual drop downs are remarkably usable </li></ul><ul><li>Should we stop using fly-outs? Can you have a good one? </li></ul><ul><li>What about mega drop downs? </li></ul><ul><li>Was age a factor? </li></ul>
  31. <ul><li>Which nav should I use on my site? </li></ul>It depends!
  32. Thank you David Humphreys [email_address] @peakusability @davemonkey http:// www.volkside.com/go/ozia /

×