Exploring new interactions: Navigation triggers
Can a navigation bar do more than just traversals between application pages?
In continuation to my sub-interactions article (link), I have been trying to ideate how more sub-interactions can be integrated into an application. This study also tests the limits of a sub-interaction and at what level it becomes excessive. As mentioned in the earlier article, a good sub-interaction can be created by grouping the right number of interactions with common relations. In this article, we shall see another example of sub-interactions and will shed some light on the types of relations these interactions must have to be coupled.
Navigation Bar
Before we dive into the example, let’s take a minute to answer ‘what does a navigation bar of an application do?’. People often answer this question as navigation is a section that helps in opening the main pages of an application. The affordance of a navigation section is tap-to-trigger. Affordance is defined as the ‘clues’ that tell a user what an element can do. For example, the affordance of a bottle cap is pull/twist to open. In a digital interface, a button can be tapped upon to trigger an action. With the concept of sub-interactions, my goal is to add more features to the navigation bar apart from tap-to-trigger.
Inspiration
It wouldn’t be an overstatement to say a lot of digital actionable elements (buttons, sliders, circular sliders ~ knobs, toggles, etc.) are inspired by real-world hardware. A while back, WhatsApp had introduced the swipe-to-reply feature for messages. This might be the first time a recoil interaction (usually found in radioshack) was translated into a digital use-case. Please correct me if I’m wrong. The swipe-to-trigger interactions have been around for a while now (examples: swipe left on youtube history video list to show remove option, wink wink) but recoil is a first. Through this article, I want to explore how swipe-to-trigger with recoil can be used as sub-interactions or additional interactions in an interface. I’m clubbing the interaction with the navigation bar for my example.
The Example
It might be clear by now that this example is trying to integrate the swipe-to-trigger recoil interaction to the navigation tab. By adding swipe-to-trigger recoil to a few or every navigation section, quick-access or shortcuts can be included in the flow of the application. The below animation explains the usage.
The swipe actions of each section can be specific to the section’s use case but it’s not a necessity. What it means is, the action can be dependent on a section of the navigation or it can be generic. In the below example, the swipe-up activates quick pay which is a general feature of the application and swipe-right activates profile settings, which could be section-specific action. The action completely depends on the application and its importance. This also emphasises on the relation between the grouped interactions as mentioned earlier.
Conclusion
Recoiling interactions are not very common in applications yet. I believe there is great potential in exploring this interaction. Matching them with the right action would improve the quick-access and shortcut aspects of an application to a great extent. That said, please let me know if any more applications make use of this interaction and how you think it can have more use-cases.
