The iPad is one of the few mobile devices that’s shared among household members. This is surely the case in my home. I often walk into my office to grab my iPad and discover an empty dock. “Where’s my iPad?!?” I shout as I stomp towards the living room. “You mean the Boggle board?” my housemate asks. He calls it the Boggle board since Quordy is his favorite app to play on my iPad. And what about me? Well, my favorite thing to do on the iPad is read, mostly books but also newspapers and magazines. Two apps that inspire me to read news on my iPad are Flipboard and Pulse. I’m reviewing them in this article partly out of personal interest but also because they have interesting UI differences. I’ll start by reviewing the six main parts of the apps: the new user experience, the home page, adding content, viewing sections, viewing articles, and transitions. At the end of the article, I’ve included some best practices based on the review.
New User Experience
The two services have distinct new user experiences. Flipboard users are greeted with a Ken Burns style slideshow drawn from their “contributors” along with strong branding and a big Flip button. This approach makes for a nice screensaver when the app isn’t in use, inviting me into articles that I may not have considered. In contrast, Pulse readers see “how to” information overlaid on top of the news grid. Tutorials are generally fine as long as they’re not trying to compensate for UI flaws. One could argue that most of the Pulse features highlighted should be discoverable in absence of any tips.
Example Flipboard Opening Screen
Pulse Opening Screen (new users only)
Home Page
Once users get past the respective opening screens, they are presented with a home page containing an overview of the app contents. Pulse’s home page is relatively dense, occupying nearly every inch of the screen with content. Flipboard’s layout is far more sparse, containing ample white space as well as a very clear “Add a section” button. Pulse users can also add content from this page but it’s less direct—they must tap the Settings icon, then choose “+” in one of the columns, and then return to the home page. This approach works but I prefer the directness of Flipboard, given that adding content is one of the first things users will want to do. Oh, it looks I spoke too soon, I just noticed that you can add content from the Pulse home page but you have to scroll past the existing content. New users are less likely to discover this functionality if placed out of view.
Adding Content
One of the key differences in this area is the type of content users can add to each app. Both services allow users to add popular news services as well as RSS feeds (though Pulse limits this feature to Google Reader users) but Flipboard also enables users to add Twitter feeds. This is perhaps one of my favorite features, as it can make a 140 character Tweet far more interesting when the related content is shown, e.g., the photo or article text. The UI elements for choosing content are also quite different when comparing the apps. Flipboard has a flat list of sources whereas Pulse uses a tab bar to break-up the different ways to find content. I personally prefer the flat list since everything is in one place, but it could get unwieldy if more options are added in the future. Lastly, the Flipboard categories include text to indicate what sources can be found in each category, e.g., “Food & Dining” has the description, “FlipEats, Bon Appetit, Smitten Kitechn, AlltopBacon” but Pulse only has the word “Food & Living.” It’d be nice to see more information before users drill into the category.
Viewing Sections
The alternative approaches for viewing “sections” illustrates how Pulse is more “appy” and Flipboard more “magaziney.” Flipboard has section pages with varying sized modules like a magazine or newspaper. And when users dig into a section, they can scroll through it from start to finish, using the slider at the bottom of the screen, similar to iBooks. Pulse has sections on the start page and along the bottom of individual articles but no dedicated section pages. Both approaches are effective; which one users prefer may be related to their mindset: productivity or relaxation. For example, some people may prefer Pulse since fewer layers makes it more efficient, but others may prefer Flipboard since features like the sections and flip transitions make the experience feel more leisurely.
Viewing Articles
At this point, it’s probably no surprise that the app’s also have different design strategies when it comes to the article view. For one, Flipboard displays their articles in an overlay. If users choose to view an article on the Web, Flipboard opens up yet another window that must eventually be closed. On the other hand, Pulse has dedicated article pages with a toggle to switch between text and web views. The Pulse approach feels much cleaner since it keeps users within context, plus the dedicated page means slightly more screen real estate. Another difference which was frustrating is that a number of Flipboard articles only show one or two lines before forcing you to the relevant web site. This may be a requirement for certain sources (perhaps some Pulse articles have the same problem?) which is unfortunate for the user experience. Finally, one of the most interesting article differences was the Twitter integration. With Pulse you can share articles via Twitter but with Flipboard you can actually Tweet inline and see other Tweets—nice touch.
Pulse Article View (with navigation shown)
Custom Transitions
Both apps incorporate custom transitions into the user experience. Flipboard has their own unique center-page flip which is used between sections but also to refresh the home page modules. Pulse uses a slide transition from the home page to the article view and a combination of transitions when moving from View to Edit mode. All of these transitions are worth referencing since they add value to the user experience and reinforce the apps’ brand identities (perhaps more so for Flipboard but I think for Pulse to some extent as well.)
Summary
Flipboard and Pulse are both well-designed apps that are enjoyable to use. In this article I reviewed the UI differences in six key areas: the new user experience, the home page, adding content, viewing sections, viewing articles, and transitions. Some differences may simply be a matter of preference, but others suggest potential usability issues. As you build your own apps, keep these best practices in mind.
- Tutorials should be used sparingly. Be certain that you’re not trying to mask an underlying usability problem.
- Make sure key features are easily accessible. Users shouldn’t have to scroll or tap multiple buttons to find them.
- Don’t force users to pogo up and down list views. Try to surface enough information to help them make educated decisions.
- Keep overlays to a minimum. Displaying too many layers can be disorienting for users.
- Choose interactions and transitions that support your design and branding strategy.
Good luck with your apps!
