Your SlideShare is downloading. ×
Usability In Mobile Applications
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Saving this for later?

Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime - even offline.

Text the download link to your phone

Standard text messaging rates apply

Usability In Mobile Applications

11,253
views

Published on

Key usability pointers for anyone who's developing mobile web sites and applications.

Key usability pointers for anyone who's developing mobile web sites and applications.

Published in: Design, Technology, Business

4 Comments
26 Likes
Statistics
Notes
No Downloads
Views
Total Views
11,253
On Slideshare
0
From Embeds
0
Number of Embeds
12
Actions
Shares
0
Downloads
535
Comments
4
Likes
26
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Usability in Mobile Applications BRUNO FIGUEIREDO the_ml
  • 2. Europe: 90.9% have a mobile 41% worldwide (2,67 billion) ██   120% > ██  100-120% ██  80-100% ██  < 80% wikipedia
  • 3. Adapted from Bill Moggridge & Jan Borchers Market Evolution Sweet Spot
  • 4. PDAs Keyboard, Touchscreen Mobile Phone Types dotMobi Feature Phones Phone, SMS, Internet Smart Phones Applications
  • 5. Mobile Web Sites moritz™
  • 6. Screen Resolution and Formats dotMobi
  • 7. Mobile Development Languages Wikipedia
  • 8. Regular Web, Mobile version
  • 9. Auntie P
  • 10. Mobile Web
  • 11. Main Mobile Browsers Pocket Internet Explorer Opera Mobile Safari Mobile
  • 12. Hub and Spoke Home
  • 13. Simple Hierarchy
  • 14. Clickstream Brian Fling
  • 15. Home Heading Navigation Footer Section 2 Highlights Section 1 Highlights Section 1 Heading Navigation Footer Content Section 2 Heading Navigation Footer Content Aux. Section Heading Navigation Footer Content Recomended Structure
  • 16. Optimized Degradation Normal Without CSS
  • 17. Horizontal Lines and Breadcrumbs Optimized for vertical navigation Breadcrumbs: only useful for more than 3 levels deep
  • 18. Forms
  • 19. Shortcut Keys
  • 20. The Magic Number (+ or – 2) George Miller
  • 21. Good Practices
    • Easy to type addresses m.site.com or site.mobi instead of www.site.com/mobile
    • Specialized mobile versions
    • Simple, shallow navigation structures
    • Useful and simplified content on every page not just navigation
    • Optimize for degradation
    1 2 3 4 5
  • 22. Good Practices
    • Layout links vertically
    • Avoid repetitive data entry passwords are hard to type
    • Simplify forms (with clear buttons)
    • Provide shortcuts
    • Minimize the (yet short) bandwidth use
    6 7 8 9 10
  • 23. Mobile Applications Tim Caynes
  • 24. Main Mobile Platforms Symbian 65% Windows Mobile 12% BlackBerry 11% iPhone 7%
  • 25. liewcf Numeric Keyboard and Joystick
  • 26. StarrGazr Half Keyboard and Ball
  • 27. KhE 龙 Cursor Keys
  • 28. Crouching Donkey Touchscreen (Multi-touch)
  • 29. Full Keyboard and Touchscreen
  • 30. Card Stack Screens with subtle animations
  • 31. Two Panels List + Detail
  • 32. Fisheye Lens
  • 33. Distortion Lens
  • 34. Predictive Text
  • 35. Availability Restrictions
  • 36. Progressive Filtering
  • 37. Rapid Serial Visual Presentation 50 miliseconds Robert Spencer
  • 38. Good Practices
    • Optimize interaction for the target device stylus based, small targets; finger based, big targets 3D look and feel for touchscreen interfaces
    • Minimize data entry
    • Optimize content presentation emphasize what’s being seen/manipulated
    • Provide shortcuts for experienced users
    1 3 4 5 2
  • 39. [email_address] Thank you gailjadehamilton