• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Mobile UX 101 @ Flash Camp Manchester

Mobile UX 101 @ Flash Camp Manchester



An overview of the current state of Mobile UX, presented to attendees of Flash Camp Manchester by Jerome and Antony from Ribot

An overview of the current state of Mobile UX, presented to attendees of Flash Camp Manchester by Jerome and Antony from Ribot



Total Views
Views on SlideShare
Embed Views



1 Embed 1

https://www.linkedin.com 1



Upload Details

Uploaded via as Apple Keynote

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
Post Comment
Edit your comment
  • hello <br /> a mix of general mobile UX <br />
  • <br />
  • some context... <br /> 7 years in mobile <br /> designers/developers/entrepreneurs <br /> push ui boundaries, <br /> ideas lab for mobile user interfaces <br /> 10 person team in Brighton <br />
  • it&#x2019;s the UX that makes the platform and your app stand out <br /> Golden nuggets <br /> Quite a simple and straightforward session <br /> apply to whatever platforms you&#x2019;re working on <br />
  • <br />
  • Physical interactions e.g. Touchscreen, haptics, etc <br /> Tangible era, 20 years <br />
  • So many things to consider and more so in the future... <br />
  • Brought us to mobile 7 years ago... <br /> <br />
  • Constraints make mobile interesting. A challenge. <br /> If you&apos;re not aware of the constraints, the UX will be poor. <br /> Make the most of constraints <br />
  • Efficiency, relevancy, <br />
  • <br />
  • <br />
  • Android is now the most popular platform for developers <br />
  • Platform concurrency. Most developers work on multiple platforms - on average, 2.8 platforms per developer, based on sample of 400 respondents <br /> <br /> - Developer Economics Report 2010, Telefonica <br />
  • left: device install base <br /> right: num of apps in the store <br />
  • <br />
  • fingernail interaction rather than a finger interaction <br /> Broken app store (discoverability) <br /> Poor UX <br /> Many good lessons learnt <br />
  • Windows Phone 7 is here! <br /> UX comes first <br /> OS Built from scratch <br /> Discoverability fixed <br /> Quality over quantity <br /> Flash support coming soon after launch, we&#x2019;re told... <br />
  • Highly glanceable <br /> Allows users to find their way <br /> Simple, elegant, powerful, universal <br /> Not overpowering <br />
  • <br />
  • tell me more.... <br />
  • <br />
  • <br />
  • What emotion do you want to evoke? <br /> Does my app make me smile? <br />
  • <br />
  • understand your users <br />
  • understand your users <br />
  • Like a large bag of chocolate buttons <br /> single early failure - non returning user <br /> Glance and Go <br /> <br /> <br />
  • Duration of experience is getting longer <br /> Slate devices - more relaxed, explorative experiences <br /> eBay app - 4 times more money spent on iPad than iPhone (ref?) <br />
  • Motorola <br /> Exit, Quit, <br />
  • Swiss army knife. Technological advancement and usability <br /> pink: iPhone 3GS, green: iPhone 3G, <br /> the rest: single-function devices aka cameras <br /> blue: Nikon D90 <br />
  • <br />
  • Miniaturisation (shrinking things down) vs <br /> Mobilisation (process of selecting the features most important to the user given the mobile context) <br />
  • Think about the core feature(s) <br /> <br /> If you can&apos;t get it right in 2D, don&apos;t even consider going into 3D. Complexity and poor UX for the sake of an 80s buzz word. <br /> &#xA0;&#xA0; &#xA0; <br /> Simpler, more usable interfaces - consider the forgotten (and rapidly growing) markets <br />
  • grocery - little and often. <br /> Speed is key <br /> Design around this <br />
  • dig as much as possible <br /> don&#x2019;t make assumptions <br /> Blackberry&#x2019;s biggest market is not enterprise <br /> It&#x2019;s games. Why. BBM and qwerty keyboards <br />
  • <br />
  • over the current app-centric state <br />
  • focus shifts from app to person <br /> ppl first, function second <br />
  • [todo] wireframe doc here <br />
  • Rec. touch Target size is 9mm <br /> Min touch target != &lt; 7mm <br /> 2mm min spacing <br /> Visual size is 60-100% of the target size <br /> Makes the experience more usable <br /> &#xA0; <br />
  • <br />
  • Rec. touch Target size is 9mm <br /> Min touch target != &lt; 7mm <br /> 2mm min spacing <br /> Visual size is 60-100% of the target size <br /> Makes the experience more usable <br /> &#xA0; <br />
  • Tap, dbl tap, touch and hold, pan, flick, pinch and stretch <br /> Consistency is key <br /> &#xA0; <br />
  • <br />
  • <br />
  • UX is an art and is hard <br /> minimising the number of subconscious questions the user needs to make <br />
  • minimising the number of subconscious questions the user needs to make <br />
  • <br />

Mobile UX 101 @ Flash Camp Manchester Mobile UX 101 @ Flash Camp Manchester Presentation Transcript

  • Mobile User Experience 101 the current state of Mobile UX on touchscreen devices FlashCamp Manchester 2010 - 08.07.2010 Antony and Jerome, Co-founders, Ribot
  • PART 1 Introduction
  • a little bit about us
  • This is the most important session today
  • PART 2 Lets get started
  • Analogue to Digital to Human INTERACTIONS photo source: http://www.flickr.com/photos/josefstuefer/18697485/
  • Who wants a challenge? MOBILE UX DESIGNERS! Pressure Accelerometer Time of day Gesture Microphone Haptics ... photo source: http://www.flickr.com/photos/dunechaser/174945526
  • Constraints
  • Constraints of mobile THERE ARE MANY! form factor battery network latency context input mechanism memory computational power
  • Context of use
  • PART 3 The platforms
  • WebOS Symbian Android iPhone/iPad MeeGo Windows Mobile Mobile web...
  • 2.8 Developer Economics Report 2010, Telefonica
  • http://www.visionmobile.com
  • Windows mobile is dead
  • Windows Phone 7 Panoramic experiences
  • Inspired by transportation graphics
  • PART 4 A few statistics...
  • 1 in 7 phones are returned BACK TO THE SUPPLIER Source: 2005 Which report (UK study) photo source: http://www.flickr.com/photos/andricongirl/4567650298/
  • Source: http://www.wdsglobal.com/news/whitepapers/20060717/MediaBulletinNFF.pdf 63% of returned phones have no hardware/software faults SO, WHAT’S THE PROBLEM? Handset configuration / settings issue Struggling with functionality / usability of device Device did not meet expectations photo source: http://www.flickr.com/photos/tom_lin/3208454911/
  • Source: http://www.btplc.com/inclusion/Usefuldownloads/index.htm#designs Massive market for usable phones & apps YOU NEED TO DESIGN ‘INCLUSIVELY’ By 2020, over half of the UK population will be > 65 1 in 3 Europeans can benefit from an inclusive approach 65% of americans have lost interest due to complexity photo source: http://www.elmbrook.org/UserFiles/Image/Volunteer%20Opportunities/Elderly%20Hands.jpg
  • photo source: http://www.flickr.com/photos/fotopakismo/1071787439 How do you feel today?
  • PART 5 Behaviours
  • human behaviours understand the behaviours what finger do we use to press the doorbell with? http://www.flickr.com/photos/tscarlisle/107776922/
  • (changing) human behaviours understand the behaviours what finger does the younger market press the doorbell with? http://www.flickr.com/photos/phototropism/62931265/
  • Time for a snack... DATA-SNACKING small snippets of info 30-60 seconds simple, but repetitive regular
  • Snack duration changing...
  • 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/
  • More than just a phone WAKE UP CANON & NIKON Source: http://www.flickr.com/cameras/
  • PART 6 Other things to consider...
  • Mobile is not about making things smaller Miniaturisation vs Mobilisation http://mobilewebbook.com http://www.flickr.com/photos/tridi_animeitor/2224661744/
  • Simpler interfaces are better Minimise the subconscious questions Balance efficiency, effectiveness & satisfaction Improve glance-ability photo source: http://www.flickr.com/photos/lagiuspo/92136687/
  • Simpler != dumb JUST REMEMBER TO FOCUS ON THE CORE FUNCTION an eReader app should focus on the ‘reading experience’ photo source: http://www.flickr.com/photos/lagiuspo/92136687/
  • Think twice about your audience IT PAYS TO DO YOUR HOMEWORK Analytics Network provider Device platforms Devices Firmware versions etc... photo source: http://www.flickr.com/photos/thomashawk/155918164/
  • PART 7 Future thoughts...
  • A task-centric future
  • People-first experiences
  • PART 8 The UI
  • Touch targets
  • Bad touch targets
  • Good touch targets
  • Gestures
  • PART 9 Wrapping up
  • Make the most of your platform
  • The little things count Polish makes the UX and app stand out photo source: http://www.flickr.com/photos/tom_lin/3186488124/
  • Passion “We haven’t worked in 3 years” Be curious. Question everything photo source: http://www.flickr.com/photos/taraethers/
  • thank you @ribot http://www.flickr.com/photos/ronlayters/2402199783/