You are on page 1of 9

MENU

Nielsen Norman Group

EvidenceBasedUserExperienceResearch,Training,andConsulting

HOME

TRAINING

CONSULTING

REPORTS

ARTICLES

Topics
Ecommerce
Intranets
Mobile&Tablet
UserTesting
WebUsability
Seealltopics

Author
JakobNielsen
DonNorman
Bruce"Tog"Tognazzini
Seeallauthors

RecentArticles
FrontEndStyleGuides:Definition,Requirements,ComponentChecklist
3WaystoInspireIntranetContentAuthors
GamesUserResearch:WhatsDifferent?
HowChunkingHelpsContentProcessing
MicrosoftDesirabilityToolkitProductReactionWords
Seeallarticles

PopularArticles
Usability101:IntroductiontoUsability
Top10MistakesinWebDesign
HowUsersReadontheWeb

ABOUT

NN/G

Best Application Designs


by JAKOB NIELSENonApril23,2012

Topics:Applications

Summary:WinningappUIsincludedomainspecificsolutionsthatallowhumansto
focusondeeperissueswhilethesoftwaretakescareofthemechanics.
Thewinnersforbestapplicationuserinterfacesoftheyearare:
ComplexApplications
ThewebbasedBondWorkswealthmanagementplatform(BondDeskGroupLLC)providesfinancial
advisorswithastreamlinedsystemtotradefixedincomeassets.
TheportableGEN2i(HottingerBaldwinMesstechnikGmbH,Germany)letsusersrecordengineeringdata
inthefield.
OEConnection(OEConnectionLLC)letspartsdepartmentemployeesatautodealershipsandrepair
facilitiesprocessmorethan6millionoriginalequipmentpartstransactionsmonthly.
LightweightApplications
CycleStreetsMobile(CycleStreetsLtd.andAnnaPowellSmith,UK)helpscyclistsplansafe,fastroutesfor
cyclejourneysusingcrowdsourcedmapdata.
VitreaTeach(VitalImages,Inc.)isaneducationaltoolthatradiologyresidentsandpracticingradiologists
canusetosave,manage,andsharemedicalimages.
Wakelicious(UtopianArmy,TheNetherlands)isanalarmclockthatwakesyouupbyplayingYouTube
videossentbyyourfriends.
WorkflowApplications
TheClimateActionPlanningTool(NationalRenewableEnergyLaboratory)helpsorganizationsreduce
theircarbonemissions.
eReview(InternationalMonetaryFund,IMF)integratescomplexbusinessfunctionsintoanorganization's
intranet.
TheselfserviceEventbrite(EventbriteInc.)softwaretoolhelpseventhostsorganize,sell,andmanage
ticketsforevents.TheCreateEventworkflow,whichwontheaward,helpsuserssetupaneweventwithin
Eventbrite'sonlinesystem.
TheHobsonsCRM(Hobsons,Inc.)productsuggestionportaltoolletscustomersmakecommentsand
suggestions.
MultiPlatformApplications
Dixio(SemantixGroupSL,Spain)offersusersmultiplatformlookupcapabilities.
Highlight(Cohdoo,LLC)letsuserswithiOSdevicesmakeaudiorecordings,markinterestingpoints,and
sharerecordingswithothers.

TheMobileUnifiedCommunicationclient(VerizonWireless)letsbusinesscustomerslinktheirmobile
andbusinesslines.

Incontrasttoourotherdesignawards,wedecidedtosplittheapplicationawardinto
categories.Itdoesn'tmakesensetojudgesmallconsumerappsthatdoasinglethingtogether
withhugeenterpriseapplicationsthatmanipulateimmensesetsofconvoluteddatasuchas
the4milliondifferentbondsthattradersmanagethroughBondWorks.Workflowapplications
thatintegratemanystepsorcoordinateseveraluserroleshavestilldifferentrequirements,as
domultiplatformappsthatworkacrossseveraldevices.
Solvingabigproblemismoredifficultthansolvingasmallproblem.However,ifyourappdoes
onlyonething,ithadbettertoitreally,reallywell.So,thecriteriaforpolisharestricterforsmall
applicationsthanforenterpriseapplications.Withthousandsofscreensinsomeapplications,
theycan'tallbeperfect,buttheflowbetweenscreensandtheabilitytoselectthecorrect
featureforanygivensituationmustbegreat.So,insteadofcomparingapplesandoranges,we
decidedtojudgeeachapplicationstyleinrelationtoitspeersandselectthebestdesignsin
eachcategory.
Thatwewouldeverclassifyaradiologyapplicationas"lightweight"defiestheimagination,but
it'sappropriateinthecaseofVitreaTeachbecauseitfocusesononething:allowingresidents
andexperiencedradiologiststomanageimagesforlearningpurposes.Wemightevencallitthe
Pinterestofmedicalscience.But,ofcourse,Pinterestitselfwouldn'tworkforradiologists
partlybecauseoftheprivacyconcernsforanymedicalinformationandpartlybecauseofthe
benefitsthatdomainspecificfeaturesprovide.
Forexample,VitreaTeachbothoffersspecialaccesstocasesfromtheuser'sownhospitaland
knowssomethingaboutanatomyandpathology.Interestingly,oneofthethingsthatmakethe
designcleanerthanothermedicalsystemsisthesimpletaggingthatprovidesmuchofthe
taxonomysupportfortheimages.Designerssimplifiedtaggingafteruserresearchfoundthat
full,formalanatomyandpathologytaxonomyhierarchiesaddedtoomuchoverhead.

AugmentingHumanCapabilities
Software'srealgoalshouldnotbetosimplyprocesstransactionsinasystemwhereusersare
nothingmorethandataoperatorswhoclickrequiredbuttonstomakethingshappen.Rather,
softwareshouldworktoaugmenthumancapabilities,helpingustoovercomeweaknessesand
emphasizeourstrengths.
Avitalwayforcomputerstohelpusersistodirecttheirattentiontoasmallernumberof
importantissuesinsteadofoverwhelmingthemwithallpossibleoptions.Forexample,
BondWorksoriginallypresented85attributesoftradablebondsonthesearchresultsscreen.

However,searchloganalysisshowedthatnearlythreequartersofusersweresearchingononly
10oftheattributes,sothescreenwasredesignedtofocusonthoseattributes.
OEConnectionproactivelytakesthenextstepwhenasparepartisbackorderedfromthe
manufacturer:thesoftwareautomaticallyproceedstosearchotherdealers'inventoryforthe
desiredpart.Traditionally,userswouldhavehadtoissueeachtypeofsearchseparatelyfrom
separateapplicationareas.Butthat'sexactlytheapproachthatturnshumansintorobotic
buttonushersbettertoturnthecomputerintoaproblemsolvingtoolthatunderstandsthe
domainandletsusersexpendtheirbrainpoweronhigherlevelissues.
Asanotherexample,theHighlightapplication'sbasicfeatureistomakeaudiorecordings
searchablebylettingusersaddamarkerwhensomethinginterestingoccurs.Forrealworld
taskssuchasconductinginterviewsorsittinginaforeignlanguageclassuserswouldn't
actuallyknowthat"somethinginteresting"wasbeingrecordeduntilafterithappened.To
accommodatethiscommonscenario,theapplicationhasanoffsetfeaturethatautomatically
placesthemarkerintotherecordingacertainnumberofsecondsbeforethebuttonispushed.
Instanttimetravel.
Moretothepoint,Highlightusesthecomputer'sflexibilitytoaugmenthumanskillsbytaking
overthetediousjobofrewindingtherecordingwhenusersrealizethatsomethinginteresting
shouldhavebeenmarked.Thisreducesusers'cognitiveloadandfreesthemtoconcentrateon
listeningtotheeventthey'rerecordinginsteadofattendingtothedevice.
AnothersimplewayHighlightaugmentshumancapabilitiesisinitsabilitytoassociatea
picturewitheachrecording.Thisisparticularlysimplewhendoinginterviews,whereuserscan
snapaphotooftheintervieweewiththesamephonethat'srecordingtheaudio.Thesephotos
comeinhandylaterwhenretrievingrecordingsfromlonglists,becauseit'softeneasierforour
poorbrainstoassociateaninterviewwiththeperson'sphotoinsteadofrelyingonatextual
description.
Wealsosawatrendtofocusscreenrealestateallocationsontheinformationthat'smost
importantinthecurrentcontext,whileshowinglessUIchrome.Morecontent,lessapplication
overhead.
Somewinningapplicationshadspecialsmallcontrolpanelsfordirectaccesstoimportant
operationsthatwouldusuallyhaverequiredaswitchincontext.Thisdoesn'tquiteequatetoa
modelessdesign,becausecomplexapplicationsdotendtohaveseveraldistinctstagesor
areasofworkflowanddata.ButsurfacingcrucialfeaturestoliveabovetheregularUI
architectureisyetanotherwayofempoweringuserstoactontheirinsightsinsteadofdelaying
thembytherigiddemandsofthewaytheapplicationisstructured.

LinearWorkflowandWizards

Wewanttoempoweruserstobecreativeandaccomplishadvancedthingswithoursoftware.
Butweshouldalsorecognizethatuserssometimesjustwanttogettheirtasksdonewithout
havingtoexplorenumerousoptionsandnewideas.
Tospeedusersthroughinfrequentorcomplicatedtasks,it'softengoodtopresentalinear
workflowwithminimaldisruptionsoralternatives.Yes,thelackofflexibilitycanfeel
constraining,butitcanbefastertojustpowerthroughallthestepsinsteadofhavingtoponder
whichstepsareneeded.Also,thecostoftoomuchfreedomisthatusershavetodecidethe
orderofthestepssomethingthatthey'reoftenhappyenoughtodelegatetothecomputer.
Wizardsaretheclassicapproachtolinearworkflows,andseveralwinningapplicationsinclude
nicelydesignedwizards.TheClimateActionPlanningToolusesthesimplerapproachofoffering
numberedstepstoguideusers.AnearlydesignincludedaBeforeYouStartstep,butuser
studiesshowedthatpeopleignoredit.Inthefinaldesign,theBeforeactivitiesappearunder
Step1:GatherBaselineEnergyConsumptionData.Usersjustwanttogetgoing,soyouneed
tobesomewhatheavyhandedifsetupworkisrequiredbeforestartingtherealactivity.
Wizardsdon'tworkforeverything.Inusertesting,Eventbritedevelopersdiscoveredproblems
withawizardforcreatingneweventsinthesystem.Becauseusers'mentalmodelsofsettingup
aneweventdidn'tincludeallthenecessarysteps,theyoftendroppedoffanddidn'tcomplete
thewizard.So,theteamdecidedinsteadtogowitha2stepprocessinwhichusersfirstentered
alltheinformationandthencustomizedtheirpages.
Whencreatingalinearworkflow,takecarenottosignaltousersthattheycanignore
subsequentstepsunlessit'strue.Forexample,afterthefirst6steps,Eventbrite'sworkflow
wasasfollows:
Step7:Changethecolorschemeontheregistrationpage.
Step8:Chooseprivacysettings.

Itmighthaveseemedlogicaltofirstfullycreatethethingthattheprivacywouldapplyto,and
thentochoosetheprivacysettings.Tosomeusers,however,Step7signaledthatallthe"real"
setupwasdoneandthattheremainingstepswouldbefrivolousdecorating.Iftheydidn'tcare
aboutthedecororweresatisfiedwiththedefaultcolors,somepeoplesimplystoppedatStep7
andnevergottotheprivacyoptions.

LivinginanEcosystem
Amajortrendamongthewinningapplicationsisamodularizedapproachtothetotaluser
experience,withmajorfeaturesoutsourcedtootherapplications.Designersacceptthattheir
productwillliveinanecosystemofotherapplications(andwebsites)andthatuserswilloften
prefertodocertainthingselsewhereinthatecosystem.

Relyingonotherapplicationstoperformworkforyourappisobviouslynotanewidea.Having
applicationsworktogethergoesbackatleasttothepipesinUnix.Butweseethisdonemore
oftennowthaninyearspast,whenamoremonolithicapproachwascommon.
Unlessyou'reIBMorGoogle,you'llneverbuildaspreadsheetthatrivalsExcel.Furthermore,
mostbusinessusersalreadyownExcelandknowhowtouseit.Thus,insteadofbuilding
spreadsheetlikefeaturesintoyourapplication,itmightbebettertofindasmoothwayto
integratewithExcelthroughdataexportandimport.Manydatarichapplicationsamongour
winnerschosethiscourse.
Asanotherexample,Wakeliciousdidn'timplementacompletesystemforuploadingandstoring
videosforInternetplayback.Instead,itoffersasimpleintegrationwithYouTube,whichnot
onlysavedtheteamtremendousdevelopmenteffortbutalsogivesusersaccesstoapre
populatedcontentlibraryfromwhichtochoosewakeupcallstosendtheirfriends.
Onecaveataboutrelyingonothersoftwareisthatit'softenbesttomodifyorsimplifytheuser
interfacestofittheneedsofyourusersbecauseofitsbroaderpurview,3rdpartysoftwareoften
embodiesunneededcomplexitythatit'sbesttohide.eReview,forexample,builtontopof
SharePointbutdesignedamorestreamlinedprocessthantheoneprovidedoutofthebox.
Althoughit'sgreattoleverageexistingapplicationsandInternetresources,applicationsmust
alsoprovidetheirownvalueaddintheircoredomain.Thiswasmostclearlyshownbythe
ClimateActionPlanningTool,whichactuallystartedoutasaregularExcelspreadsheetthat
couldperformthenecessarycalculations.Developingitintoarealapplicationtoguidefacilities
managersthroughtheworkflowandexplainandillustratethecomplicatedconceptsinvolved
inreducingCO2madetheexperiencemuchmoresuccessful.

SuperTooltips:InteractionDesignTechniqueoftheYear
InApplicationDesignShowcase#1,wedeclaredthelightboxtobetheinteractiondesign
techniqueoftheyear.Thistime,wesawimprovementsinabroadrangeofinteraction
techniquesbutnosinglenewwidgetthatwaswidelyused.
Severalapplications,however,enhancedanoldidea:thetooltip.These"super"tooltipsstretch
farbeyondtheiroriginalintentandthusearnedthespotastheyear'smostimprovedinteraction
designtechnique.Emerginginthe1990s,tooltips(or"bubblehelp")startedoffbyproviding
smallexplanatorytextsthatappearedascontextualhelpwhentheuserpointedtoacommand
buttonorotherinterfaceelement.
Thenewsupertooltipisn'treallya"tip,"butwe'llsticktothiswellestablishednamewithitslong
historyinGUIdevelopment.Asupertooltipisactuallyanexplanatorypopupthatappearsasa
rollovereffectwhenuserspointtoanitemintheuserinterface.This"item"mightbeacommand

orabuttonaswithtraditionaltooltipsbutitcanalsobeausercreatedobject,suchasa
messageorproductorder.Thefollowingscreenshotshowsatypicalsupertooltipvisualdesign:

ExampleofasupertooltipfromEventbrite.
Inadditiontostatichelptext,supertooltipsusuallycontaindynamicstatusinformationaboutthe
objectthatusersarepointingto.Thisletsusersseetheinformationinthecontextofalarger
overviewscreen,insteadofhavingtoclickthroughtoaseparatescreenwithdetailedobject
propertiesandeditingoptions.Supertooltipsarethusparticularlysuitedtocomplexapplications
withmanydataobjectsthatusersmustconsidertogether.
Thesupertooltipshouldn'tincludeeditingoptionsitshouldbeforinformationonly,sinceit
appearsonhoveranddisappearswhenusersmovethemouse.Usersshouldalsoretainthe
optiontoclickthroughtoaspecificscreenthat'soptimizedforviewingandrevisinganobject's
propertiesingreaterdetail.
TheentireDixioapplicationcouldbeviewedasanevenmoresoupedupsupertooltip.
However,thatwouldn'tbeentirelyaccuratebecauseDixioexplanationsappearwhenusers
doubletap(orlongtap)aword.Thus,it'snotarollover/hovereffectandhastobeexplicitly
dismissed.

UsabilityMethods
Mostwinnersextensivelyemployedawidevarietyofusabilitymethods,whichiscertainly
onereasontheyendedupwithsuchgooduserinterfaces.Iterativedesignandusertesting
wereparticularlycommonandfrequentlyusedtogrinddowncomplexityrelativetoearlydesign

ideasthatseemedgoodbutprovedtoodifficult.Anothercommontrendwasthesteady
reductionindocumentationandhelptextthroughouttheiterations,asusertestingrepeatedly
revealedtheoldlessonthatusersdon'treadverymuch.
Simpleusertestingwithahandfulofuserscanoftensubstantiallyimproveproductsuccess,and
wasusedby85%ofthewinningprojects.Forexample,anearlydesignfortheMobileUnified
CommunicationclientusedthecommandAddCallforplacinganewphonecallwhileputting
thecurrentpartyonhold.Althoughthisseemslogicalenough,itwasconfusingtouserswho
thoughtthecommandwasforconferencecalls.ChangingthecommandlabeltoNewLinedid
thetrick.
Onethirdofthewinnersusedfieldstudies(alsoknownasethnography),venturingonsiteto
observeusers'naturalbehaviorsintheirownenvironments.FromBondWorkssittingwith
brokersastheymadedeals,toOEConnectionhangingoutindealershippartsdepartments,to
VitreaTeachwatchingradiologistsathospitals,domainspecificapplicationsrequiredomain
specificuserresearch.
Althoughitseemsobviousthatdomainspecificapplicationsneedfieldstudies,mostdesign
projectsinthepasttypicallydidwithoutthem.WhenweanalyzedthefirstdecadeofIntranet
DesignAnnualwinners,wefoundthatfieldstudieswereusedbyonly10%ofthewinnersfrom
20012003andjust23%ofwinnersfrom20072009.Althoughthisrepresentedmorethana
doublingwithinasingledecade,it'sstillsadthatlessthanaquarterofgoodintranetteamsran
fieldstudiesatdecade'send.Goingfromaquarterofprojectstoathirdinafewyearsshows
continuedprogressforthisimportantmethod.
Inadditiontofieldstudies,wealsosawsubstantialgrowthinausabilitymethodthatwasoften
overlookedinthepast:sittinginonsupportcalls.Knowingwhycustomerscallwithproblems
isaprimewaytodiscoverpainpointsaslongasyourecognizethatacustomer'sdescription
oftheproblemmightbefarafieldfromtheunderlyingrootcausethattheredesignmust
address.
(Fullreportwithallawardwinningapplicationdesignsisavailablefordownload.)
Sharethisarticle:Twitter|LinkedIn|Google+|Email

LearnMore
Subscribetotheweeklynewslettertogetnotifiedaboutfuturearticles.
Articles
SliderDesign:RulesofThumb

Indicators,Validations,andNotifications:PicktheCorrectCommunicationOption
HelpPeopleCreatePasswordsThatTheyCanActuallyRemember
AChecklistforDesigningMobileInputFields
ProgressIndicatorsMakeaSlowSystemLessInsufferable
Allarticlesabout:Applications

FullDayTrainingCourses
ApplicationDesignforWebandDesktop
ComplexApplicationsandWebsites:Day1andDay2
ResearchReports
ApplicationDesignShowcase:2012
MobileIntranetsandEnterpriseApps
WebsiteToolsandApplicationswithFlash
CustomizationFeaturesDoneCorrectlyfortheRightReasons
ApplicationDesignShowcase:2008
ResearchReports

FullDayTrainingCourses

ApplicationDesignShowcase:2012

ApplicationDesignforWebandDesktop

MobileIntranetsandEnterpriseApps

ComplexApplicationsandWebsites:Day1andDay
2

WebsiteToolsandApplicationswithFlash

CustomizationFeaturesDoneCorrectlyfortheRight Articles
Reasons
SliderDesign:RulesofThumb
ApplicationDesignShowcase:2008
Indicators,Validations,andNotifications:Pickthe
CorrectCommunicationOption
HelpPeopleCreatePasswordsThatTheyCan
ActuallyRemember
AChecklistforDesigningMobileInputFields
ProgressIndicatorsMakeaSlowSystemLess
Insufferable

Copyright19982016NielsenNormanGroup,AllRightsReserved.