Sub-Interactions in Digital Product Design
For a long time now, designers have tried to optimise the accessibility of ‘application features’ to such an extent, that it’s of second nature to the user. In general, designers follow the ‘Point of Action’ (PoA) approach to make features accessible to the user (the word is not an industrial terminology, I have named the term based on the way applications behave). PoA can be a distinct button (or any other UI element) to activate a feature or to navigate. For example, the ‘+’ icon on Instagram opens the gallery page for you to select pictures and post. The ‘+’ icon is a PoA! Almost every feature of an application is accessed by some form of point of action. Unless balanced and positioned well, these PoAs can become misleading, inaccessible, and lead to bad user experience. To overcome visually cluttered UI with PoAs and space things out well in an application, designers must introduce variants of interactions to the application. But, what are their variants?
This was the plot for my next venture in my self-taught UI/UX designing. To overcome this problem, I have coined a term called ‘Sub-Interaction’. It means an interaction inside of another interaction. To make my explanation simple I have come up with an example for a sub-interaction that gives a broader picture to the thought process.
Example — The ‘Back’ Gesture
Not so long ago, Android switched to gesture navigation after the extremely positive feedback that Apple got from its iOS gesture set. Recently, as an update to Android 10 and the OnePlus Launcher, the ‘swipe up — from the bottom — to go back’ gesture replaced the ‘slide from left/right to back’ gesture. In the OnePlus Launcher (and a few other skins), this gesture shows a ‘Drop’ like button, indicating the gesture is registered (visual confirmation). This interaction is very straightforward. Apart from the back gesture, there are 2 more interactions that have a similar action, opening the recent apps drawer, and switching between applications. The only difference being, these two gestures are triggered from the bottom of the screen.
The crux of sub-interaction lies in effectively grouping and triggering of PoAs. The back gesture, recent apps drawer gesture, and app switching gesture are PoAs of the Android OS. They can be grouped into a single interaction group, which is navigation, and assign one primary form of trigger. It will get a little clear from here if it isn’t!
I posted a survey asking ‘ How would you usually switch to another application on your phone, assuming it’s already open in the background’ and the image below shows the results.
The majority of them use the ‘recent apps shelf’ or the ‘app switch gesture’. By grouping them into one optimized form of interaction we can reduce the number of PoAs, reduce the time of switch and smoothen application flow! I applied the concept of sub-interaction to this use-case and here is the interaction I have come up with.
The primary interaction is the ‘slide to go back’ gesture and the sub-interaction is ‘app-switching’. Here’s how it works.
- Slide & release — to go back (Primary Interaction)
- Slide — hold — move upwards/downwards to pick the app to switch to (Sub-Interaction)
A good sub-interaction can be created by grouping the right number of interactions with common relations. Finding innovative ways to perform the interaction is up to the designer's and the developer's imagination and capabilities. The idea is still in its initial stages and I hope anyone reading this can come up with more such sub-interactions and conceive new forms of UI design with it in mind!
