Here we talk about designing across, and for, multiple touchscreen platforms (Nokia, iPhone, iPad and Windows Phone 7) using Ribot’s recent suite of Tesco apps as a case study. How do different form factors, operating systems, and interaction paradigms inform the design of real I-want-to-use-it-every-day apps? How do you take the constraints (and opportunities) of differing mobile devices and design interfaces that, for the user, feel like they belong on the device and as part of their life? (Download the presentation for full transcript)

1. (Mobile) User Experience
Designing for multiple
touchscreen platforms
UXBrighton 11/01/2011
Robert Douglas, UX Designer, Ribot

2. PART 1
Introduction

3. Hi, I’m Rob

4. I work at ribot

5. You may know me as
@anucreative

6. I’m going to talk about...

7. PART 2
Let’s get started...

8. Quick mobile guidelines
simpler is better
re-use learnt behaviours
little and often
photo source: http://www.flickr.com/photos/pittaya/298046657/

9. Simpler is better
minimise the subconscious questions
improve glance-ability
simpler != dumb
balance functionality, ease-of-use & satisfaction
photo source: http://www.flickr.com/photos/lagiuspo/92136687/

10. Re-use learnt behaviours
re-use interactions inherent in the device
minimise the number of surprises
http://www.flickr.com/photos/8586443@N03/1491516038/

11. Little and often
simple, but repetitive
and grocery shopping is special...

12. From web to mobile
photo source: http://www.flickr.com/photos/eclogite/2563355229/

13. Pressure Accelerometer Time of day Gesture
Microphone Haptics ...
photo source: http://www.flickr.com/photos/dunechaser/174945526

14. Pressure Accelerometer Time of day Gesture
Microphone Haptics ...
photo source: http://www.flickr.com/photos/dunechaser/174945526

15. Pressure Accelerometer Time of day Gesture
Microphone Haptics ...
photo source: http://www.flickr.com/photos/dunechaser/174945526

16. Pressure Accelerometer Time of day Gesture
Microphone Haptics ...
photo source: http://www.flickr.com/photos/dunechaser/174945526

17. Pressure Accelerometer Time of day Gesture
Microphone Haptics ...
photo source: http://www.flickr.com/photos/dunechaser/174945526

18. Four-step process
reserve a delivery slot
find and add products to basket
(favourites, search, browse, scan)
review your order
check out
photo source: http://www.flickr.com/photos/jennyland/4814451932/

19. PART 3
Some examples

20. Nokia (S60 5th edition)

22. iPhone/iPod touch

24. Windows Phone 7

26. iPad

28. Compare: Global navigation

36. Compare: Delivery slots

46. Compare: Inline navigation

63. Compare: Navigating back

70. The challenges
redesigning each experience
resetting our expectations
photo source: http://www.flickr.com/photos/harrymoon/4079075358/

71. PART 4
Wrapping up

72. Mobile is not about making
things smaller
photo source: http://www.flickr.com/photos/
matley0/2694746491

73. But it is the little things
that count
photo source: http://www.flickr.com/photos/tom_lin/
3186488124/

74. Make the most of your
platform

75. Thanks
@anucreative
ribot.co.uk
photo source: http://www.flickr.com/photos/jeremybrooks/618388795