HOW TO BUILD   A KICK-ASSMOBILE EXPERIENCE   @MICHAELDICK
How many peopleare new to mobile?---Rid you of fear that mobile is different.                              Let’s start wit...
Web designers know how to design    for an evolving medium.
Web designers know how to design  around technical constraints.
Web designers know how to design       using similar tools.
HTML is HTMLCSS is CSS.JS is JS.Safari is Safari.PHP, Ruby, .NET...arestill the same.         Web designers know how to te...
Same input fields...but enhanced :)
Use gestures---Tap, Slide, Glide, Swipe       A finger is still a finger...but enhanced :)
Mimic real world mental models.
Manipulateyourcontent             SOURCE: TIDBITS.COM
SOURCE: 31THREE.COM
SOURCE: APPSFORGROWNUPS.COM
So what thehell is context?       Context is King.
Everything iscontext.--But is that how wedefine “mobile”....on thego?
Are tablets mobile?
“The ipad is somuch moreintimate.”- Steve Jobs             SOURCE: WIKIPEDIA
It’s hard to assume which context a user will be inBehaviors are changing
34% of users discover your    site on a desktop... then follow up on mobile.                             SOURCE:YAHOO!
But that’s whythe web works.---It’s an universal platformthat’s accessible fromanywhere---Users are changing devicesmid-wa...
SO HOW DO I MAKE   A KICK ASSUSER EXPERIENCE?!
GOAL #! A great mobile experience  is one that gets the userwhat they want with no hassle.
What’spriority #1?---This is why the “Mobile first” works.                   Mobile forces us to                 have supe...
It’s aboutmaking aminimal exp.---How can you get the contentclosest to the user?                    It’s not about making ...
UX TIPSto tell your developer
Design and build for fluid widths
Always give tappable areas  a width and height of:      44x44
Disable autocorrectand autocapitalizein sensitive inputs              Don’t let this happen                to your users
Behind the scenes•         Hide the address bar.•       Hide the browser chrome.•    Change the color of the status bar.• ...
QATweet how kick-ass this was??!    @michaeldick
How to build a kick-ass mobile experience
How to build a kick-ass mobile experience
How to build a kick-ass mobile experience
How to build a kick-ass mobile experience
How to build a kick-ass mobile experience
How to build a kick-ass mobile experience
How to build a kick-ass mobile experience
How to build a kick-ass mobile experience
How to build a kick-ass mobile experience
How to build a kick-ass mobile experience
How to build a kick-ass mobile experience
Upcoming SlideShare
Loading in...5
×

How to build a kick-ass mobile experience

2,487

Published on

0 Comments
5 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
2,487
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
34
Comments
0
Likes
5
Embeds 0
No embeds

No notes for slide

How to build a kick-ass mobile experience

  1. 1. HOW TO BUILD A KICK-ASSMOBILE EXPERIENCE @MICHAELDICK
  2. 2. How many peopleare new to mobile?---Rid you of fear that mobile is different. Let’s start with the Similarities
  3. 3. Web designers know how to design for an evolving medium.
  4. 4. Web designers know how to design around technical constraints.
  5. 5. Web designers know how to design using similar tools.
  6. 6. HTML is HTMLCSS is CSS.JS is JS.Safari is Safari.PHP, Ruby, .NET...arestill the same. Web designers know how to test using similar tools.
  7. 7. Same input fields...but enhanced :)
  8. 8. Use gestures---Tap, Slide, Glide, Swipe A finger is still a finger...but enhanced :)
  9. 9. Mimic real world mental models.
  10. 10. Manipulateyourcontent SOURCE: TIDBITS.COM
  11. 11. SOURCE: 31THREE.COM
  12. 12. SOURCE: APPSFORGROWNUPS.COM
  13. 13. So what thehell is context? Context is King.
  14. 14. Everything iscontext.--But is that how wedefine “mobile”....on thego?
  15. 15. Are tablets mobile?
  16. 16. “The ipad is somuch moreintimate.”- Steve Jobs SOURCE: WIKIPEDIA
  17. 17. It’s hard to assume which context a user will be inBehaviors are changing
  18. 18. 34% of users discover your site on a desktop... then follow up on mobile. SOURCE:YAHOO!
  19. 19. But that’s whythe web works.---It’s an universal platformthat’s accessible fromanywhere---Users are changing devicesmid-way through their experience.---That’s why it’s important for usas designers to ensure that wecontinue a familiar exp across all platforms. Access is becoming part of the user experience.
  20. 20. SO HOW DO I MAKE A KICK ASSUSER EXPERIENCE?!
  21. 21. GOAL #! A great mobile experience is one that gets the userwhat they want with no hassle.
  22. 22. What’spriority #1?---This is why the “Mobile first” works. Mobile forces us to have super human focus.
  23. 23. It’s aboutmaking aminimal exp.---How can you get the contentclosest to the user? It’s not about making a minature experience.
  24. 24. UX TIPSto tell your developer
  25. 25. Design and build for fluid widths
  26. 26. Always give tappable areas a width and height of: 44x44
  27. 27. Disable autocorrectand autocapitalizein sensitive inputs Don’t let this happen to your users
  28. 28. Behind the scenes• Hide the address bar.• Hide the browser chrome.• Change the color of the status bar.• Include mobile icon.• Use proper input fields.
  29. 29. QATweet how kick-ass this was??! @michaeldick
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×