It's a Mobile and Touch World

Uploaded on

A compilation of my notes from sessions I attended at SXSW Interactive 2012 about user experience for mobile and touch devices.

A compilation of my notes from sessions I attended at SXSW Interactive 2012 about user experience for mobile and touch devices.

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads


Total Views
On Slideshare
From Embeds
Number of Embeds



Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

    No notes for slide


  • 1. “it’s a mobile & touch world”Frank GarofaloUI / Human Factors Engineer,Esri Professional Services
  • 2. credit This presentation is based on a keynote and a break-out session at SXSW Interactive 2012. Keynote “Ambient Location and the Future of the Interface” presented by Amber Case ( Session “Teaching Touch: Tapworthy Touchscreen Design” presented by Josh Clark (Global Moxie)
  • 3. overview & objective Perspectives on mobile / touch devices and location sensitive applications.
  • 4. move away from point and click interfacesImage source:
  • 5. focus on the content within the interface & interact with the content directlyImage source: (Photo credit: Jay L. Clendenin / Los Angeles Times)
  • 6. Fitt’s Law: further away a target, the harder it is to hitReference source:
  • 7. same concepts apply to touch interfacesImage source:
  • 8. gestures “Gestures are the keyboard shortcuts of touch” • 5 fingers • Swipe right / left • Pinch the entire screen
  • 9. gestures • Gesture-based Passwords • Slide content panels in and out with gestures • Gesture conventions are still evolving / refining - don’t rely on just gestures (offer as shortcuts)
  • 10. instead of changing the brush size, change the drawing canvas sizeImage sources: / /
  • 11. touch interfaces • Remove visual clutter • Challenge: “finding what you cannot see” - Needs to try to resemble physical action - Needs to provide cues
  • 12. touch interfaces • With a little help, people will learn to use your app • Follow social conventions when providing cues
  • 13. visual cuesImage source:
  • 14. visual cuesImage source:
  • 15. visual cues …why have a “label” when you can see the contentImage source:
  • 16. touch interfaces • Embrace the interface… if it looks like a physical object “make it realistic” • Nature doesn’t have an instruction manual / help-doc
  • 17. Image source:
  • 18. just-in-time assistance Providing in context help /assistance just as a person is about to perform the task / action for the first time. Think about playing a video game as a novice….
  • 19. just as your about to take on a challenge, the games provides a suggestion for a new actionImage source:
  • 20. teach as you go …novice to expert to master 1) Coaching - Active discovery, mentoring - Temporary overlays, animations, visual cues 2) Leveling Up - People are most prime to learn a skill when its needed - Level 1 introductory, show skills 3) Power Ups - Evolving to expert - “Unlock” shortcut with explicit animation or message
  • 21. this generation is growing up with touch devices (as a baby sitter), not desktop mouseImage source:
  • 22. Mobile …and location sensitive interfaces
  • 23. location sensitivityImage source:
  • 24. location sensitivity + relevant informationImage source:
  • 25. proximity to things around you Geo-fencing! - Provide relevant options based on location & proximity
  • 26. actions to trigger interactions
  • 27. “smart house” - Setup a geo-fence around your house - When you are within x miles from your house, turn on lights and raise temp - When you leave the geo-fence, turn off any lights that are on and lower temp - Your mobile device becomes a remote control for the world
  • 28. “smart bus stop” - Setup a geo-fence around a bus stop - Automatically notified of the next arriving bus
  • 29. “real game of pac-man” - Setup geo-fences randomly around a cityImage source:
  • 30. …an interface that responds to your actions - Formulate some parameters to be responsive - Who are you - What do you need / want to do - Where are who - What is around you - Here and now (ie. physical buildings, current events) - In the future or past
  • 31. shift fromhuman-computer interaction
  • 32. shift fromhuman-computer interaction to human-data interaction
  • 33. shift fromhuman-computer interaction to human-data interaction (especially in a mobile & touch world)