SxSW: Teaching Touch (Josh Clark)

04 Apr

Josh Clark’s presentation on touch design was one of the better presentations of the week – a combination of humor and good information, presented in one of the most charismatic sessions I saw. As I said after:

After seeing @globalmoxie speak, I need to tweak my #SxSW presentation with more humor/fart jokes

Here are the highlights of the session.

Presenters: Josh Clark
Hashtag: @globalmoxie

In the coming years, interfaces will lose the cursor, leaving only you and the device – or you and the content.

  1. Traditional point and click interfaces suck on large screens (Fitt’s law)
    • Even on iPad email have to click small ‘back’ button several (million) times
    • Buttons not always wrong – gives affordance of action but gestures can take over for some things AS SUPPLEMENTS
    • Gestures are the keyboard shortcuts for touch

Big Screens Invite Big Buttons – buttons were needed as an abstraction for functionality and have a role still but there may be other, useful methods like touch, voice, etc

  1. Win8 supports gestures – goodbye passwords: Win8 will allow patterns on top of a picture
  2. Twitter on iPad almost did away with buttons entirely – can sweep instead (card metaphor)
  3. We need two things to make gestures on the web workable – real support for gestures across browsers and libraries, and gesture conventions.
    • JavaScript only has limited gesture options – tap, swipe
    • Conventions have yet to be established – apps all have own conventions, web apps have to avoid interfering with OS standard gestures
    • JavaScript libraries can add some gestures
      • JQuery mobile adds 3 gesture controls
      • SenchaTouch adds 7-10 more for Webkit only
      • Touchy.js – library adds function

Experiments in Touch

  1. IKEA app concept –
  2. Clear app –
  3. TouchUp app ex. – to change brush size, can’t use pressure because inexact; this app uses pressure to change canvas size instead.
  4. Massive Swiss army knife example – Clarity trumps density; with design, more features = more controls

How do users discover gestures?

  1. Inherently invisible; the less it resembles a physical action, the harder to discover
  2. Google maps – 2-finger tap zooms out – how would you know that?
  3. Importance of Visual Cues – theOCDChef cutting board ex.
  4. Many aps often start with instruction screens on apps – have to then remember them, plus no context to the instructions
  5. Should include reference, but don’t make it a learning guide
    • Best interfaces don’t need instructions
    • Don’t make me use buttons if you create a gesture-style interface; if it looks like a physical object, people will try to interact accordingly
    • Magazine examples are too literal – long swiping PDFs, but remove key pieces like a gesture to get to TOC
    • Voice Memo app = bad metaphor for interaction: entire activity is focused on single small button in lower corner
  6. Amazing how quickly toddlers pick up interaction with an iPad – very young and very old pick it up quickly because they don’t have learned bad habits from years of cursor-based use

Play More Video Games

  1. Coaching
    • Basic instructions and demonstration, practice
    • Help them in the moment (overlays with instructions)
      • Web version = coach marks
      • Clippy issue: bad advice at wrong times
    • Gesture without a visual aid is a suitcase without a handle
  2. Leveling up
    • Teach when a skill is needed vs all at once – think of app having levels, and when you need to lead
    • OS Lion scrolling ex. Upside down from previous version
  3. Power ups
    • Areas where you can add skills for expert users
    • Twitter app ex. – make them learn the long way, but after a time introduce a better way

My Tweets During Session


Tags: , , ,

Leave a Reply