UIs for Faceted Navigation Recent Advances and Remaining Open Problems

1
UIs for Faceted NavigationRecent Advances and
Remaining Open Problems

• HCIR08
• Marti Hearst, UC Berkeley
• (including some slides from Corey Chandler of
  eBay)

2
Search Usability Design Goals

• The most important usability design goals
• User control
• Reduce short term memory load
• Allow easy, fast reversal of actions
• Provide consistent view

3
Design Goals

• Systematically integrate search results
• reflect the structure of the info architecture
• retain the context of previous interactions
• Gives users control and flexibility
• Over order of metadata use
• Over when to navigate vs. when to search
• Allow easy, fast reversal of actions
• Allow integration with advanced methods
• Collaborative filtering, predicting users
  preferences

4
Design Goals

• More specifically
• Provide context for results
• Allow flexible, fast navigation
• Provide previews of next steps
• Organize results in a meaningful way
• Support both expanding and refining the search
• Keep it as simple as possible, but
• Show the metadata!

5
The Challenges

• Users generally do not adopt new search
  interfaces
• How to show a lot more information without
  overwhelming or confusing?
• Most users prefer simplicity unless complexity
  really makes a difference
• Small details matter

6
The Idea of Facets

• Create INDEPENDENT categories (facets)
• Each facet has labels (sometimes arranged in a
  hierarchy)
• Assign labels from the facets to every item
• Example recipe collection

Ingredient
Cooking Method
Chicken
Stir-fry
Bell Pepper
Curry
Course
Cuisine
Main Course
Thai
7
The Idea of Facets

• Break out all the important concepts into their
  own facets
• Sometimes the facets are hierarchical
• Assign labels to items from any level of the
  hierarchy

Preparation Method Fry Saute Boil
Bake Broil Freeze
Desserts Cakes Cookies Dairy
Ice Cream Sorbet Flan
Fruits Cherries Berries Blueberries
Strawberries Bananas Pineapple
8
Using Facets

• Now there are multiple ways to get to each item

Preparation Method Fry Saute Boil
Bake Broil Freeze
Desserts Cakes Cookies Dairy
Ice Cream Sherbet Flan
Fruits Cherries Berries Blueberries
Strawberries Bananas Pineapple
Fruit gt Pineapple Dessert gt Cake Preparation gt
Bake
Dessert gt Dairy gt Sherbet Fruit gt Berries gt
Strawberries Preparation gt Freeze
9
Using Facets

• The system only shows the labels that correspond
  to the current set of items
• Start with all items and all facets
• The user then selects a label within a facet
• This reduces the set of items (only those that
  have been assigned to the subcategory label are
  displayed)
• This also eliminates some subcategories from the
  view.

10
Advantages of Facets

• Cant end up with empty results sets
• (except with keyword search)
• Helps avoid feelings of being lost.
• Easier to explore the collection.
• Helps users infer what kinds of things are in the
  collection.
• Evokes a feeling of browsing the shelves
• Is preferred over standard search for collection
  browsing in usability studies.
• (Interface must be designed properly)

11
Advantages of Facets

• Seamless to add new facets and subcategories
• Seamless to add new items.
• Helps with categorization wars
• Dont have to agree exactly where to place
  something
• Interaction can be implemented using a standard
  relational database.
• May be easier for automatic categorization

12
Information previews

• Use the metadata to show where to go next
• More flexible than canned hyperlinks
• Less complex than full search
• Help users see and return to previous steps
• Reduces mental work
• Recognition over recall
• Suggests alternatives
• More clicks are ok only if (J. Spool)
• The scent of the target does not weaken
• If users feel they are going towards, rather than
  away, from their target.

13
The Flamenco Project

• Goal figure out how to make faceted nav UIs work
• Demos, papers, talks are online
• Nobel prize example uses this toolkit
• Open source software available
• Unix-based
• Check it out
• http//flamenco.berkeley.edu

14
Facets vs. Hierarchy

• Early Flamenco studies compared allowing multiple
  hierarchical facets vs. just one facet.
• Multiple facets was preferred and more successful.

15
Limitation of Facets

• Do not naturally capture MAIN THEMES
• Facets do not show RELATIONS explicitly

Aquamarine Red Orange
Door Doorway Wall

• Which color associated with which object?

Photo by J. Hearst, jhearst.typepad.com
16
Classic Faceted Navigation UI with Flamenco
17
Opening ViewSelect literature from PRIZE facet
18
Group results by YEAR facet
19
Select 1920s from YEAR facet
20
Current query is PRIZE gt literature ANDYEAR
1920s. Now remove PRIZE gt literature
21
Now Group By YEAR gt 1920s
22
Hierarchy TraversalGroup By YEAR gt 1920s, and
drill down to 1921
23
Select an individual item
24
Use Endgame to expand out
25
Use Endgame to expand out
26
Or use More like this to find similar items
27
Start a new search using keyword California
28
Note that category structure remains after the
keyword search
29
The query is now a keyword ANDed with a facet
subhierarchy
30
Interface Innovations with eBay Express
31
Matching items
32
Matching items
33
Matching items
34
Matching items
35
Matching items
36
Matching items
37
Matching items
38
Matching items
39
Matching items
40
Matching items
41
Matching items
42
Matching items
43
Matching items
44
Matching items
45
Matching items
46
Design Issues(from 2006 SIGIR workshop)
47
How many facets?

• Many facets means more choice, but more scanning
  and more scrolling
• An alternative (by eBay)
• initially show the few most important facets
• allow user to choose a label from one
• then show an additional new facet (next most
  important)
• The right choice depends on the application
• Browsing art history vs. shopping

48
Revealing Hierarchy

• One approach (Flamenco) keep all facets present,
  show deeper level as you descend.

49
Revealing Hierarchy

• Another approach (eBay) show only one level at a
  time if a facet is chosen that has subhierarchy,
  show the next level as an additional facet.
• Example
• In Shoes, user selects Style gt Athletic
• Now show a new facet that shows types of Athletic
  shoes
• Hiking, Running, Walking, etc.

50
Reversibility

• Make navigation urls consistent and persistent
• This way the Back button always works
• Allows for bookmarking of pages

51
Choosing Labels

• Labels must be short to fit!
• Tricky with terminology endoplasmic reticulum
• Labels must be evocative
• Its very difficult to find successful words
• Depends on user familiarity with the domain
• Use card-sorting exercises
• Associate synonyms with labels
• Beware the context of label use!
• The kosher salt incident

52
Creating Facets

• Need to balance depth and breadth
• Avoid long skinny hierarchies
• Example from the Art and Architecture Thesaurus
• 7 clicks before you get to anything interesting

53
Integrating browse and search

• Parsing of query feels natural to users (and
  the text in the search box is not sacred)

athletic shoes
54
Integrating browse and search

• People browse using the facets more when they are
  not familiar with the domain

55
Facet Presentation

• Users stop using refinements whena) not useful,
  and b) item count low enough

56
Facet Presentation

• Prominently showing a few facets can work well
  (but prioritization is important)

57
Facet Presentation

• Shifting columns doesnt confuse users

58
Facet Presentation

• Truncated list of values per facet is okay (users
  know how to access the rest)

59
Facet Presentation

• Showing sample values help users understand
  facets and can expose breadth

60
Design Innovations and Remaining Issues
61
Large Numbers of Facets

• Getty.org
• Groups Related Facets Visually
• Well-designed cues for expand and collapse of
  related facets
• Start with most popular / relevant facets
  expanded after the initial search

62
Getty Images
63
Integrating Smarts into the UI
64
Integrating Smarts Into the UI

• Auto-complete within facets
• (Also known as dynamic term suggestions)
• Generally a good idea for search UIs
• Can be cleverly used within faceted nav UIs
• Example Search form with auto-complete rather
  than enumerated author names in a bibliographic
  collection

65
Integrating Smarts Into the UI

• Search terms effecting facet label ordering
• Yelp is doing this in interesting ways
• Extends ideas from eBay Express
• Which labels shown depends on which query issued
• Yelp is also making subtle variations in the use
  of hyperlinks vs. checkboxes.
• Easier for this kind of dataset where the number
  of labels per facet is limited.

66
yelp.com
67
Information VisualizationApplied to Faceted
Navigation
68
Fathumb Mobile Interface
69
FacetLens
70
WeFeelFine.org
71
Extending the Faceted Model
72
Endeca Intelligent Subject Labels

• Use pre-processing to show most compelling
  subject labels
• Integrated with facets for other kinds of
  metadata
• I think these should be faceted too, after user
  selects initial subject labels.

73
LibraryThing Experiments with Tags
74
Getty Images Catalyst Interface
75
Parallax More free-form Navigation
76
Summary

• Faceted Nav UI ideas are becoming increasingly
  sophisticated, while remaining usable
• The biggest outstanding problem is too many
  facets / too many labels
• Innovations
• smart selection of which to show when
• integration of keyword search with auto-complete
• grouping related facets visually
• Taking a more flexible approach to the model
• Infoviz is interesting, but may not end up being
  adopted

77
Acknowledgements

• Flamenco Team
• Brycen Chun, Ame Elliott, Jennifer English, Kevin
  Li, Rashmi Sinha, Emilia Stoica, Kirsten
  Swearingen, Ka-Ping Yee
• This work supported in part by NSF (IIS-9984741)
• eBay Product Team
• Corey Chandler, Sam Devins, Elaine Fung,
  Jean-Michel Leon, Michelle Millis, Louis Monier,
  Michael Morgan, Hill Nguyen, Kenny Pate, Melissa
  Quan, James Reffell, Suzanne Scott, Seema Shah,
  Preston Smalley, Anselm Baird-Smith, Luke
  Wroblewski