design patterns for navigating
DESCRIPTION
Presented by Loren Baxter at ESDCTRANSCRIPT
Design Patterns For Navigating Complex Taxonomies
Presented by Loren Baxter
TAXONOMY
the science or technique of classification. - dictionary.com
COMPLEX TAXONOMY
A rich dataset that has many objects with various attributes.
Something people will need to navigate.
Examples:
‣ Product Catalogs
‣ User Directories
‣ Article Archives
WHY WE CARE
"Most companies are so confused, the last thing they need is more data." - @tamaraadlin
The same is true of people. They need the right data.
KEY POINTS
1. Navigation + search = foundation
2. Progressive disclosure: consider when data is presented
3. Categorization can be dynamic and powerful
4. Discovery engines add value
NAVIGATION AND SEARCH
are always best together. Think peanut butter and jelly.
‣ Top levels should remain constant
‣ Show where the user is
‣ Simple and advanced search
‣ Faceted navigation
CASCADING MENU GUIDELINES
• Allow adequate vertical margins to support selection
• Poor Contrast
• Avoid 3+ levels of cascades
www.msn.com (2007)
CASCADING MENU GUIDELINES
SEARCH (+)
Google One Box search
High efficiency, minimalist design
Extend public strategy to the enterprise
GOAL BASED SEARCH
I’ve got chicken, peas, broccoli.
What can I make for dinner?
GOAL BASED SEARCH
What’s in my refrigerator?
I’ve had a long day…
GOAL BASED SEARCH
Provide appropriate content for selection (image, rating, etc)
KEY POINTS
1. Navigation + search = foundation
2. Progressive disclosure: consider when data is presented
3. Categorization can be dynamic and powerful
4. Discovery engines add value
PROGRESSIVE DISCLOSURE
Not all data is created equal. It should be presented in layers.
INFORMATION HIERARCHY
Help users see the most important information.
Then, show more details upon request.
But make it efficient.
an efficient interface (for programmers)
LAYERED DATA
www.shopping.com
KEY POINTS
1. Navigation + search = foundation
2. Progressive disclosure: consider when data is presented
3. Categorization can be dynamic and powerful
4. Discovery engines add value
CATEGORIZATION
is where we need to flex our design muscle. We can let people slice through data in interesting ways.
CATEGORIZATION
Static, curated list
Dynamic, faceted list
Dynamic, social list (“folksonomies”)
CATEGORIZATION
Categories can be:
‣ Object oriented
‣ Goal oriented
‣ What else?
SOCIAL FACETS
GOAL-BASED TAXONOMY
KEY POINTS
1. Navigation + search = foundation
2. Progressive disclosure: consider when data is presented
3. Categorization can be dynamic and powerful
4. Discovery engines add value
DISCOVERY ENGINES
Augment standard search + browse. Provide value to advanced users.
Generally more advanced technologies.
GOAL BASED SEARCH
What if your search had ...
As-you-type feedback
With data visualization
And drilldown results?
I want a cute name!
GOAL BASED SEARCH
http://www.babynamewizard.com/namevoyager
DISCOVERY ENGINESAllow non-standard, non-linear ways to browse the data.
CASE STUDY
Tyco Electronics
Global Provider of Electronics
Over 500,000 Products
Typical User: Design Engineer
Worldwide Audience
Over 50 recent corporate acquisitions
Product Catalogs Stacked 1 Meter High
User Centered Design Approach To Redesign
BEFORE: SIMPLE PICTURE CATALOG
BEFORE: COMPLEX “STEP SEARCH”
32
Dynamic Facets were confusing
NEW DESIGN GOALS
Visual and textual browse
Tabs for search strategies
Good information ‘Scent’
Nearby Search with part # default
‣ Strong keyboard focus
HOME PAGE: SEARCH / BROWSE
INTEGRATED “DIRECTED SEARCH”
DIRECTED SEARCH - FILTER APPLIED
PICTURE SEARCH - EXCELLENT FOR GLOBAL USE
TRANSITION FROM PICTURE SEARCH TO BROWSE
REMEMBER
Taxonomies are getting more complex
Adapt your navigation strategies to meet the new information challenges
Shield users from the complexity
Lower the efficiency cost of navigation
Leverage design patterns to repeat success
THANK YOU!
Please leave your card on the front or back table for a FREE “Taxonomy Checklist”
Email: [email protected]: 925-237-2581
Loren Baxtertwitter : @lorenbaxter
Visit our Web sites atwww.classicsys.comwww.guiguide.com