Notes on Luke Wroblewski’s “Mobile To The Future” presentation today at An Event Apart Austin:
First there was print, then recordings, then cinema, radio, TV, and the internet. Mobile is the seventh and latest form of mass media. And the smartphone is the fastest spreading technology in history. More iPhones are activated every day than babies are born.
Can mobile do what print did? What recordings did? What cinema did? What radio did? What TV and the internet did? Yes, mobile can do all of it. It also has unique properties: always with you, always on, built-in payment mechanism, at point of inspiration, accurate audience, captures social context, augmented reality, digital interface to reality.
When new mass media comes out, we try to apply old thinking to it. We treated early TV like radio (sponsors, jingles, spokesmen, programs). Radio shows migrated whole to early TV (Abbott & Costello, Lone Ranger, etc.) It took many years to realize that TV was not radio. Likewise, we still have ingrained print characteristics impacting how we think about web and mobile. (Page/canvas, grid layouts, typography, graphical ads.) As many people will tell you — but not many people practice — the web is not print.
Mobile is not desktop. “Copy, extend, and finally, discovery of a new form. It takes a while to shelf old paradigms.” – Scott Jensen
Companies are discovering they can do more on mobile. People are 2x more likely to buy on mobile; 2.5x more likely to subscribe; 3x more likely to be engaged. Don’t just look at the *constraints* of mobile; look at the opportunities.
Outline of remainder of talk: What we know from the desktop web; how to adapt and optimize for mobile; ways to move forward.
Consider login. People do at least 15 authentications per day. 82% of people have forgotten a site password. 5%-10% of people trying to access Yahoo fail to log in (and request password). The number one problem at help desks is, “Help, I forgot my password.” Login is a ubiquitous, but broken, system. We have brought all the problems of desktop login to the mobile platform, where problems are magnified. On Amazon, they removed “I forgot my user ID or password” from login in a misguided effort to save space in small-screen mobile context. Result: 90% of their customer service calls were “I forgot my password.” Removing critical functionality is not a good way forward.
“Guest Checkout” is a popular feature on many commerce sites that increases conversion. You’d think this feature, which boosts conversions 30%, would be carried over to mobile. But Walmart.com omitted it. Instead they told the user to get a desktop computer(!). (Walmart.com has since updated its website to provide a more appropriate mobile experience.)
“Mobile must never be a dumbed-down, limited experience,” says Steven Hoober.
Don’t remove critical features!
Do get rid of autocomplete and autocapitalize on login and password inputs.
Do use input types (“type=password”) to facilitate sign-in. (Input types trigger appropriate keyboards in HTML5-capable browsers, e.g. Safari in iPhone, Chrome in Android.)
Do show passwords; password masking results in login failures and lost opportunities.
Show passwords by default. (Give people the option to “Hide password” in case they need it.)
Use Input Masks on login, e.g. start “user name” fields with an “@” symbol. On MobileMe, there was an “@me.com” input mask in the user email address input screen (since you needed an @me.com address to be able to sign in anyway).
Quora doesn’t ask for your password immediately; first it checks to make sure you’ve entered your email address correctly.
One-tap operation: the second time you visit Quora, you can enter simply by tapping your avatar picture.
Third-party credentials (“sign in with Facebook”) cause problems, because users don’t remember if they created an account or signed in with Twitter/Facebook. Bagcheck and Votizen use a pattern where you begin typing your name and a series of selects show up, allowing you to pick your name from the list. Once it knows your name, the app gives you the chance to log in via your internal account or a third-party apps.
Summary so far
Don’t remove critical features.
Use input types and attributes.
Show password by default.
If possible, save people’s passwords so they can log in with one click.
Next time the user signs up, let them enter by tapping their avatar.
These techniques don’t just benefit mobile users. They also benefit those who use desktop, tablet, and God knows what’s coming next.
Touch Gestures
New Windows phone / OS has photo sign-in. You make gestures on a photo; those gestures and their relationship to that photo become your new password. Gestural logins have astronomically more password combinations than traditional logins, thus being more secure, as well as more humane than traditional “name of a French king, your parents’ wedding anniversary” alphanumeric passwords.
Facial Recognition
Galaxy Nexus recognizes your face and smile to let you in. Going back to an alphanumeric password after using face recognition feels like stepping back five years into the past.
Can this work in the browser? We’d need Getusermedia API, access to local device multimedia streams, and more. (Not that yet.)
Hand and Fingerprint Recognition
Apple has patented finger ID. It not only knows your fingerprint, it knows which finger is down. Your sign-in could be a gang sign.
Login Summary
SMS authentication
Touch gestures
Facial recognition
Finger identification
Make sure things lay out okay.
Take time to adapt.
Start to think differently (create new solutions).
Checkout – yesterday, today, tomorrow
75% of all shopping carts that got filled out were abandoned in 2011. (In 2010, it was 71%. We’re getting worse!)
Therefore, just moving your desktop experience to the mobile screen doesn’t make sense. (Dell requests your mobile number’s daytime fax number in mobile.)
Step 1 = REDUCE EFFORT. Get rid of stupid stuff that we ask people to do — stuff that gets in people’s way.
Expedia got $12M more in profit per year overnight by removing one needless field (“Company”) from their checkout process.
Consider using “Full Name” instead of First Name, Last Name, and Optional Middle Name fields (which don’t support international names very well anyway).
Dell’s 16 fields for phone number can be replaced with a single field: Daytime Phone Number. Hide irrelevant controls!
INPUT TYPE=TEL brings up a beautiful number pad, making it easy to add your phone number. After all, you are entering it on a phone! This works on Amazon Silk browser, on Android, on iPhone, etc.
Remove optional fields.
Keep people on the fields, remove needless fields.
“If you see lots of text in a form, that’s a usability problem. If the text is bold, it’s a bigger usability problem. If it’s bold and red, it’s an even bigger usability problem. Now you are all designers.” – Luke W
People make 3 purchases per second on mobile.
Checkout optimization
Luke showed a really slick, slimmed-down way to enter credit or debit card info (with just one field!).
Use “Continue” for terms of sale, instead of forcing people to accept or not accept the terms of service (since people often accidentally choose “do not accept,” thereby losing all the data they have entered … which causes them to leave without purchasing anything).
When selling digital content, your checkout form could be, “give us your email address,” use a single input to enter your credit or debit card, and go.
Amazon has 1-Click Buying with Amazon Prime. People go from spending $400 a year to spending $900 a year when they move to Amazon Prime. Reducing the barrier to buy radically increases volume.
On Amazon’s mobile site, when I buy a book, I can send it to my iPhone, my Kindle, or wherever I want.
Yet on Amazon’s Kindle app for iPhone, I can’t buy a product (because Amazon doesn’t want to pay Apple’s percentage).
Future of checkout: Local purchases – “Personal Pickup” at the Apple Store via iPhone.
When you walk into Apple Store after shopping via Personal Pickup, a store employee sees you on his/her iPhone and brings you your product when you walk in the door. This can also be done on the web (via Webworkers) but it’s not as seamless as in an app. (Web not quite there yet.)
Barcode scanning in mobile lets customers shop in the real world using their phones to scan and pay.
Self checkout at Apple lets you point your phone at a product, pay online, and walk out with the product without going to a cash register.
Summary
Dump the “start from desktop” mindset. Start from what mobile can do.
Mobile is a massive new mass medium.
Designing for it today forces us to adapt and optimize our solutions.
Designing for mobile moves us toward the future (but we need device APIs to make it work).
