Daily UX Crash Course: 7 of 31

In today’s world, we’re not just talking about a phone or a laptop. We’re probably talking about both, plus a tablet, and probably “wearable” devices like a smartwatch or Google Glass soon enough. So today we’re gonna talk about:

Designing for Devices


(Just joining the UX Crash Course? Start here!)

Step 1: How does it like to be touched? With your finger or your mouse? I am not going to cover that in this article, because I already wrote this ProTip about Touch vs. Mouse interfaces. It should get you started.

Step 2: Start small. Many people think “mobile first” has something to do with mobile being popular. Kind of, but not really: if you design for the smallest, least powerful device first, then you will focus on the content, and the core functionality. That leads to simple, beautiful apps. If you do it the other way around, it’ll be like trying to put a marshmallow into a piggy bank, which is neither simple, nor beautiful.

Step 3: What special powers does this device have? Mobile devices travel with us so — surprise — we spend more time on them and location becomes a factor. They are also small, so moving the device itself can be a feature. Laptops, on the other hand, don’t travel as well, but they are more powerful, they have huge screens and keyboards, and the mouse allows more precise selections and functions. Don’t worry about “consistency” so much — different devices require different thinking sometimes.

Step 4: Consider the software. “Mac vs. PC” is more than a cute ad campaign. Read through the UX guidelines before you start. Also, iOS7 or Windows 8 look different than iOS6 or Windows Vista. You may need to choose which versions you will support, and which you will ignore. Every time you support one it multiplies the design, development and maintenance time in the future. Think ahead!

Step 5: Be responsive. Is it on the web? Does it support a few different types of phones? What if Apple makes a new iPhone that is a little different? The modern internet — whether it is a website or an app — works on all devices, so make sure yours can stretch or adapt to whatever device the user decides to use.

Step 6: Think about more than one screen at a time. This one is a bit advanced, but I think you’re ready for it. Can you use your phone and computer together, like a remote for your TV? Could a group of phones control a game on a tablet, all in the same room? What if you’re logged in on two devices, can you “throw” data from one to the other? What about syncing information; will that cause issues in real-time? Give it some thought!


Tomorrow we will talk about common ways to solve common problems: Design Patterns!