Designing for Multiple Screen Sizes Is About Consistency

Photo
Credit

A few years ago I taught a class at New York University in the Interactive Telecommunications Program, called, “1, 2, 10.”

The class explored the then-nascent challenge of designing apps and experience across the multiple screens that popped up everywhere in our lives. The numbers 1, 2, 10 defined the distance between a screen and a person’s face: The cellphone being approximately one foot away, the desktop computer and tablet about two feet away, and the television about 10 feet away.

Designing for these devices might sound like a trivial task, but figuring out how to portray consistency between a 4-inch screen that you can touch with a finger, and a 60-inch screen that comes with a clunky remote control, is not so simple.

Twitter has recently learned this. After the company released its latest iPad application on Tuesday, people complained that it was a step backward for the app. But, this is really one small step for Twitter, one giant leap for consistency across Twitter-built apps.

In the 1, 2, 10 class at N.Y.U., I encouraged students to design their applications for the greatest common denominator, then work backwards. For example, a student who set out to build an interactive cooking show that would allow people to order the recipe’s ingredients in real-time, designed the experience for the television first, then considered the user interface for the smartphone.

Another student, who built a unique location-based surf report that worked across 1 foot, 2 foot and 10 foot screens, built for the computer first, then adapted the design for the smartphone and television.

screenshot via AppleApple uses design cues from the iPhone in the iPad and Mac.

Apple has been doing this in recent years, too. The user interface for the iPad is an exact replica of the iPhone interface. It has slowly started adopting these design elements for the Mac, too. The company recognizes that creating a consistent design language that traverses its different screens is more important than creating a unique experience for each device. As Apple continues its march toward the 10 foot experience, you can be sure elements from iOS will carry in that direction, too.

Amazon also does this with its Kindle software, which works on almost every Internet-connected screen out there. Is the Kindle software groundbreaking? No. But it’s consistent. And don’t forget, it all started on the Kindle: a clunky black and white screen with an ugly scroll-wheel. Now, Amazon’s reading experience has been adapted for smartphones, computers, e-readers and tablets of all shapes and sizes.

screenshot via TwitterAfter an inconsistent iPad experience, the new Twitter app looks like the company’s smartphone apps.

For Twitter, its greatest common denominator experience is clearly the smartphone. It has since adapted this design language to the Web, and with Tuesday’s update — finally — the iPad. Is it a unique design for the iPad? No. Not by a long shot. But it is consistent. And in its quest to gain more mainstream users for the service, a design equilibrium is more important than anything else.