10 (actually 12) topics web designers need to consider in the mobile space

1. Ten things web designers need
to do before going mobile
16 April 2009
CHI*A

2. One
Live a
mobile life
2
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.

3. Two
Believe it’s
a phone
3
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.

4. Three
Use mobile analytics
Desktop web tools
won’t cut it
4
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,
etc. Thoughts?

5. Four
Know your
platform
5
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
install process?
•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

6. Five
Target the devices
your users have
6
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.

7. Six
Design for
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.

8. Seven
Understand the
region and
culture
8
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
customers live.
•Devices, networks, and customers will vary from region to region.
•Knowing is not the same as understanding.

9. Eight
Learn the implications of
intermediaries
9
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.

10. Nine
Use device
repositories
10
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
capabilities

11. Ten
Send only what
is needed
11
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?

12. Eleven
Design with
rules and
patterns
Not pixels
12
(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.

13. Twelve
Be part of the
community
13
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.

14. Barbara Ballard
Usability, human factors, interaction
design, industrial design, marketing,
engineering, entrepreneurship, MBA
Product designer, product strategist,
blogger
Mobilist 14

15. P.O. Box 44-2302
Lawrence, KS 66044
785 838 3003
littlespringsdesign.com
design4mobile.mobi
15