Transcript of "iPad Usability Best Practices Checklist"
August, 2011 iPad Usability Best Practices ChecklistIntroductionIn 2010, the year the iPad launched, The NielsenNorman Group conducted a first usability studyreporting how real users actually used a broadvariety of iPad apps as well as websites accessed onthe iPad. In 2011, they did a second round, fine-tuning their previous findings. The results are two+100 pages reports containing their findings,recommendations and screenshots.This document synthesizes these recommendationsonto 5 pages for use as a quick reference orchecklist.The full reports can be downloaded for free fromthe Norman Nielsen Group website:http://www.nngroup.com/reports/mobile/ipad/Geert De LaetTechnology evangelistLUONLUON | www.luon.com 1
iPad Usability Best Practices ChecklistFeatures users that they will find extra content by turning the tabletAssume you’re designing for a multi-user deviceiPads are more a family device than a true personal If your app needs more than 20 seconds todevice. download content and become fully functional, think seriously about how you are going toDesign for repeat users entertain the user during that download time.Apps work best when they are designed forcustomers who are already fans of the brand and Keep users at the same location (within theengage with it on a regular basis. content) when they change orientation. In particular, when users rotate the tablet back toYour iPad app should have a secret weapon the previous orientation, reestablish the previouscompared to your website, it should deliver extra viewvalue Any task flow should start with actions that are essential to the main task. Users should be able to start the task as soon as possible. Provide a search box Epicurous.com secret weapon: recipes in a format easy-to-read in the kitchen Content Make sure your app contains enough content forDo not make users work more in your iPad app research.than on your website Especially for e-commerce apps, people are unsureExample: don’t make users pay or register for an about how secure iPad is compared to otherapp containing freely available content from the devices. Hence they will not very often buy viawebsite their iPad, but rather browse and research itemsDo not design an iPad app as if it were an iPhone Keep the same content available in bothapp. orientations, at both article level and page level.The iPad is less ‘mobile’ than the iPhone and used To make the content consistent at the page level,in another context where a condensed, space- look for natural breaking points (e.g. newsaving presentation of information does not apply. paragraph) and keep those in both orientations.If a feature is only available in one orientation, tellLUON | www.luon.com 2
iPad Usability Best Practices ChecklistIf you must include instructions, make them clearand simple Tapping anywhere inside the cell will activate the button Bing instructions are clear and simple. They focus on a single feature. Make buttons look tappable Users don’t know that something is touchableIf you must include instructions, focus on a single unless it looks sofeature at the time.Present only those instructions that are necessary Make efficient use of the big screenfor the user to get started Use popovers only if the content is only a few lines and there is no scrollDesign if the user needs information from theBeware of read-tap asymmetry underlying page (in which case it should beRead-tap asymmetry is the effect that content is readable)readable, but the links and widgets are too small to Otherwise, use a tabular view on a pagetouch reliablyThe best target size for widgets is 1cm x 1cm fortouch devicesDon’t place targets to close to each otherUse padding as a solution for small targetsWith padding, although the visible part of thetarget may be small, there is some invisible targetspace surrounding it, so that if a user hits that An example of a popover with few lines andspace, their tap would still count. With touch no scroll.devices, users expect padding in tabular views!LUON | www.luon.com 3
iPad Usability Best Practices ChecklistUse small modal views only if there’s enough space Add a back button to the navigation bar, and maketo display all needed info sure that it also works on the home pageOtherwise, if there’s a lot of content to display like Use the same navigation scheme in landscape andfor example on product pages, use a separate page portrait mode For iPad magazines, the navigation bar should contain a table of contents link taking the user to a table of contents page in the magazine. Especially for iPad magazines, where the table of contents is often used, make sure that it is Modal views are little ‘popup’ windows easy to access that block the underlying page until closed scannable, explanatory & clearly formattedIf you use swipe gesture for navigation, Use navigation bars built into the actual page make sure that the page contains enough space rather than the iPad’s tab bar at the bottom. safe for swiping next to the two vertical sides The iPad’s tab bar at the bottom is far less avoid covering the pages with carousels and frequently used than its iPhone equivalent. other design features that interfere with swiping When designing a carousel for navigation, it isDuring the initial download of the app, display a important to move the carousel display so that itprogress bar, not a spinning gear starts or is centered around the product or article that the user is inspectingThe controls that are related to a task should begrouped together and reflect the sequence ofactions in the task.Do not use startup sounds, animations or videosNavigation A carousel is an interface element used forDon’t use the logo for navigation scrolling through items on part of the page.If you use swipe gesture to navigate, give visiblecues (arrows, tips) to indicate the direction ofnavigationLUON | www.luon.com 4
iPad Usability Best Practices ChecklistUser input About LUON LUON is a customer relationship marketing agency.Minimize user input on the iPad: By developing campaigns and programs based on smart ideas, relevant content and a matchingCompute information for the user experience, we help brands benefit from a fruitfulBe tolerant of typos and offering corrections relationship with their customers. Its all a matter of making the right offer at the right moment in theSave history and allow users to select previously customer’s lifecycle, across all relevant interactivetyped info media.Use defaults that make sense for the user Every project we work on is based on clear and measurable objectives. Which helps us in ourKeep the user logged in if the app doesn’t store any burning ambition to achieve extraordinary Returnsensitive information On Marketing Investment, together with greatAllow the users to decide if they want to be kept clients such as Unilever, Sony Ericsson, Vaillant,logged in if the app contains sensitive info Tech Data, Thomas Cook, Microsoft, Fnac and Ello Mobile. Contact Geert De Laet Technology evangelist firstname.lastname@example.org @geertdelaet Gert Lintermans Client Services Director email@example.com +32 478 32 46 00 LUON bvba Brusselsesteenweg 560 - 3090 Overijse – Belgium T +32 2 686 00 10 - firstname.lastname@example.org - @LUON http://www.luon.com/LUON | www.luon.com 5