How gestures are shaping the future of UX
From pushing the buttons on a mobile phone to touching, gestures have come a long way…
Every year there are new interactions being introduced into the world of design and when Apple introduced the iPhone, multi-touch technology became mainstream and users learned that they could not only point and tap on the interface, but also pinch, spread, and swipe. Gestures are the new clicks. Before we dive into the digital gestures, let’s look at some examples of gestures in real life:
Faucets
You activate this faucet by putting your hands beneath it. Of course, this can lead to confusion. If there are no visible controls, how do you know how to even turn the faucet on?
Dispensers
Without the tiny diagrams on the dispenser, there would be no affordances to let you know how to get the toilet paper out. Gestural interfaces need to be discoverable so that they can be used.
Why are gestures Effective?
Whenever a new gesture is released into digital products, there might be learnability associated with it but gestures are very effective as they are very natural. With an increasing amount of content on the screens, it is really hard to balance what to have on the screen and what to hide. Using gestures, we can hide the buttons and elements and drive the user to focus more on the content.
They can be associated with how people react with objects in the real world. For example, in real life when you don’t want something you try to push it away. Similarly, in a digital world, as shown below, you swipe an element left to delete the item.
Gestures have many more advantages other than being entertaining. Here are a few:
a) Less Clutter — Think data visualizations, dashboards with customer analytics, maps with clusters, and layers of information. How do we navigate through this constantly growing landscape of data?
b) Ease of use & seamless Interactions — When a user learns a specific gesture, it becomes a significant part of his or her user experience. There few chances this movement will ever be forgotten. One of the main advantages of gesture controls is in reducing the number of steps and clicks needed to perform a specific action in a mobile app. According to Kissmetrics’ data, the fewer clicks are needed, the higher conversion rate will be.
c) We need new ways to interact within our fantasy worlds — Designing virtual reality experiences involves multiple input modalities. As users, we best experience these as a simulated reality when we have tactile and haptic feedback to help us navigate.
Types of Touch Mechanics and Touch Activities
There are a lot of touch mechanics in spite of the fact that many users are probably only familiar (at least consciously) with tapping and swiping.
Tapping The most popular and basic one is tapping, which is when you touch the screen to perform an action like opening up your email app.
Tapping is characterized by a simple press of one finger and then a lift.
Double-tapping
Then, there’s double-tapping, where users immediately repeat the action of tapping back-to-back. This is usually linked to making things appear bigger on a screen.
Swiping Now, we get to swiping, which many people are familiar with. Swiping is typified by pressing your finger down, moving an on-screen element, and then lifting your finger again. The perfect example of this is your iPhone’s lock screen, where you have to enter your code to access the homepage.
Dragging However, there’s also dragging, which involves the same touch mechanics, but at a different speed.
If you want to drag app icons to different parts of your home screen, you are dragging instead of swiping.
Long Pressing
Long pressing is when your finger touches down on a screen element, holds for a moment, and then lifts off the screen. A resulting touch activity could be opening up the copy box to copy a section of written content.
Pinch-Open Another touch mechanic that’s good for zooming in on your mobile screen, pinch-open requires you to press with two fingers simultaneously, then move your fingers away from each other, and finally lift both fingers.
More Gestures……..
Flinging
Loosely connected to both swiping and dragging is flinging. Again, the touch mechanics are the same as a swipe, but the speed’s different. With flinging, you’re moving your finger very fast, as when you fling up on the screen to get rid of someone’s profile image that you clicked on in your Twitter app.
Tapping (two fingers)
Here, you press with two fingers simultaneously before lifting both fingers off the screen. This is usually another way to zoom out on content.
Swiping, Dragging or Flinging (two fingers)
This requires you to use two fingers as you tap, move and then lift your fingers. It’s good for choosing multiple elements on-screen or tilting or panning.
Long Pressing & Dragging (two fingers)
With this gesture, you press with two fingers, hold, move and then lift your fingers. This touch mechanic is good for when you’re working with an interface requiring you to rearrange list items or reorder cards in a collection.
Double-tapping (two fingers)
This is where you use two fingers to tap, lift, tap and then lift both fingers again. It’s generally used for zooming out on your screen.
Rotation Sometimes, you’ll encounter moving content or animation on your mobile devices, which is where rotation is useful. This is where you’ll press down with two fingers around a central object, then orbit your fingers around it, and, when done, finally lift both fingers.
Using Google Maps when out and about requires you to constantly rotate around significant screen elements to get a better sense of your orientation.
Conclusion
Gesture driven apps become a trend in a mobile user interface design. The movements based on a thumb and pointing finger enhances the way we are used to navigating through mobile applications. They provide many different combinations allowing us to open a needed screen with natural gestures which we often use for manipulating physical objects. Gestures are the future of a mobile design because they provide various advantages for both app developers and users.
