Your SlideShare is downloading. ×
  • Like
Mobile UX - the intricacies of designing for mobile devices
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Now you can save presentations on your phone or tablet

Available for both IPhone and Android

Text the download link to your phone

Standard text messaging rates apply

Mobile UX - the intricacies of designing for mobile devices

  • 42,717 views
Published

Covering mobile user experience in general and focusing on the little interface tweaks and interaction design that can make all the difference to a mobile application

Covering mobile user experience in general and focusing on the little interface tweaks and interaction design that can make all the difference to a mobile application

Published in Design , Technology , Business
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
No Downloads

Views

Total Views
42,717
On SlideShare
0
From Embeds
0
Number of Embeds
27

Actions

Shares
Downloads
2,187
Comments
15
Likes
178

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




  • move things along little by little








  • Note: Constraints make mobile interesting. A challenge.

  • If you're not aware of the constraints, the UX will be poor.





  • [Note - do mobile users have shorter attention spans?]




  • e.g. In SA, most people have very limited data connections. Mixit

  • Like a large bag of chocolate buttons

  • Motorola

  • Exit, Quit,



  • Miniaturisation (shrinking things down)

  • Mobilisation (process of selecting the features most important to the user given the mobile context) vs

  • minimising the number of subconscious questions the user needs to make





  • super simple, but so few design this

  • (all the time, we are building a relationship with the user)




Transcript

  • 1. MOBILE USER EXPERIENCE the intricacies of designing for mobile devices Antony Ribot, CEO, Ribot UX Corner - 08.01.2009 http://www.flickr.com/taraethers
  • 2. First of all, some context BACKGROUND started at tomato (’99) then studied ants, bees and termites joined the mobile scene 5 years ago co-founded ribot 1.5 years ago ceo / art director
  • 3. Why does ribot exist? ribot = ideas lab for mobile UIs explore and play with interfaces in small spaces passion for pushing UI boundaries
  • 4. Personal definitions User experience Interaction the qualitative design emotional how the user description of interacts with the multiple interactions object with an object Method Relationship http://www.flickr.com/photos/ronlayters/586656022/
  • 5. Constraints of mobile THERE ARE MANY form factor battery network latency context input mechanism memory computational power
  • 6. Context of use
  • 7. Behaviours & usage
  • 8. The mobile environment IT’S LIKE MARS single early failure = non-returning user crucial first 30-60 seconds usage
  • 9. Mars, Neptune, Pluto... THE ENVIRONMENT DIFFERS, DEPENDING ON WHERE YOU ARE user behaviour handset range operators data allowance / pricing e.g. South Africa, Europe, Japan...
  • 10. Time for a snack... DATA-SNACKING small snippets of info 30-60 seconds simple, but repetitive regular
  • 11. Re-use learnt behaviours Re-use interactions inherent in the device Minimise the number of surprises soft key positions colour menu navigation tone of voice http://www.flickr.com/photos/8586443@N03/1491516038/
  • 12. Going into details...
  • 13. Mobile is not about making things smaller Miniaturisation Mobilisation vs http://mobilewebbook.com http://www.flickr.com/photos/tridi_animeitor/2224661744/
  • 14. It’s all about the subtleties Fewer options = simple and more effective interface Polish makes the UX and app stand out
  • 15. Default states in a UI Grid menus and lists Most important function highlighted? Maximise number of options a click away http://flickr.com/photos/moonypics/2130645953/
  • 16. Faking it Low latency is key to the user experience... ...especially with touch devices Make immediate visual changes... ...whilst we wait for network/other process http://flickr.com/photos/rabataller/638250907/
  • 17. Working around the 3G icon
  • 18. Reward-based exploration FOCUSING ON THE KEY FEATURE AND DOING IT WELL keep it as simple as possible (the hard part) 1. allow the user to play within safe boundaries 2. user’s comfort increases 3. sense of exploration increases 4. discovery of features almost by accident http://www.flickr.com/photos/devos/95230930/
  • 19. Opera Mini A REWARD-BASED MOBILE BROWSER page by page scrolling
  • 20. Opera Mini A REWARD-BASED MOBILE BROWSER Short-cuts in the soft key menu
  • 21. Process
  • 22. Mobile UX - the easier path Workshop Idea exploration Paper wireframes Formalised digital wireframes User/expert testing Aesthetic concepts Screen design Rapid prototype Docs Motion design Art direction http://www.flickr.com/photos/bbsc30/168832715/
  • 23. How to deal with diversity select lead handsets for your target audience use the design process to tackle “graceful degradation” http://www.admob.com/ http://www.flickr.com/photos/joaomoura/2661761961/
  • 24. Why use rapid prototyping test ideas quickly in a tangible environment extremely useful reference for developers an interactive showcase of the intended UX
  • 25. Mobile rapid prototyping tools Flash (lite v3.0) XHTML + CSS Nokia Web Runtime Silverlight Dashcode Pen & paper http://www.flickr.com/photos/brianauer/2249169858/
  • 26. Questions Antony Ribot ribot.co.uk http://www.flickr.com/photos/ronlayters/2402199783/