ellipsis flag icon-blogicon-check icon-comments icon-email icon-error icon-facebook icon-follow-comment icon-googleicon-hamburger icon-imedia-blog icon-imediaicon-instagramicon-left-arrow icon-linked-in icon-linked icon-linkedin icon-multi-page-view icon-person icon-print icon-right-arrow icon-save icon-searchicon-share-arrow icon-single-page-view icon-tag icon-twitter icon-unfollow icon-upload icon-valid icon-video-play icon-views icon-website icon-youtubelogo-imedia-white logo-imedia logo-mediaWhite review-star thumbs_down thumbs_up

7 essential rules for tablet design

7 essential rules for tablet design Evan Gerber

Tablets present an interesting challenge for brands seeking to reach their users across multiple platforms. A company's website might look passable, but users are coming to expect tablet-specific experiences, regardless of whether it's a native app or a browser based experience.

7 essential rules for tablet design

Failing to build a scalable, tablet-friendly experience can yield significant consequences, from dropping conversion rates to frustrated, upset users. This article will explore how brand managers can create tablet-optimized experiences that take advantage of key features such as location, touch, and screen rotation to build beautiful and engaging experiences that feel perfect for this emerging form factor. By using case studies as examples, readers will see best practices in action.

Let's get started.

Play and learn

The very first thing that a brand manager should do -- and ideally do with or for the rest of the creative and technology teams -- is get people exposed to the form factor. Those new to tablets should spend time exploring apps that they like, performing more complicated tasks such as writing email, and basically playing around with what these things can do.

Searching for examples of great functionality, popular applications, and what is going on in verticals totally unrelated to a given brand will inspire great thinking. Equally importantly, playing with both iOS and Android will help designers understand the subtle but fundamental differences between the two operating systems.

Solid data informs content strategy and information architecture

It's tempting to assume that user behaviors will be the same on the desktop as well as the tablet, but it is absolutely not the case. To ensure that nobody makes uniformed decisions, start by gathering information on how people are using tablets, and then dial in to how a brand's customers view the content.

There are some solid sources for tablet usage, such as the Pew Report. For example, its article on how people use tablets to consume news is fascinating, unbiased research that can then be abstracted into content planning. Sites that offer long articles or time-sensitive content can benefit from knowing who users are and how they tend to engage such material.



From there, if a brand has a solid metrics program in place, it's possible to understand which platforms users are visiting on, when they are coming, and what pages they see. This is essential information when trying to decide which functionality should be offered in an app, both from the standpoint of the content required as well as particular features for the app. For example if only 10 percent of the content is consumed by tablet users, focus on that content for the initial release of an app. If the majority of users are on iPads, and only a small subset are on Android tablets, consider focusing only on them.

More orientations, more functionality

The two orientations available from a tablet open up a number of new opportunities for designers. Epicurious does an excellent job of using orientation to enhance the customer experience. By presenting different information as the user orients the screen while following a recipe, cooks are able to cull more data without burning the stew.


One challenge, however, is educating users that tilting will improve their experience. At this point there are not always consistent cues, which can result in some confusion. It's also important to plan for multiple orientations; each of them will take time and add cost to the project. Sometimes it is best to judiciously choose which pages will support multiple orientations and leave the rest.

Consider how orientation impacts the placement of browser elements

Orientation can also impact where elements such as buttons should go on the page. Some argue that people will hold the device at the bottom, enabling them to type with their thumbs, and therefore buttons should go there. Others will argue that the tablet is lying down on a flat surface and should lend itself to fingers.

Generally, this tends to be a function of the app and the user, and there is no solid one-size-fits-all answer. The best bet is to do customer research on a prototype, or, if that is not feasible, do paper prototypes with end users. One no-no to avoid, however, is failing to plan for the keyboard when typing. Regardless of where buttons are placed, when a user taps a text area to enter data, remember that the screen needs room to show both the keyboard as well as the field to fill out.

Different features in new places create new opportunities

According to research done by Google, people use tablets in a bunch of places around the house, but they don't always travel with them. This creates opportunities, as well as constraints, for a design team.


Yahoo's IntoNow app is a great example of how tablets seamlessly integrate into the digital living room, creating huge opportunities for the brand. By creating a tool that listens to television shows, accesses the internet, and then provides users with information on the show, Yahoo is creating value for the consumer and earning time with them by using multiple functions available on the device in a contextually relevant manner.


On the other hand, tablets come with constraints as well. Generally, users employ Wi-Fi, not cellular plans. This means that designers can't rely on a consistent internet connection, unlike smartphones.


For that reason, it's important that interactions not rely on consistent connectivity. Older versions of Safari for iOS, for example, would require a refresh of the content. This prevented people from downloading websites to view offline. On the other hand, tools such as Instapaper created instant hits by offering users the ability to browse the web and store content locally for later viewing. Another success of Instapaper was to bridge the gap between desktop and tablet and smartphone. Users seek out convergent experiences and anticipate that their information can be shared seamlessly. The more a design can create this experience for users, the better it will be received.

Remember: Fingers are bigger than mice

By and large, tablets have touch interfaces. This introduces a vast amount of new possibility, as touch is intrinsically easier to learn and promotes exploration and engagement. If designing a standalone application for a tablet, focus on smooth motion. Swipes are easier than pokes to select links or navigate through content on a page. Fingers are much larger than mice, and therefore it's essential that the tap area on the screen be around 40x40 pixels. Take some time to read the human interface guidelines for Apple, Android, and other platforms you're considering.


Let go of pixel-perfect on some tablets

The current mobile landscape makes the late '90s browser and platform wars seem like a period of Zen tranquility. Between multiple devices, frequent releases of operating systems, and different form factors, it's very expensive and time consuming to create designs that are pixel-perfect on every application.

It's best to prioritize by platform, focusing on the most prominent ones, fixing the secondary sizes, and then cutting the cord when the user base is too small. This will not only ensure that the majority of your tablet users are getting what they need, but also that the team is not overworking on assets that will underperform.

Evan Gerber is VP of mobile user experience at Fidelity Investments.

On Twitter? Follow iMedia Connection at @iMediaTweet.

"Social media, communication in the global computer networks" image via Shutterstock.

Since the late ‘90s, Evan Gerber has created innovated technology solutions for unique business problems. Evan is the Vice President of Mobile Design and Emerging Interactions at Fidelity Investments.  An avid technophile and self...

View full biography


to leave comments.

Commenter: Matthew Laurence

2012, July 25

Nice article, Mr. Gerber!