Designing a mobile app to use gestures

mobile app design: gestures
gestures in mobile apps

Flick. Tilt. Pinch.

Apps have one unique advantage over websites in that they are ideally suited to use gestures. Most modern mobile operating systems such as iOS and Android have gesture recognition engines in order to translate a selection of screen events into higher level gesture events that are easier to use.

More Interaction

Gestures can add an extra level of interactivity to your app and take it beyond something that feels like a webpage on a small screen to something that is quick & effective to use. Common gestures include:

  • Tap – probably the most simple. This is often used to perform an action, normally on a button
  • Drag – a tap and hold that is often used to visually move one onscreen item somewhere. A good example of this is the catapult in Angry Birds
  • Swipe/Flick – this is a slightly more advanced gesture that involves a swift finger movement on the screen. Think Fruit-Ninja or Cut the Rope. Modern multi-touch screens can often track 5 or more swipes simultaneously. These gestures can be used to delete items in a list for example or to scroll the list quickly.
  • Press and Hold /Long Press – an extended tap where the user holds their finger to a second or so. This could be used to display a context sensitive menu for example.
  • Pinch – Two fingers moved together or apart. This is commonly used to zoom or un-zoom images and maps.
  • Rotate – This is similar to the pinch but the one of the two fingers is rotated around the other. Often used to rotate images or maps.

Making sense of the sensors

Sensitive accelerometers in modern devices allow gyroscopic gestures to be used as well.

  • Shake –A quick rattle of your phone can be used as a gesture to randomise or as a “no” type gesture. The shake has been used in some MP3 apps to shuffle songs or on a etch-a-sketch app to reset the picture, just like the real toy.
  • Orientation – turning your phone over may indicate an unwillingness to use it or be distracted so this gesture could be used for a mute function

In summary, when designing an app, pay special attention to the way gestures can be utilised to improve your app and enhance the way your users can interact with it.