The document provides an overview of successful iPad magazine applications, analyzing their customer experience and user interface design. It highlights key statistics about iPad sales, app downloads, and eBook sales, while detailing a framework for evaluating digital publications based on layout, navigation, content interactivity, and user engagement. Additionally, it discusses competitive reviews of various apps, uncovering common user experience issues and offering key takeaways for better design practices.

1. July, 2010Top iPad Magazine ApplicationsCustomer Experience Winners in the Publishing Space

2. Dr. Philip Rhodes, Ph.D.Philip holds a Ph.D. in Information Design from the University of Portsmouth. He has extensive research and teaching experience in hypermedia design and information architecture. He speaks fluent Portuguese, having lived and worked in Brazil. Before joining OTOinsights, he worked with US solution providers Rare Medium and Sapient, as Director of Information Architecture. Specializing in offering user-centric online solutions within the banking, education, and telecommunications sectors. He also taught at several universities in Brazil and the UK, and has been widely published. Philip is both the Managing Director and the Director of Customer Experience Research & Design at OTOinsights, and a Fellow of the Royal Society of Arts.

3. Established in 1997, One to One Interactive is the first global enterprise to assemble a complete solution for brands, agencies, and publishers executing one-to-one marketing strategies. The company employs over 140 professionals in 7 offices located in North America, Latin America, Europe, and Asia.One of the 20 “Hottest Independent Digital Firms” GloballyAdAge, 2007One of the Fastest Growing Private CompaniesInc Magazine, 2008

4. OTOinsights OverviewEstablished in 2002, OTOinsights has conducted over 400 research project in over 30 countries.Specialists in customer experience strategy, research and designUndertake discrete point-in-time projects and strategic engagementsExperience across all platforms including digital (e.g. web, intranets, mobile devices, PDA’s, i-TV, etc.), call centers, retail environments and physical products (e.g. laptops, printers, etc.)OTOinsights Offerings:Amplifying Engagement

5. Publishing Clients5

6. Agenda

7. The ipad phenomena

8. iPad PhenomenaiPad has successfully launched

9. Sales have surprised some people – why has it been so successful?

10. Its Apple – media attention

11. Its small

12. Its portable

13. Its useful (everyday tasks)

14. Its very ‘sci-fi’

15. Its got content – e.g. appsThe stats…2,000,000 ipads sold

16. 8,500 native iPad apps

17. 35 milllion app downloads

18. 5 million ebooks downloaded

19. 19 countriesApple - April 2010

20. iPad PhenomenaCurious statsNew York Times – 350,000 downloads in 1 week

21. Wall Street Journal – 10,000 active users in 1 week

22. $17 per month

23. FT - – 130,000 active users since launch (28 May)

24. The Times – 5,000 subscribers in 3 days

25. £9.99 per download

26. Wired – 24,000 downloads in first 24 hoursThe stats…By the end of 2010 there will be 8.13 million iPad globally

27. Electronic book sales in the US have risen dramatically in the last few years

28. $11.2m in Q1 2008

29. $25.8m in Q1 2009

30. $91m in Q1 2010

31. In the UK:

32. £75-80m in 2008

33. £150m in 2009Publishing Statistics

34. iPad review framework(Digital publications)

35. Review FrameworkLayoutNavigationUsableUsefulEngagingContent and InteractivityLikelihood to reuse

36. Review Framework | Evaluation criteriaItems of related content are kept together.

37. Content is shown within context to preserve meaning.

38. There is a consistent experience between landscape and portrait views.

39. There is a consistent layout of key elements across all screens of the app.

40. The app doesn’t force users to rotate the iPad.LayoutNavigationContent and InteractivityLikelihood to reuse

41. Review Framework | Evaluation criteriaSuitable web navigation elements, e.g.hyper-links.

42. Multiple options for hyper-links, such as both article headlines and images from a contents page.

43. Uses conventional iPad gestures.

44. Provides visual affordance to navigational elements

45. Allows users to recover from mistakes by going back.

46. Provides a search.

47. Navigation is consistent throughout the app

48. Users can identify where they are:

49. Within each article

50. Within the app itselfLayoutNavigationContent and InteractivityLikelihood to reuse

51. Review Framework | Evaluation criteriaAll content from a landscape view is also available in a portrait view.

52. All content from the printed version should be included, if not more.

53. Individual interactive elements are easy to use.

54. Interactive content affords an appropriate use.

55. The app doesn’t persist with gesture manipulation of content when it provides no benefit.LayoutNavigationContent and InteractivityLikelihood to reuse

56. Review Framework | Evaluation criteriaContent appeals to users and is useful.

57. Use of high quality images.

58. Use of alternative media such as video and audio.

59. Use of interactive elements such as 360˚ image manipulation.

60. The app is innovative:

61. The content cannot be found elsewhere.

62. The content is presented in a new way.LayoutNavigationContent and InteractivityLikelihood to reuse

63. Competitive Landscape

64. COMPETITIVE rEVIEW

65. Competitive Review | Results

66. Competitive Review | Results

67. Competitive Review | Results

68. Competitive Review | Results

69. Competitive Review | Results

70. Competitive Review | Results

71. Competitive Review | Results Surprising number of user experience issues in these very successful iPad apps:

72. iPad orientation changing the content offering

73. Navigation not always clear or intuitive

74. Lacking ‘normal’ conventions e.g. hypertext links as links, easy means to return to primary pages

75. Layout confusing

76. Images and text not matching

77. Lack of interactive features

78. Lack of search

79. User orientation within articles confusingCompetitive Review | Results Explanation

80. LayoutText is consistently presented in the same column layout

81. Presentation persists across the two orientations

82. As the user scrolls, background images are changed to stay in context with the text being presented

83. This keeps items which are related together as well as preserving the meaning of images in relation to the text

84. Users are told to rotate the iPad to view some articlesNavigationUsers can flick the magazine left or right to view different sections, and move into an article by swiping up and down

85. Navigation is consistent throughout the app

86. Difficult to know how many sections or pages are included in the magazine

87. No links are provided from the contents and cover page

88. There is no search featureNavigationIt is difficult for users to identify where in the app they are

89. It is also difficult to quickly skip to specific sections of the app

90. If a user taps the left of the screen the text elements disappear.

91. It is not initially clear how to bring the text backContent & InteractivityAll content seen while the iPad is in portrait are also shown when the iPad is used in landscape

92. Gesture manipulation is included for pages where it serves no purpose.

93. Text give the impression of being able to scroll to further contentLikelihood to reuseThe content will appeal to current Popsci readers and those interested in the subject

94. High quality images are used throughout the app

95. The content closely matches what is found in the magazine but is presented in a new way

96. Other than being able to move images and text independently, little is made of the publication being in digital form

97. There are no video/audio elements or interactive pieces of contentCompetitive Review | Results Explanation

98. LayoutThe GQ app doesn’t force users to rotate the iPadin order to see content.

99. Once the user has chosen their orientation, the layout of key functions such as moving between images, is consistent.

100. However, the layout between portrait and landscape is very different.LayoutNavigational layout between the two orientations is inconsistent

101. When turned to portrait, images and their related text are separated

102. The two are shown in separate panels

103. As the user moves through the images there is no indication of how these relate to the article.NavigationTypical iPad gestures are supported through most of the app

104. Navigational elements are provided

105. These are easily identifiable

106. The user can clearly see where they are within an article and within the app

107. Using the quick ‘contents feature’ allows the user to skip directly to an article.NavigationThere are a number of places where hyperlinks are not used

108. Such as the GQ logo as a route back to the cover/contents and article titles on the cover page

109. The contents list is not available when in landscape

110. There is no search feature

111. The pinch gesture cannot be used to zoom text in portraitContent & InteractivityIndividual interactive elements are easy to use and do not require precise finger movement

112. These interactive elements clearly indicate their use

113. The app only allows gestures when they are of use.

114. Not all content found in landscape is available in portraitLikelihood to reuseThe content is the same as found in the magazine and will therefore be useful to GQs audience

115. High quality images are used throughout the app

116. There is no inclusion of audio or video content

117. The interactive content is minimalCompetitive Review | Results Explanation

118. LayoutItems of content which are related are always kept together

119. The user will have to actively select a slide-shown to view images in isolation

120. Experience between portrait and landscape differs significantly

121. The location of images changes

122. Video is also included in landscape but not portrait

123. Users are often forced to rotate the iPadwhen there is no need to.

124. Most notably for videoNavigationHyperlinks are used to take users directly to articles

125. User are able to click on article headlines or related images

126. Conventional iPad gestures are used to move page and enlarge content

127. Users can quickly locate themselves and move around using the efficient ‘page viewer’

128. Current location is clearly highlighted

129. Users are able to go ‘home’ to either the contents page or the cover pageNavigationIt is not particularly clear which elements can be used to navigate

130. In this example, the map suggests links – this is not the case

131. It is not possible to move back if the user jumped to an article by mistake.

132. There is no searchContent & InteractivityInteractive content such as image slide-shows are clearly identified and easy to use

133. Many contextual images are completely lost when using the app in portrait

134. It is often not possible to increase text size when in landscapeLikelihood to reuseAll content from the magazine is included in the app

135. High quality images are used throughout.

136. Video is also used to supplement some article

137. There is very little in the way of interactive contentCompetitive Review | Results Explanation

138. LayoutAll content is shown within context so it is always clear to the user how an image relates an article

139. There is a good level of consistency between landscape and portrait orientations

140. Users are not forced to rotate the iPad at any point

141. There is a good level of consistency throughout the app.NavigationThe app provides a search

142. Navigation is consistent throughout the app

143. Users can clearly see where they are within the app

144. Typical iPad gestures are used to turn page and enlarge contentNavigationThere are no hyperlinks within the app

145. An apparent ‘back’ button take the user out of the current magazine

146. It is not possible to return to a clear starting point such as the cover page or contents pageContent & InteractivityAll content available in landscape is also available in portrait

147. The app only uses simple gestures

148. Gestures are not used unless they are needed.

149. Interactive elements such as the contents and search use straightforward interfacesLikelihood to reuseHigh quality images are used throughout the app

150. Limited interactivity is available

151. Such as the ability to share magazines with others

152. However, most of the content is static.

153. The app does not provide the content in a way that differs much from the printed magazineCompetitive Review | Results Explanation

154. LayoutContent is fixed in a traditional printed article format so all related items are kept together

155. Images and video content are shown within the context of the article rather than in isolation

156. Users are provided with a consistent experience between portrait and landscape views

157. On some article title pages it is not clear that the user can navigate to further content

158. The title pages look and feel very much like a one page advertOne page advertArticle title page with content hidden below

159. NavigationSuitable links are used throughout the app, from the contents page through to external links

160. Conventional iPad gestures are used and reinforced through use of icons

161. Navigational elements appear in a way as to invite users to interact with them

162. Users can easily identify where they are within appNavigationSome elements are presented in the same way as links, but do not provide a link

163. Images associated with articles on the contents page are not links

164. There is no search

165. Within each article is it difficult for users to see whether there is more content

166. It is not clear to users where they are within an individual articleNumbered buttons – not linksNumbered buttons – links

167. Content & InteractivityThe app maximises the fact it is on an iPad to bring the user more content than they would have on the printed version

168. Gestures are only used when it makes sense for the user

169. Interactive elements are easy to use

170. Clear sign-posts of when and how use are given.

171. All content available in landscape is also available in portrait view.Likelihood to reuseHigh quality images are used throughout the app

172. Video and audio content are included within relevant articles

173. Users can interact with images for a 360 view and to provide detail on what is being shown

174. The app provides content that cannot be found elsewhere from WiredAdvertising

175. AdvertisingAd supported apps are common amongst both free and paid for publications:

176. Wired

177. New York Times

178. Wall Street Journal

179. The Times

180. A number of approaches have been taken:

181. Flat-content, one page

182. Flat-content, multiple page

183. Basic user interaction

184. Audio/video content

185. Interrupting adsAdvertising| Flat content – one pageProvides consistency with other advertising mediums

186. Relatively unobtrusive

187. Provides the entire message in one hit

188. Unlikely to engage the user

189. Missing an opportunity to drive the user to further content

190. Sign-up process for example

191. Unlikely to ‘educate’ users about the message or productAdvertising| Flat content – multiple pageMore space allows advertiser to build useful content for targeted users

192. Such as ‘how to’ guides

193. Allows advertiser to mimic articles so as to sell products subtly

194. Chance of content on later pages being missed by the user

195. Especially if the front page of the advert doesn’t allude to further content

196. Missing an opportunity to drive users to further contentAdvertising| Basic user interactionClearly interactive elements invite users to stay on the page and interactive with the advert

197. More engaging than flat content

198. Can lead the user to product related content

199. To make an order or to sign-up for a service

200. Strong possibility that hidden content may be missed

201. If links to further content take users out of the ‘app environment’ then user may show renitence or negative reactionsAdvertising| Audio/video contentMost engaging content

202. Effective way to educate users about a product or service

203. Novelty effect – provides ad content that isn’t found in the paper version of the publication

204. Encourages users to spend more time with the advert

205. Message may be lost on users who skim over the pageAdvertising| Interrupting adsUsers are forced to see the product/brand

206. Users must think about how to interact with the advert in order to progress to their desired destination

207. Likely to irritate users

208. Provide a negative image of the app and the advertiser

209. Users may dismiss the advert as it was not what they were looking forAdvertising | What to avoid!Forcing users to rotate the iPad in order to see that ad

210. Apps where all ads are removed when the user rotates the iPad

211. GQ – no ads shown in portrait view

212. Hiding the most important message in ‘scrolled to’ content or behind interactions

213. Forcing users to watch a video without them requesting to do soKey Take-Away points

214. Key Points | LayoutIf elements can be manipulated independently of each other then ensure that context is kept

215. For example it is good to avoid showing a user an article that discusses something shown in a picture that is no longer visible, as seen in the GQ app

216. Ensure that individual page elements don’t lose meaning through lack of context

217. For example, if photos are presented separately from the text of an article then care must be taken to ensure that the reason why they were included in the first place is not lostGQ – separate image and text in an article

218. Key Points | LayoutPortrait V Landscape

219. While obvious changes need to occur to cater for the change in screen dimension, consistency between the two layouts is useful so that users do not have to learn a whole new set of rules just because they have rotated the iPad

220. Don’t force users to rotate the iPad.

221. It may be beneficial for the user to view some content in landscape, such as video, but allow the user to decide whether they do this or not, unlike what is seen with the Time appTime – the same article shown in portrait and landscape

222. Key Points | LayoutConsistency between pages

223. Pages do not have to look the same, or even be laid out exactly the same, but consistency of key elements is important

224. Key elements, such as a route back, route to the contents page, moving to the previous or next article should all be positioned in a consistent mannerNew York Times – All images are clickable, route back is always shown at the top left

225. Key Points| NavigationBring the most beneficial elements of web navigation to the app

226. Hyperlinks to related content such as linking directly to articles from a homepage/contents page

227. The app does not have to exactly mimic a website

228. There doesn’t have to be a “main menu” or “Next page”, “Next article” buttons etc

229. Increase the users routes for navigating

230. If a contents page includes headings and images for an article, make both parts a link to the article page, as found with the New York Times app.New York Times – All Headlines and images are links to the full story

231. Key Points| NavigationUsers are quickly becoming accustomed to many touch-screen gestures, such as tapping, swiping and pinching

232. Users will feel more comfortable when performing these gestures will give expected results, such as:

233. Tapping means activate (or click in web terms)

234. Swiping means to move (down an article or across an article, or to another article)

235. Note: The PopSci app uses the tap action to make text disappear which is likely to confuse usersPopSci – A tap on the right of the screen makes the text disappear

236. Key Points| NavigationNavigational elements should have some visual characteristic that affords use (a tap or swipe)

237. While this does not have to be a strong as found on the web (with a submit button for example), it is beneficial to have navigational elements appear differently to flat elements in order for them to be easier for users to discover

238. Allow users to undo what they have done to allow them to recover from mistakes

239. Ensure users can get back to where they were and not just a back to the cover page, or back to contentsWired – the dual arrow icon gives affordance of a “back and forth” swipe movement

240. Key Points| NavigationProvide a search

241. Make the most of having the content in a digital form by allowing users to search

242. Keep navigation consistent

243. Navigational items should appear in consistent locations on the screen

244. This should be the case whether in landscape or portraitDwell – searching for content

245. Key Points| NavigationInform the user where they are

246. Some reference to where they are in the article, and within the publication is useful.

247. Clear vertical scroll bars help to identify within-article location.

248. Having a visual representation of the number of pages and highlighting the current page also works well for within-article location.

249. A scrolling index works well to identify location within the publication, as well as aiding navigation.New York Times – number of article pages shown using standard apple pips at bottom of the page

250. Key Points| Content & InteractivityWired – Image content can be manipulated by the userAlthough there will be a temptation to exactly replicate the magazine or newspaper page for page on the iPad – don’t

251. While this is not necessarily wrong, it means the user misses out on a number of benefits the digital age has brought, such as:

252. Hyperlinks - both within the app and externally

253. Embedding of video or audio content

254. Interaction with the app with elements such as forms for entering competitions.Key Points| Content & InteractivityGive users a reason to use the app

255. It should, at the very least, provide the user with all the content they can get through printed version, if not more

256. The user should not miss out on content because of the orientation of the iPad

257. All content that is shown when holding the iPad in landscape should also be shown when holding the iPad in portrait and vice-versa.Key Points| Content & InteractivityInteractive elements need to be easy to select

258. For lists of links, fields in forms etc. it must be remembered that a finger is not as precise as a mouse pointer. These elements need to be sufficiently spaced to allow a user to accurately select the one they wish.Financial Times – Interactive elements are all located together and are easy for users to select individually

259. Key Points| Content & InteractivityAs with navigation, interactive content should afford whichever interactions can be used to manipulate it

260. If text can be edited, or empty text boxes filled, then they should give the impression that this is the case.

261. If a static image is a placeholder for video content, then it should be clear the user has the ability to “play” the video

262. Don’t allow users to change layout for the sake of it. If all content fits onto one page then allowing users to remove or move some elements off the page may cause unnecessary confusion.PopSci – A tap on the right of the screen makes the text disappear

263. Key Points| Likelihood to reuseLikelihood to reuse an app is based primarily on how useful the user finds the content within it, how engaging the experience is and how innovative the app is.

264. How deeply users become engaged in the content relies very much on the users personal tastes and the content and style of the publication in general.Key Points| Likelihood to reuseWith regards to how engaging the app is, a number of factors should be considered.

265. Quality of imagery or videos used.

266. High quality images that make the most of the iPads great graphical capability will enhance the experience of the user.

267. Include media types that cannot be found on the printed form.

268. Video content and audio content help to improve the level of user engagement and also help distinguish the experience on the iPad app from that of the printed magazine or newspaper.The Times – Video content used to supplement an article

269. Key Points| Likelihood to reuseIncluding interactive elements that go beyond just video or audio also improve the level of engagement.

270. The ability to build a list of favourite articles, send articles to other people and manipulate 360˚ images are all examples.Sideways – Ability to link to a facebook account and share articles

271. Key Points | Likelihood to reuseThe more innovative the app, the more likely users will use it in the first place, and the more likely they are to continue using it.

272. Providing the user with content they can’t get elsewhere

273. Providing users with content in a way that is not currently doneSideways – Interactive map

274. Conclusions

275. ConclusionsDevelop a strategyRemember the user

276. Focus on the users needs

277. Ensure that users are in control, informed and flexible

278. Cater for all user situations

279. Browsing content Vs Looking for specific information

280. Reading in portrait Vs reading in landscape

281. Make the user’s experience usable and engaging

282. Make the most of the possibilities the iPad offersQuestionsDr. Philip Rhodes: prhodes@otoinsights.comFor copies of the presentation or further info on One to One interactive services: marketing@onetooneinteractive.com