Member-only story
Interactions in Material Design
Material Design, introduced by Google in 2014, had been my go-to place to reevaluate the design languages in my projects because of its use of metaphors from the physical world. The appearances and properties in the physical world, including how depths or layers are expressed through light and shadow to feedback that makes sense when interacting to physical objects, inspire rules of Material Design. In Material Design, graphics have to be intentional; motions have to guide users to focus on elements and reinforce how these elements will transform or reorganize as they are intended.
Navigational Gestures
Gestures help users to navigate between views, take actions, and manipulate content.
Navigational gestures are alternate ways for users to navigate through pages, which serve as supplements to navigational UI. The input can be tap, scroll and pan, drag, swipe, and pinch. In Material Design drag and pinch also can be a gesture to navigate between individual page elements, specifically to transit into detail pages from a list or collection view. In the example below, the left shows how a transition into the view helps to suggest how users may need to drag down to close the view.
As if views and pages were physical objects, animations driven by gestures should communicate where the new information comes from and where to access previous information from. Having layers help to visualize these relationships in organized hierarchies. The transaction creates milliseconds of delay, but it communicates the organization more clearly.
In contrast to gestures, graphic UI guides users to a series of actions they can take especially for elemental users. Some of the navigational gestures are used for more advanced users to take these actions much faster, however, even for advanced users, the heavy use of different navigational gestures could overwhelm especially because the same gesture could function differently in other applications they use. Even within same application, it could create conflict and confusion to the users. The example below shows the risk of applying multiple gestures which may create conflict between 2 purposes. Horizontal swipes between tabs and collection views are a good example that show conflict.
