Designing Usable Search InterfacesWhitney Quesenbery, Whitney Interactive Design
© 2001, 2002 Whitney Quesenbery Page 1
Designing UsableSearch Interfaces:The Good, The Bad, The Ugly
Whitney QuesenberyWhitney Interactive Designwww.WQusability.com
Washington DC UPA Chapter MeetingApril 2002
DESIGNING SEARCH INTERFACES © 2001,2002 Whitney Quesenbery 2
Why is search so hard?
Most people can tell you what they want, butthey have trouble being specific enough for amachine to interpret their requests or makesuggestions
http://www.ucomics.com/adamathomeMay 19, 1999
Designing Usable Search InterfacesWhitney Quesenbery, Whitney Interactive Design
© 2001, 2002 Whitney Quesenbery Page 2
DESIGNING SEARCH INTERFACES © 2001,2002 Whitney Quesenbery 3
http://www.askjeeves.com
Can we “just tell it what we want”?Words can havespecialized meanings
“Old House” is arenovator’s term, and hasspecial meaning
Words can have doublemeanings
“Dinosaur” can be aprehistoric beast or ametaphor for someonewhose time has passed
Since I captured this response,the database has learned about“old houses” and now returnsmore useful results.
DESIGNING SEARCH INTERFACES © 2001,2002 Whitney Quesenbery 4
Is search used at all?
UIE reports on their usability testingsay that:
53% of users found what they wantedwithout using the site search engineOnly 30% succeeded using searchSearch entry boxes located on everypage are generally ignored
Jakob Nielsen’s UseIt columnsuggests:
Over half of all users are “searchdominant” going directly to a searchfunctionOthers use search only when links failSearch entry boxes or buttons should belocated on every page
In a recent usability testwe conducted, evengeneral consumerswanted search -- “aplace where they couldtype in what they werelooking for”
Designing Usable Search InterfacesWhitney Quesenbery, Whitney Interactive Design
© 2001, 2002 Whitney Quesenbery Page 3
DESIGNING SEARCH INTERFACES © 2001,2002 Whitney Quesenbery 5
Is the solution a “one field” interface?
DESIGNING SEARCH INTERFACES © 2001,2002 Whitney Quesenbery 6
Search Interaction
Createthe query
Formulatea question
Selectan item
Try again
Reviewresults
Evaluatesuccess
Examineselected item
Evaluatelikelihood of
successRefinesearch
The user interface includeselements to:
Enter the queryDisplay the list of resultsDisplay an item found
Designing Usable Search InterfacesWhitney Quesenbery, Whitney Interactive Design
© 2001, 2002 Whitney Quesenbery Page 4
DESIGNING SEARCH INTERFACES © 2001,2002 Whitney Quesenbery 7
Formulating the QuerySearch interfaces are hard for general users
The “Boolean Paradox”“Find the names of all people living in NewJersey and Maryland”
STATE=NJ AND STATE=MD vsSTATE=NJ OR STATE=MD
Queries which are easy to say can be difficultto express in precise syntax
“Let’s find a western. No John Wayne, exceptthe one with Katherine Hepburn might be OK,and no Val Kilmer. Not too much violence, andsome good scenery.”
Engines support different capabilities - noconsistency
Search rules vary; syntax varies
Createthe query
Formulatea question
DESIGNING SEARCH INTERFACES © 2001,2002 Whitney Quesenbery 8
Formulating the QueryHow people express a search query dependson what they are looking for and their startingapproach to the problem of finding information
FINDI know exactly what I’m looking for and justneed to find itSTRUCTUREDI want to narrow down my choices and then beable to look through some optionsQUERYI can describe what I’m looking for and need tosee a few good optionsBROWSEI just want to explore. I’ll follow my nose.GUIDEDI want to be taken through in a planned way -not really a search?
Createthe query
Formulatea question
Designing Usable Search InterfacesWhitney Quesenbery, Whitney Interactive Design
© 2001, 2002 Whitney Quesenbery Page 5
DESIGNING SEARCH INTERFACES © 2001,2002 Whitney Quesenbery 9
FindFind offersprecision in asingle step
For those whoknow the domainwellHave a secondsource ofinformationNeed precision orefficiency
www.eddiebauer.com
DESIGNING SEARCH INTERFACES © 2001,2002 Whitney Quesenbery 10
StructuredRelies on aclassification schemeMay use a hiddensearch mechanism tokeep content evergreenShortcuts allow usersto jump throughstructure
1
2
3
www.eddiebauer.com
Designing Usable Search InterfacesWhitney Quesenbery, Whitney Interactive Design
© 2001, 2002 Whitney Quesenbery Page 6
DESIGNING SEARCH INTERFACES © 2001,2002 Whitney Quesenbery 11
http://www.wine.com/home/
Mental models and classifications
A classificationscheme forexperts
TypeWineryRegion
Does it answer:
“What wine willI like?”
DESIGNING SEARCH INTERFACES © 2001,2002 Whitney Quesenbery 12
Mental models and classification
A classificationscheme for non-experts -Organized by adescription ofhow it tastes
Asked themselves:
How doaverageshoppers talkabout wine?
http://www.bestcellars.com/
Designing Usable Search InterfacesWhitney Quesenbery, Whitney Interactive Design
© 2001, 2002 Whitney Quesenbery Page 7
DESIGNING SEARCH INTERFACES © 2001,2002 Whitney Quesenbery 13
Query
Simple query screento a more complexone
http://www.hotbot.com
DESIGNING SEARCH INTERFACES © 2001,2002 Whitney Quesenbery 14
Query
Balancingcomplexity withenough fields
Are they assuming:
“Only people whoknow books will usethe advancedsearch?”
http://www.amazon.com
Designing Usable Search InterfacesWhitney Quesenbery, Whitney Interactive Design
© 2001, 2002 Whitney Quesenbery Page 8
DESIGNING SEARCH INTERFACES © 2001,2002 Whitney Quesenbery 15
Query
Power searchgoes all the wayback to a one-field interface
Users enter acomplete query,with noassistance.
http://www.amazon.com
DESIGNING SEARCH INTERFACES © 2001,2002 Whitney Quesenbery 16
Source: Alta Vista business search
Making the UI helpful
Create asequencePromptsprovideinstructionsExamplesareavailablewhenneeded
Designing Usable Search InterfacesWhitney Quesenbery, Whitney Interactive Design
© 2001, 2002 Whitney Quesenbery Page 9
DESIGNING SEARCH INTERFACES © 2001,2002 Whitney Quesenbery 17
Browse: FacetsEach recipe is assigned at leastone:
Main ingredientCourse/mealPreparation styleCuisineSeason/Occasion
Starting from any one of these‘facets’ the user may
Back up to a previous selectionChoose another facet to narrowthe searchSelect from one of the list ofrecipes presented
All selections are done by clickingon links - no entering text
http://www.epicurious.com
DESIGNING SEARCH INTERFACES © 2001,2002 Whitney Quesenbery 18
Using browsing to create a complex searchThe Enhanced Searchscreen shows all of theoptions in the browse,but allows forcombinationsIt retains a sense ofbrowsing, even thoughit is constructing aboolean search behindthe scenes
http://www.epicurious.com
Designing Usable Search InterfacesWhitney Quesenbery, Whitney Interactive Design
© 2001, 2002 Whitney Quesenbery Page 10
DESIGNING SEARCH INTERFACES © 2001,2002 Whitney Quesenbery 19
Reviewing resultsHow well does the interface presentresults so that an item can be selectedwith confidence
Enough information in the resultitem to give a strong scent ofinformationAbility to discriminate betweendifferent types of documentsEasily scan-able
Reviewresults
Evaluatelikelihood of
success
DESIGNING SEARCH INTERFACES © 2001,2002 Whitney Quesenbery 20
http://www.vanguard.com/site/search.html
Combining Search OptionsCombines severalapproaches on onepage
Links to specialfeatures that arelikely to providedirect answersSimple text-boxsearch (and a linkto an advancedsearch)Browse, usingindex terms
Designing Usable Search InterfacesWhitney Quesenbery, Whitney Interactive Design
© 2001, 2002 Whitney Quesenbery Page 11
DESIGNING SEARCH INTERFACES © 2001,2002 Whitney Quesenbery 21
Helping users identify the document type
Document types help usersfind the right item in a longlist search results
http://www.vanguard.com
DESIGNING SEARCH INTERFACES © 2001,2002 Whitney Quesenbery 22
Offering results in more than one formatImproving thechance for asuccessful choice
Grouping andclassification ofresultsEditorial selectionRelated actions
http://www.amazon.com
Designing Usable Search InterfacesWhitney Quesenbery, Whitney Interactive Design
© 2001, 2002 Whitney Quesenbery Page 12
DESIGNING SEARCH INTERFACES © 2001,2002 Whitney Quesenbery 23
Image browsing
Imagesearchesallow resultsto bebrowsedvisuallyDisplayincludes filename, sizeand source
http://www.google.com
DESIGNING SEARCH INTERFACES © 2001,2002 Whitney Quesenbery 24
Refining the searchCombining refiningthe search withreviewing the results
Continuouslydisplayed resultsOptions to searchwithin the currentresults set
Createthe query
Reviewresults
Evaluatelikelihood
ofsuccessRefine
search
Designing Usable Search InterfacesWhitney Quesenbery, Whitney Interactive Design
© 2001, 2002 Whitney Quesenbery Page 13
DESIGNING SEARCH INTERFACES © 2001,2002 Whitney Quesenbery 25
Selecting the scope of the search
The advanced searchscreen does not have manyoptions, except the ability toselect the scope of thesearch by selecting whichreferences are searchedhttp://www.merckmedicus.com
DESIGNING SEARCH INTERFACES © 2001,2002 Whitney Quesenbery 26
Combining query and results on a screenDirectmanipulation toform a query
A visualrepresentation ofthe query andthe resultsRapid,incremental, andreversibleactionsSelection bypointingImmediate andcontinuousdisplay of results
Developed at the HCIL of University of Marylandhttp://www.cs.umd.edu/hcil
“Where can I find a house?”
Designing Usable Search InterfacesWhitney Quesenbery, Whitney Interactive Design
© 2001, 2002 Whitney Quesenbery Page 14
DESIGNING SEARCH INTERFACES © 2001,2002 Whitney Quesenbery 27
Combining query and results
The full set isalways available,but a simple queryis constructed bychecking types ofpeople.People matchingthe query areshown in purple
http://www.chiplace.org/people/
DESIGNING SEARCH INTERFACES © 2001,2002 Whitney Quesenbery 28
References
A comparison of different search engines in 1996 and 1999http://www.curtin.edu.au/curtin/library/staffpages/gwpersonal/senginestudy/Clarifying Search: A User Interface Framework for TextSearches - Shneiderman, Byrd, CroftUIE on search: http://world.std.com/~uieweb/searchart.htmNielsen on search: http://www.useit.com/alertbox/9707b.htmlInnovations in Classification - Peter Merholzhttp://www.peterme.com/archives/00000063.html
Designing Usable Search InterfacesWhitney Quesenbery, Whitney Interactive Design
© 2001, 2002 Whitney Quesenbery Page 15
DESIGNING SEARCH INTERFACES © 2001,2002 Whitney Quesenbery 29
About Whitney Quesenbery
Whitney has extensive user interface design and projectmanagement experience. She has produced award winningmultimedia products, user interfaces, web sites, andsoftware applications. A key player in the development ofthe LUCID Framework, she promotes the importance ofhuman interaction and usability in interface design.
Manager of the STCUsability SIG
Outreach Directorfor UPA
“It’s exciting whena new designchanges people’slives by helpingthem work better.”
User Interface Designer: Created user interfaces forsoftware applications, web sites, multimediaapplications, documentation.Big-Picture Visioning: Whitney specializes in the bigpicture for applications and projects. She sees howthe client’s needs and the users’ needs best fittogether, and she knows how to present that visionfor maximum effect.
Theatrical Lighting Designer 1974-1989: Discoveredthat a computer screen is just like a tiny stage in theway that audience attention is directed by the design.