10 Things Web Designers Need to Do Before Going Mobile
Ten things web designers need
to do before going mobile
16 April 2009
Start using a phone for accessing the Internet.
•Use it as much as you can; don’t whip out a laptop or wait till you get home.
•Try not to make it an iPhone.
•If you have the means or resources, switch to other devices periodically, so you see the strengths
and weaknesses of the various platforms, and don’t get stuck in a single UI mindset.
It's a phone first.
•Your customers might have a high end large screen phone with unlimited 3G data and/or wi-fi and a
battery charger at hand ... or they might not. And you probably won't know. So: fast, responsive, light.
•Add weight only when it significantly enhances the user experience.
•Want more interaction logic? Make an app instead.
Use mobile analytics
Desktop web tools
won’t cut it
Use a mobile analytics package.
•Bango, Admob, Flurry, Pinchmedia.
•The desktop-focused packages don't understand mobile.
•Analytics are boring. Any ideas. This is a generic cool photo instead, but it sorta implies heatmap,
Learn the capabilities of your platform.
•Your developers may not already know.
•For example, we were told by a developer that Android couldn't use CSS layout to do something we
provided code for; they insisted on using tables.
•If you only do what they say you can, you aren't serving your users.
•Above: VZW doesn’t allow links in SMS messages they didn’t originate. How does this affect your
•stream of consciousness: platform defines what you can and can’t do but if you don’t know what it can’t do you
can only do what you think it can and your design gets smaller with each assumption - especially when developers
take things way
Target the devices
your users have
Think carefully about how to target devices.
•Remember that most people do not have a high end phones. Are they target customers? You might
not want to abandon them.
•But don't shortchange your high end device users, either. Like personas, you might need to work
with multiple types of devices.
•Texting and even web are not high end features, think what you really mean by categorizing features
in any particular manner; don’t just assume everyone knows what a “smartphone” means anymore.
•While not a low-end appeal, it works I think.
contexts of use 7
Think carefully about the users and what they are doing.
•Don't just consider the quot;in a cafequot; or quot;on a busquot; contexts, but the quot;lying in bed before falling asleepquot;
and quot;while watching televisionquot; contexts. (Or even, while “riding a bike”).
•And of course quot;I don't have another device to access the Internet.”
•Are your users task-based or otherwise-engaged? If you don’t know, find out.
•A mobile is not used like a computer on a desk or lap. It can only capture attention for brief periods.
Remember that devices vary from country to country.
•Don't assume that because a phone type is popular where you live, that it's popular where your
•Devices, networks, and customers will vary from region to region.
•Knowing is not the same as understanding.
Learn the implications of
Learn about what impact operators, transcoders, and aggregators have.
•They can change your content and may block messaging.
•They can also give you access to deeper user data.
Learn about assistive technologies.
•You should know what device description repositories are, and how they can help you. E.g.,
DeviceAtlas, WURFL (shown)
•Make your content and layout and software intelligent so it behaves appropriately based on device
Send only what
Don't put all rendering logic on the page.
•Don't, for example, pull three image versions down to the page and then render only one.
•Obviously, I don’t think much of this photo
•I am not sure I love this point as stated, anyway. Something else about client vs. server, or page
weight or what?
(and last of all) embrace flexible design.
•Abandon pixel-perfect design.
•Photoshop rendering is not your friend.
•Use rules, charts, themes, patterns, styles.
•Use modular design principles and polymorphic objects.
Be part of the
Come to Design for Mobile
•April 20-22, 2009 in Lawrence
•Or visit the design pattern wiki http://patterns.design4mobile.mobi.
•Or at least read some books, subscribe to blogs, etc.
•Don’t live in a cave, or silo. Understand the whole mobile ecosystem.
Usability, human factors, interaction
design, industrial design, marketing,
engineering, entrepreneurship, MBA
Product designer, product strategist,