Creating An Awesome Mobile Experience

CREATING AN AwesomeMOBILE EXPERIENCE

@jasonvanlue

CONTENT + DESIGN =AWESOME MOBILE EXPERIENCE

Q. What experience do you want your users to have?Q. What emotions do you want them to feel?Q. What actions do you want them to perform?

Don’t just build good sites. BUILD AWESOME EXPERIENCES.

DESIGN BETTER

Q. How can my mobile site / app be better?

‣ The mobile web is growing 8 times faster than the desktop web grew in the AOL heydays‣ Smart phone sales will pass PC sales in 2012‣ AT&T data traﬃc has increased by almost 5,000% in 3 years, mostly due to the iPhone‣ Mobile phones will overtake PCs as the most common web access devices worldwide by 2013.‣ 600% growth in traﬃc to mobile websites in 2010.‣ Facebook and Twitter access via mobile browser grows by triple digits in 2010.‣ Average smartphone user visits up to 24 websites per day.Source: http://www.lukew.com/resources/articles/MobileFirst_LukeW.pdf / http://www.zeldman.com/2011/03/30/a-day-apart-mobile-web-design-with-luke-wroblewski/

SHOULD WE CARE?

Q. What is my content?Q. Who am I trying to reach?

Your Content Deﬁnes the DesignYOUR AUDIENCE DEFINES THE MEDIUM

Q. Does my content work in a mobile environment?Q. Does my audience use mobile?

CONTENT1. Have a Content Strategy2. Content is a Dish Best Served Personalized3. Make it Easy on the User

CONTENT1. Have a Content Strategy a) Know your voice. Know your audience.

CONTENT1. Have a Content Strategy a) Know your voice. Know your audience. b) Know the most important elements. YOU USERbrand development / proﬁtability satisfaction / happiness

CONTENT1. Have a Content Strategy a) Know your voice. Know your audience. b) Know the most important elements. c) Craft user stories.

CONTENT2. Content is a Dish Best Served Personalized a) We don’t need more information. We need better ﬁlters.

CONTENT2. Content is a Dish Best Served Personalized a) We don’t need more information. We need better ﬁlters. b) How can you personalize your content? - location - social demographics - registration information

CONTENT3. Make it Easy on the User a) Perform user actions for them.

CONTENT3. Make it Easy on the User a) Perform user actions for them. b) Get an ID 1024x768 320x480

CONTENT3. Make it Easy on the User a) Perform user actions for them. b) Get an ID c) Make the content the action point.

CONTENT1. Have a Content Strategy2. Content is a Dish Best Served Personalized3. Make it Easy on the User

DESIGNProgressive Enhancement

DESIGNProgressive Dehancement

THE MOBILE EXPERIENCESHOULD BE A GREAT EXPERIENCE

DESIGN1. Responsive Web Design2. Separate Mobile Sites3. Mobile First

DESIGN1. Responsive Web Design a) What is it?

DESIGN1. Responsive Web Design a) What is it? FLEXIBLE DESIGN

DESIGN1. Responsive Web Design a) What is it? b) 3 Rules

DESIGNEthan Marcotte’s 3 Rules 1. The site must be built with a flexible grid foundation. 2. Images that are incorporated into the design must be flexible themselves. 3. Different views must be enabled in different contexts via media queries.

DESIGN1. Responsive Web Design2. Separate Mobile Sites

DESIGN2. Separate Mobile Sites a) Sometimes RWD isn’t enough.

NATIVE APP orWEB APP?

DESIGN2. Separate Mobile Sites a) Sometimes RWD isn’t enough. b) Feature shrink

DESIGN2. Separate Mobile Sites a) Sometimes RWD isn’t enough. b) Feature shrink c) Domain redirect - server side - client side m.olivegarden.com

DESIGN1. Responsive Web Design2. Separate Mobile Sites3. Mobile First

DESIGN3. Mobile First a) Luke Wroblewski (www.lukew.com)

DESIGN3. Mobile First a) Luke Wroblewski (www.lukew.com) b) Simplify

DESIGN3. Mobile First a) Luke Wroblewski (www.lukew.com) b) Simplify c) Focus

DESIGN3. Mobile First a) Luke Wroblewski (www.lukew.com) b) Simplify c) Focus d) Think like a user

FUTURE OF DESIGN?

CHEERS!@jasonvanlue

Creating An Awesome Mobile Experience

by Jason VanLue

Accessibility

Categories

Upload Details

Usage Rights

Statistics

Creating An Awesome Mobile Experience Presentation Transcript