Talk of artificial intelligence isn’t the only discussion that’s blurring the lines between reality and digital spaces. More tactile interfaces are rapidly growing in popularity.
The trend started with the emergence of Material Design, Google’s design guidelines that dictate how their interfaces will look and work.
But tactile design goes beyond the basics of Material Design. The key to making tactile design work is creating enough space so physical objects look real in a digital space.
What is Tactile?
Tactile design is not the same as the skeuomorphic concepts that were the standard in the early 2010s. Tactile relies more on flat or almost-flat elements, reserving shadows and effects for elements to help “lift” them off the screen.
Most tactile projects create an illusion of three-dimensional objects in a digital space.
Google’s Material Design guidelines provide a good synopsis of what tactile design is supposed to be: “The material is grounded in tactile reality, inspired by the study of paper and ink, yet technologically advanced and open to imagination and magic.
“Surfaces and edges of the material provide visual cues that are grounded in reality. … the flexibility of the material creates new affordances that supersede those in the physical world, without breaking the rules of physics.
“The fundamentals of light, surface, and movement are key to con- veying how objects move, interact, and exist in space and in relation to each other. Realistic lighting shows seams, divides space, and indicates moving parts.”
Tactile design, is not virtual reality, it’s much more of a set of layered effects that connect users and interfaces to create more engagement.
“Borderless” Design Elements
Tactile design doesn’t live in a box or frame. The idea is that users should imagine a canvas beyond the screen and the potential of ob- jects in that space as well.
Layers and elements can cross planes and go into the “space” of oth- er elements, with text on multiple screens and elements sitting almost on two places at once. (The Epicurrence website design does a lot of this, mixing it with tasteful parallax effects to ensure the user knows what to do and keeps moving through the website.)
Because of the idea that digital and real are one, these designs can’t be boxed in.
Look at the example design for OTQ, above. The top of the bed ap-pears to have lighting on it from the lightness at the top. Look at the below the bedside tables, where shadows are below the tables. The shadow perfectly matches the light source shown elsewhere in the design, making the overall effect look and feel more real.
Pull It All Together
Many of the interfaces using tactile design elements actually use multiple techniques noted above. You can even see this in many of the examples.Tactile design requires a rethinking of design schemes and patterns – it’s not something a designer can deploy quickly to an existing design, making it a trend that’s emerging slowly over time as sites redesign and reinvent themselves.
With design thought leaders such as Google and Apple making tactile design the foundation of their aesthetic, more websites – of all sizes – are certain to follow.