Luke Wroblewski Founder of Bagcheck

Listen to the Podcast

As always we all had a great time last Friday with our long time friend LukeW at his second ZURBsoapbox.

Luke made a strong and valid case of why we should focus on designing for mobile vs. the desktop. Not only did he tell us why, he also focused on how we should design for the mobile. Listen to the full podcast as your read through the highlights below.

"Everyday 1 million mobile touch devices are put into consumers hands. If you do not design for this audience you're missing a million people a day."

Growth = Opportunity

Luke started out by shocking us with some amazing statistics:

• Smartphone sales will surpass PC sales in 2011.
• AT&T's mobile data traffic increased 50X in past 3 years (1492% increase).
• Mobile internet adoption has outpaced desktop internet adoption by 8X.

Everyday over a million smartphone devices are enabled and put into consumers hands. Anybody who doesn't have a mobile version of their product is missing a million people every day.

Constraints = Focus

Luke reminded us that one of the most impactful smartphone constraints is the screen space. Instead of 1024x768 size canvas we only have a 320x480 canvas to work with. Therefore every pixel on the smartphone screen needs to focus on core actions. Loosing 80% of the screen space forces you to focus on the most important set of features for your customers. A great example of this is Southwest website and smarthphone app examples below.

Constraints = Speed

You never know when your mobile network signal will drop on you. Luke shared some tips on how to speed up your app by making it leaner.

Reduce requests and file size:

• Eliminate redirects.
• Use CSS sprites to serve multiple images.
• Consolidate CSS & Javascript into a single file.
• "Minify" your code.

Take Advantage of HTML5:

• Load contents lazily.
• Use application cache for local content storage.
• Use CSS3 and canvas tag instead of images where possible.

Capabilities = Innovation

Luke boosted our desire to develop for mobile with a list of smartphone capabilities that we as developers and designers have at our fingertips to innovate on.

Using Touch

Touch reduces the level of input and makes the app simpler and easier for the user.

• The minimum touch target size on an iPhone is 29px wide by 44px tall
• A developer must first identify what action a user should perform
• Luke's basic touch gestures guide helps you figure out which gesture corresponds to that operation and how you can implement it

Using Location Input

Location input gives you a different lens for your design. Luke used Yelp as an example. Anybody trying to find a place to eat though the Yelp website will have to type in their location and sort through a giant map of places. The Yelp iPhone app combines Touch and Location to accomplish the same task of finding a place without the input of location and by using just one touch.

Luke continued on with a whole series of other capabilities we can innovate on such as orientation of the device, audio and video, and others. At the end of the day Luke reminded us to remember that:

• Mobile growth is exponential and we can't ignore it.
• Mobile constraints keep us in check and focused on core actions.
• We have tons of capabilities we can innovate on.

The talk had a lot more details and information which you can get by listening to the full podcast above or checking out Luke's interview with Jeffrey Zeldman and Dan Benjamin on Mobile First.

We'd like to thank LukeW once again for showing us why and how to design for mobile.