Beyond Responsive

The rise of mobile has forced creators of web experiences to think beyond the desktop format. But, if we have learned anything from the recent push to mobile, we need to anticipate the future sooner rather than later; not only the next wave of formats, but everything beyond that.

Despite the title, this is not a post about responsive design. Instead, it’s about stepping back to evaluate some of the changes that have contributed directly to the rise of responsive. I will address some of the key concerns with designing interactions across multiple devices today, and things to consider as we prepare for the next wave of new devices. I believe it is important for us to reposition the conversation from designing for multiple screen sizes and device types, to focusing on the design of experiences that translate across any context.

Ch-ch-changes

The last 10 years have seen significant shifts in technology. Interaction designers know this all too well, having to constantly incorporate new ideas and techniques to cope with these changes. Like most technology shifts, the real impact isn’t surface level software and hardware changes. It runs deeper, changing our behaviours and relationship with technology. While the desktop web isn’t disappearing anytime soon, form factor fragmentation has forced us to consider context when designing experiences across various devices. Where we once designed primarily for users sitting at a desk, with a keyboard and mouse, today all bets are off. Context is in a constant state of flux. Even if we think we have a good sense of it, we need to accept that we can never really know.

Expanding Our Toolbox

In our attempt to deal with the context issue, we have found significant value in a variety of combinations of native and responsive solutions. In many cases, these solutions hold tremendous value as tools for specific problems, but they're limited to a narrow set of solutions. Instead we need to think about the approach we take when designing interactions that can translate experiences between devices and context. Think of it like this: a hammer and wrench are essential tools, but not for every job. We don't need another tool - we need a construction manual that can help us determine which tools are best for any project.

Compounding The Problem

We are also seeing what I like to think of as the primordial sludge of the future creeping into our everyday lives. The utopian technology visions of the past once seemed like a distant future, but new devices are emerging that introduce new variables into the digital ecosystem which we need to anticipate and understand preemptively.

Some of these devices are already here. They bring interactions into the physical realm, consume and create content in new ways, learn, remember, are connected, sense and record data and take on strange new forms. We need to stop trying to just keep up with technology and new behaviours and start riding the wave with smarter design decisions.

But how do we do this? How do we better meet the needs of today and proactively anticipate the future? How do we address interactions with connected, intelligent and even active participants? How do we create more integrated experiences that tie our connections together?

Flexible Interactions

I want to introduce the notion of “flexible interactions,” a concept I hope will help us answer some of these questions. So what is a flexible interaction? A flexible interaction is one that anticipates change, supports user needs and extends experiences. To clarify the term I found it helpful to look at what defines flexibility. In this light, a flexible interaction is defined as an interaction that can be modified based on context and respond to users accordingly. Flexible interactions are easily modifiable, understand altered context and respond accordingly.

Easily Modifiable

Flexibility means being modifiable. This means design with the expectation of modification, anticipating not just some contexts, but all contexts. They are also presentation-independent and interface-agnostic, allowing them to be moved around easily. To do this, however, they need to be highly structured and modular in order to allow them to be fluid. Finally, these interactions must be knowledgeable about themselves, so that when we shuffle them around each piece can communicate its purpose.

A good illustration of this attribute is Twitter. They approach their experience across contexts from a variety of angles, made possible by having content and interactions that are built with reuse and new configurations in mind. From desktop applications, to mobile apps and even third party uses through their API, a tweet can be pulled apart and reconfigured with ease to suit the context.

 

A flexible interaction is one that anticipates change, supports user needs and extends experiences.

 

Understands Context

Flexibility means understanding context. But understanding context doesn’t mean predicting the user’s context; instead, it means building in ways to sense the specifics of the context and process this information in some useful way. While we do this already to a degree, we have so many more forms of data we could use to our advantage: device type, location (coordinates and proximity to other devices), locomotion (speed and movement), immediacy (time based dimensions), intimacy (knowing and learning about the user), sound (direct speech or ambient noise levels), visuals (light levels and camera sensing), behaviour (touch and user interaction patterns) and new inputs that will continue to emerge.

An interesting example of this can be found in a Microsoft Research project called Falcon. This piece of software is designed to monitor the user’s mobile behaviour. Using as many contextual inputs as possible, it makes predictions as to what applications the user is likely to open next. This prediction then triggers the device to open the top three most likely applications in the background, so that when the user does tap to open, their loading time is significantly reduced.

Responds

Flexibility means responding. As we saw in the Falcon example, with a modifiable structure in place and the ability to sense changing contexts, flexible interactions respond accordingly. They do this in two major ways: form and function. Form means responding by changing an interaction’s shape, design, order or content, while function implies modifying an interaction’s ability, memory or behaviour. This is the level of feedback experienced by the user and often the only level of a flexible interaction that might be apparent to them.

Examples of this attribute can be seen in a variety of interactions and are the direct result of the other two key attributes. But perhaps the best example of this is NPR’s Content Management system, COPE or Create Once, Publish Everywhere. The principle of this approach is a content management system that structures content at a detailed level, so that it can be configured and reconfigured across multiple devices, context and mediums. With this structure in place, interactions are a direct response to the context at hand; a piece of content can be viewed in multiple contexts, responding to the constraints to satisfy user expectations and behaviours. While brilliant in execution, with time this approach could be extended further to absorb even more context and respond at an even deeper level.

 

Perhaps the best example of this is NPR’s Content Management system, COPE or Create Once, Publish Everywhere.

 

Flexible Interactions are easily modified to respond to altered contexts; anticipating change, supporting user needs and extending experiences now and into the future.

Toward Flexible Interactions

I believe that this approach will guide decision making in a diverse ecosystem of technology and will extend the discourse beyond existing solutions. Ideally we can move beyond responsive and reapproach design challenges from a systematic perspective.

This article is based on my presentation of the same name which was originally presented at the Interaction13 Conference on January 30, 2013.

Written by

Nate Archer

Nate Archer

Next article:

Meet Our Fellows

Sign up for our newsletter