Best Practices for Digital Product Design

For the last year, the publishing industry’s complacency about digital media has been rocked by the furor over the iPad (as well as other tablets arriving on the scene). Now our research – picture-in-picture usability testing of native versus “replica” iPad magazine apps – is shedding some light on logical next steps.

Publishers and iPad: From underestimation to magical thinking

At first, the iPad was severely underestimated. Then, it became the salvation of all publishers with its promise of lush visuals in a tablet format. The intuitive swiping action seeming to resemble the familiar action of turning pages in a print publication. Magazine publishers breathed a sigh of relief. No more designing for the web. Now all we have to do is put our magazine, as is, on iPad and call it our app. Wrong.

Evidence: our usability test of “replica” vs. native apps

We’ve been suspecting as much, but this month’s usability test of a magazine “replica” app versus a native iPad app, conducted with eight carefully screened users, proved our suspicion: the “replica” app gets initial positive comments, until the user actually has to interact with it.

Rahul (bottom right) is bemused by the “replica” app; conventional magazine layouts look dated on iPad

One of our favorite partners had the foresight to test both versions prior to making a strong commitment to either. The users – highly educated professionals of the greatest technical literacy – participated in our comparison test.

In our test, we chose an article of high interest to the audience, and presented to users in three contexts: the “replica” app (in other words, a glorified digital edition), the native app (designed to take advantage of the iPad platform), and on the magazine’s website. I asked each user to skim the article from beginning to end, and to comment on their experience. The interaction patterns were consistent throughout the usability test.

The replica app scored well on familiarity. Its assets ended there. Users struggled to reach the end of the article because of page jumps – a convention that presents little inconvenience in print, but becomes a real obstacle for tablet users. Reading text in print-based layouts was clearly onerous. Zooming in on text did not render sharp, crisp images, so readability was impacted as well.

From “replica” familiarity to native-app engagement

While users initially were confused by the layout of the second app, which was presented within the Adobe Content Viewer framework, they were able to orient themselves once they understood the context. The most important take-away: The same content, designed for a tablet experience, becomes far more compelling. The users were more immersed in the story because they didn’t have to figure out how to move the screen around in order to read print-based columns. Text sizes were specifically designed for reading on iPad. Images became more meaningful because they were able to load them into a primary viewing area, both enlarging the image and engaging the user. Finally, the presence of brief video and sound in the native app design added greatly to the relevance of the article.

Finally, we returned users to the same article on the web, asking them to skim it within the Safari browser on iPad. As I observed our first user launching the browser and looking at the article on iPad, I was struck by how messy the average website now looks when compared to an app. All those banner ads that we take for granted – or at least tolerate – on a laptop or desktop browser just look like clutter inside that same browser on a tablet.

Our usability test confirmed what many of us know already: Western users will instinctively swipe from right to left in the familiar page-turning metaphor. Bringing this simple design consideration into your app will ensure that users can begin to engage with your content immediately.

The beginning of research-based guidelines

We learned so much in this test that we will be examining and writing about findings for a good while, as we plan additional picture-in-picture usability tests of iPad apps. In the meantime, here are some very basic guidelines for iPad app publishers who started their lives in print-based media:

• Ensure the table of contents is easy to find.

• Assume that all users will expect to tap on items in the table of contents, with the expectation that they will go directly to content.

• Layouts for print – especially two-page spreads that begin with a primary image on the left – may confuse users when using the tablet in portrait mode. We saw multiple users tap an article of interest in the table of contents, only to be met with an unlabeled, seemingly irrelevant full-screen image.

• If you must proceed with a replica edition, test the experience of interacting with jumps. All of our users found this experience troublesome, and several resorted to workarounds to reach the rest of article content.

We’ll be delving more deeply into our findings shortly. In the meantime, try to conduct your research in advance of making a final selection for an app design vendor.

And for now, we’ll just reiterate what our users told us: native apps take advantage of the iPad platform in an engaging way.

Special thanks to Brian Peterson and Michelle Ayers of Interface Guru for solving the incredibly nerdy problem of creating compelling picture-in-picture usability testing footage of iPad apps.