UI Design18 minute read

Designing for Interactive Environments and Smart Spaces

Designing past mobile or desktop interaction boundaries and into the physical world opens up possibilities to create immersive environmental experiences.


Toptalauthors are vetted experts in their fields and write on topics in which they have demonstrated experience. All of our content is peer reviewed and validated by Toptal experts in the same field.

Designing past mobile or desktop interaction boundaries and into the physical world opens up possibilities to create immersive environmental experiences.


Toptalauthors are vetted experts in their fields and write on topics in which they have demonstrated experience. All of our content is peer reviewed and validated by Toptal experts in the same field.
Jamie Teresuk
Verified Expert in Design

Jamie is a UX art director with two decades of experience leading international teams and delivering top-notch design for digital products.

Expertise

PREVIOUSLY AT

American Red Cross
Share

Design comes in all shapes and sizes, whether it be wearable, hand-held, the size of an arena, or a virtual borderless experience! Yesterday’s point-and-click technology is quickly fading, and as designers, we need to keep up with the times. But whatever we are faced with designing, human experience should be the source of our inspiration and thought processes.

A Brief History of Interactive Environments

A Brief History of Interactive Environments

It is hard to imagine our modern world without the conveniences of multi-touch technologies, and to fully appreciate how we got here we must take a deep look throughout history. Bill Buxton collected a pretty comprehensive list of various historical technological breakthroughs in the field of multi-touch, which dates as far back as 1965, where E.A. Johnson’s finger-driven interface is generally considered the first of its kind.

image

But even from the earlier days of science-fiction futurist fantasy, man has always dreamed of the technological possibilities to control the world around us at the touch or wave of a hand! One of the earliest known references to interactive gesture control was written in Robert A Heinslein’s novella, “Universe,” originally published in Astounding Science Fiction in 1941 and later collected with its follow-up “Common Sense” in the 1963 title Orphans in the Sky, in which Heinslein describes controlling machinery circuitry by placing a hand over a light instead of using physical controls.

As technology and its possibilities of human-and-machine interaction have evolved over the years, many other authors as well as film and television directors have enticed our imagination with various fictional interfaces from the likes of Star Trek, Tron, Blade Runner, and arguably the most iconic Heads-up-Display UI from Steven Spielberg’s Minority Report.

Science FictionReality
image
image
Minority Report directed by Steven Spielberg, 2002"g-speak Overview" by John Underkoffler, 2008

 

This science fictional inspiration has become a reality, as seen in John Underkoffler’s multi-modal technology Oblong platform called “g-speak,” which was famously unveiled at his TED 2010 talk “Pointing to the future of UI.” As these fantasies become more richly part of our modern reality, we are able to engage audiences more and more, utilizing the vast interactive environment technology advances of today.

Moving Off-device and into the Physical World

Curiosity in a Sensory World

As humans, we have an intrinsic curiosity that always needs to be nurtured. Now that we live in an ever-present touch-focused world and the Internet of Things, to users, nothing is off-limits when it comes to exploration and connectivity. Users are demanding more and more out of their interactive experiences, and we have more opportunities to reach them in personal ways than ever before.

Thinking past the boundaries of mobile or desktop interactions alone and into the physical world opens up potential possibilities to create new immersive experiences. If we are able to expand upon recent installation and exhibition artists’ experimental concepts with multi-sensory environments, not only will our spatial designs be visually appealing but we can even stimulate our audience with all senses to invite them to become more immersed in our mad-science creations.

Tactile (touch)Auditory (hearing)
image
image
"DMM.PLANETS Art" by teamLab, 2016
Odaiba Aomi area, Tokyo, Japan
"Drawing on the Water Surface Created by the dance of Koi and People - Infinity" by teamLab
"Lines" by Anders Lind, 2016
Vӓsterbottens Museum, Umeå, Sweden
"An Interactive Sound Art-Exhibition"

 

Gustatory (taste)Olfactory (smell)
image
image
"Teardrop" by Marije Vogelzang, 2013
In DordtYart, Dordrecht, Netherlands
"Garden of Scents" by Projectiles, 2017
Le Grand Musée du Parfum, Paris, France

 

A good example of a commercial take on this was Glade®’s New York City “Museum of Feelings” pop-up exhibit where museum-goers were surrounded with visual, tactile, auditory, and olfactory delights, which featured five zones, each with its own unique interactive multi-sensory experience.

 

Industry Opportunities

As more people and businesses become aware of the potential to create rich intelligent environments and their marketing or social benefits (source: Planar “Digital Signage At-a-Glance” infographic), there will be more and more opportunities for designers to create outside-the-box experiences for physical spaces.

We already see some of these solutions in the following industries, and we are beginning to see more industries start to adopt smart space designs.

Museums & GalleriesRetail
image
image
"W3FI" by Chris Coleman & Laleh Mehran, 2011
Boulder, Colorado, USA
Gatorade Mobile Roadshow, Interactive Brand Experience by Demodern, 2016
Various locations, USA

 

Trade Shows & ConferencesCorporations & Workplaces
image
image
Intel's "SenseScape" by Patten Studio at CES 2016, 2016
Las Vegas, Nevada, USA
Google Creative Lab's "Google Play Music" application by Obscura Digital

 

Festivals & EventsBroadcasting
image
image
Beck's "Hello Again" by Dinahmoe, Stopp LA, and Chris Milk, 2013
Los Angeles, California, USA
Sky News' "Video Wall" by Vizrt, 2012
Isleworth, United Kingdom

 

AutomotiveHome Space
image
image
Audi's "Urban Future" by Kollision, BIG and Schmidhuber + Partner, 2011
Miami Beach, Florida, USA
Microsoft's "Envisioning Center," 2013
Redmond, Washington, USA

 

EducationGaming
image
image
Queensland University of Technology's "The Cube," 2013
Brisbane, Australia
New York Hall of Science's "Connected Worlds" by Design I/O, 2015
New York City, New York, USA

 

With gesture and voice controls, hologram projections, augmented, virtual and mixed reality becoming more commonplace, and with the introduction to the idea of neural lace, we can plant users in a moment in time or an emotion, or we can even transport them into other worlds! It’s an exciting time to be a designer!

What Leads the Design Process?

Don’t Use Technology for the Sake of Technology

Just like a desktop computer or a mobile device, large-scale audio-visual systems are tools to communicate information, tell stories, and create emotional experiences. In the 1997 World Wide Developers Conference, Apple’s late CEO, Steve Jobs, stated in an interview, “You’ve got to start with the customer experience and work backwards to the technology. You can’t start with the technology and try to figure out where you’re going to sell it.”

Do not design based on technology fads. Cool new-fangled gadgets and tech toys are merely tools of communication and shouldn’t be used without adding user value. As drool-worthy as Sony’s new CLEDIS Display is, you better have an amazing reason to use that gorgeous panel with such a hefty price tag. Every design decision must be met with a functional purpose or reasoning behind utilization.

Communicate Ideas with Storytelling and Empathy

If stories and narratives are the key to creating emotional responses, then we must reach our audience on an intimate level. If we are able to design with empathy, we can begin to understand how people behave, feel, and think about the world around them, and encourage them to think outside themselves; then, visitors can be moved to either action or reaction by not only by visual imagery, but the overall feeling of the space or event.

image
"Le Petit Chef" by Skullmapping, Belgium 2015

 

In Skullmapping’s 2015 “Le Petit Chef” Dinner Time Stories experiment, wherein a miniature chef turned a dinner plate into a grill with projection mapping, the restaurant-goers were delighted when their very own mini-chef prepared a meal in front of them. The charming miniature chef makes waiting for your food enjoyable and the restaurant-goer falls in love with the character’s strengths and weaknesses while watching the story unfold. Not a bad way to wait for your food to be prepared!

Strengthening Brand Awareness

Telling the Brand Story

In a busy Moscow mall in 2015, S7 Airlines and Wieden + Kennedy Amsterdam teamed up for their “Fly to any place you can imagine” campaign, to encourage travelers to dream beyond their borders. With their “Imagination Machine,” visitors were hooked up to an EEG device, where purely with the power of their imagination, they were able to fly a virtual plane to their dream destination anywhere in the world! If they were able to land at their location without losing their train of thought, they would win a round trip ticket to their chosen destination!

 

Now, not everyone is able to award such extravagant gifts for participation in an interactive campaign, but there should always be some sort of “take-away.” If we require the audience’s time and energy, we must give them something in return for the time spent. Whether the goal is to educate, inspire, or share with others, the voluntary participation can be rewarded with added knowledge, an emotional response, and improved brand awareness.

Community Participation and Sharing

Nike is one of the most internationally recognized brands in the entire world. From its swoosh logo, to their “Just Do It” slogan, you’d be hard pressed to find anyone in modern society who hasn’t heard of them. And rightly so, as they work hard at keeping to strict brand guidelines while at the same time pushing the limits of design and creating innovative spaces for elaborate brand awareness.

Take, for example, just one of many of Nike’s amazing creations, their “Unlimited Stadium” in Bonifacio Global City, Philippines, where they constructed a pop-up race track whose perimeter was lined with full-sized LED panels. The stadium was designed to encourage runners to compete with a digital version of themselves, constantly upping the ante by running faster than the runner’s previous lap time.

image
"Unlimited Stadium" by Nike, 2016
Bonifacio Global City, Philippines

 

Not only was the race concept successful with gamifying Nike’s signature challenge with branded fonts and colors, but the entire fabrication, as seen from above, originated from the footprint of their LunarEpic shoe line! Talk about brand strategy follow-through!

Wowing your audience can go far when designing for large-scale spaces, but the small details are just as important from a form and functional perspective. Engage the onlookers, to encourage spectators to become active participants, to become part of the story.

Interactive spaces often incorporate opportunities to socially share visitor’s presence with location services or via social media to create marketing hype. Gonzaga University’s “Zag Wall” crafted by Second Story brings their historical tradition of signing their campus wall into a digitally preserved piece that can be collaborated on with multiple students and socially shared.

image
Gonzaga University's Hemmingson Center Interactives "Zag Wall" by Second Story, 2015
Spokane, Washington, USA

 

Making it easy and fun for visitors to share with their friends and colleagues can be an obvious way to create awareness not only about your environment design but about the brand itself. If a design is effective, chances are people will be telling their friends to check it out, too. Don’t be afraid to go viral.

Increasing Audience Engagement with Conditional Considerations

Interactive environment design is not only about creating something pretty to look at—it involves many different disciplines and content creators. People of all backgrounds come together to create meaningful spatial experiences, from architects and fabricators to audio-visual techs, psychologists, researchers, engineers, designers, content creators, and copywriters.

While design principles can often be the same between interactive spaces and mobile or web designs, scale, medium, and other considerations have a big affect on the outcome of the solution. Because smaller experiences don’t often need to solve for environment, material, or physical factors, user narratives and functional parameters will diverge when utilizing the whole human body, and not just small-scale interactions. Designing for successful experiences when it is competing with outside environmental factors is a matter of defining the design conditions that are affected, and adjusting to meet those needs.

We learn that in Moment Factory’s “Voyage Discovery” in the Tom Bradley International Terminal of the Los Angeles International Airport (LAX), the goal was to “enhance the passenger experience and to bring back the magic and romance of travel” and “to brand the terminal as a destination.”

image
Tom Bradley International Terminal's "Voyage Discovery" by Moment Factory, 2013
Los Angeles International Airport (LAX), Los Angeles, California, USA

 

They take their audience, their passengers, through a plethora of experiences within the architectural space, with the time tower being a central focus that could spread to other features throughout the terminal. Many conditional considerations had to have been made during their sixteen-month process of design and delivery. We, too, must consider the following factors to grab the attention of our users in any environment, even before our first low-fidelity sketches:

Environmental Factors

image
"Aqueous" by Jen Lewin, 2017

 

As we define “interactive environments,” the containing location or established physical space itself is what makes it an environment. Whether the environment has closed or open borders, is inside or outside, has natural or artificial light, and even the time of day, temperature, or weather that it will be visited in will have a great impact on the design solutions. Are there environmental objects that are unchangeable physical obstructions that may conceal the view or cast shadows in an undesirable way? Adjust the design based on these type of environmental concerns for better visibility and wayfinding sight-lines.

Just as lighting plays a big part in the environmental considerations, so does sound. If the environment is in a highly trafficked public space, you may want to adapt the design to work in harmony with the environmental noise. If the design requires sound installation to convey a story, it can often compete with visitor babel unless used in a fairly quiet space. For this reason, ambient sounds are often employed as supporting ambiance but not leading informational queues.

When taking your audience into consideration, and if there will be children or adults (or both), we also naturally need to design for the environmental cultural language of the community it is placed in.

Material Factors

image
"TRIPH" by Circus Family, SXSW, 2017

 

The physical materials of the fabrication can also impact the design. What kind of surrounding architecture the environment is in, or even the construction of the fabrication, can affect not only the structure, but even perhaps the technology used. When we are talking about masses of processors and displays being run simultaneously, you must consider the energy consumption and heat emissions being given off by running such an installation. There may need to be extra ventilation installed to keep things cooled.

Not only do you need your fabrication designs to meet the environmental standards you set or the permits required, you will also need to design for recurring maintenance. Just because your hard work is being installed doesn’t mean that nothing can go wrong from that point on. Put in place a maintenance strategy for cleaning, repairs, and possibly even content updates (if needed) to provide your client with the best long-term plan.

As there are a variety of technologies to pick from when designing large-scale interactives, they—and the surfaces, textures, and objects used—will also need to be tested in real time. It is always a good idea to get sample materials before the space is finally installed, as you never know if you’ll have too much specular reflection or transparency if you pick the wrong material for the effect you’re trying to achieve.

Functional Factors

image
Live Singapore's "Touching Transport" by Till Nagel and SMART Singapore, 2016

 

The purpose or scope of the environment, and thus the data and information you communicate to your audience, will be the building blocks of your functional parameters. Determine audience participation to establish passive or active interactivity among the intelligent space and its end result. Perceptual, discoverable, exploratory, sensory, and immersive environments serve different purposes and can be used individually or in combination.

Does the environment need to solve for privacy and administration? Are there special tools needed to allow presentation capabilities or locked content non-accessible to passers-by? How sustainable will the software be and how expandable is the content for future use? Can it be iterated and adapted upon easily in the future or is it a closed system without the possibility of advancement? Is the validity of the data factually sound? What kind of spatial depth and feedback does it provide the end user? We ask ourselves these questions for every unique experience we create.

Whether it be CMS database inputs, API pushed information, live collected statistics, or even particulars being expanded upon with machine learning intelligence, that data can be controlled via a plethora of ways including touch, voice, gesture and motion sensors, temperature sensors, gamepads, objects or devices, augmented reality, mixed reality, artificial intelligence, or even brain waves. Whatever the input and output may be, with the dimension of time and spatial depth and the engineering solution behind it, the method of functional delivery has an infinite number of possibilities and we can learn and grow our understanding about our users to adapt our applications to better service the operational objective.

Physical Factors

image
"AnyTouch" by Digitas Labs Paris, 2012

 

The scale of the installation, visible sight-lines within the environment it’s in, and static or active physical components can alter the design form as well as the functional interaction. With the combination of digital spaces and tangible objects, we are able to direct users to become active participants in a goal, using human-centered interactions, and allowing people to naturally engage with the world around them as they would in everyday life.

Internationally, there are different standards when it comes to accessibility, but from a principle standpoint, any environment created should be accessible and legible by every person. With that and the target audience in mind, any touch points that require physical interaction should be reachable by smaller persons or persons needing wheelchairs or similar assistive devices and typography scale and contrast legibility is imperative in any environment design.

Similarly, all people often have various physical stamina limitations. User fatigue is a common complaint among interactive installations. Design for interactives where a user isn’t required to constantly keep their arms raised for extended periods of time, or having to adjust the height of reach.

Emotional Factors

 

It’s not enough that we build products that function, that are understandable and usable, we also need to build products that bring joy and excitement, pleasure and fun, and yes, beauty to people’s lives. – Don Norman

Just as described earlier when discussing storytelling, try to reach the user on an emotional level to attract and engage them to participate in your environment so that they might further explore and discover new insights. The information that we provide the audience must be intuitive and clear so as not to create confusion or deviate from the end goal, yet also fun and enjoyable!

As such, whatever story we are telling the audience, the design solutions may have ethnographic implications depending on the audience’s cultural identities and social groups. It is important to design experiences with a standpoint of social and cultural responsibility to not only emote within the audience’s cultural boundaries, but also to allow them to think outside themselves and their geographical bubble.

What we do with a user’s data is a topic that we are continuously concerned with not only as designers of applications but also as users of them. Because these environments are often in public spaces and have social participation without a lot of “opt-in” methods other than user involvement, it is important not to violate the visitor’s privacy rights and hold good ethics at the forefront.

Give the audience flexible goals so that they can “choose their own adventure,” so to speak. This allows the user to feel like they are in control of their own destiny, and that they are the author of their own narrative, thereby helping them further trust their unique experience. With the addition of social participation, games, and sensory modalities, you can further deepen user advocacy and bonding.

Knowledge Acquisition and Retention

Interactivity Improves Learning

Interactivity has been introduced in the classroom for a while now, although the idea has been fought against and not adopted widespread until more recent years due to the positive research results of the effects of interactive learning technologies. And although interactive environments are not always meant for the classroom, we can greatly apply similar learning principles when we compare it to information retention from a digital environment.

In a 2013 University of Illinois study about the benefits of interactive education, it was found that 10% of students primarily learn through hearing, 40% of students primarily learn through watching, and 50% of students primarily learn through doing (or active learning), while 100% of students benefit when they encounter information in multiple forms.

image
Average Retention Rates "Learning Pyramid" adapted from National Training Laboratories Bethel, Maine, USA
Image source: Fashion Institute of Technology

 

Active learning is further detailed in the Learning Pyramid, where National Training Laboratories has shown that information retention quickly deteriorates if not applied and practiced in an active setting. Incorporating participation, as opposed to passivity, by allowing the audience to “do” and “actively learn” by experience ensures that more knowledge is retained. Of course, there is never a hard-fast rule to be applied here, but on average, contrary to “passive learning,” a person will comprehend more when hearing, seeing, touching, and actively doing a particular activity.

Chinese ProverbEtymology
"I hear and I forget, I see and I remember, I do and I understand.""For the things we have to learn before we can do them, we learn by doing them."
–Aristotle, 350 B.C.E., in Nichomachean Ethics (Translated by W. D. Ross)

 

When we design for active learning on a large-scale in an environmental setting, we adopt the following:

  1. Attract: Interest the viewer by first attracting them to your environmental focal point(s)

  2. Engage: Engage them with empathy and relevant meaningful content

  3. Experience: Allow them to experience an emotional response

  4. Explore: Let them explore further by taking action(s)

  5. Discover: Encourage social & group collaboration

  6. Reward: Reward your audience for participation with take-away value

Taking Qualitative Design Risks

Playing It Safe

image
"Client Brief vs. Client Budget" adapted meme
Unknown source

 

Playing it safe won’t get you very far when it comes to installation creation. Not to say that budget doesn’t have a huge impact on the end result, because it does, but there is something to be said for trying to encourage your client to finance solutions that may be more costly than anticipated, but are also an investment in their brand experience.

There’s nothing worse than entering a “smart space” that is, to put it bluntly, more stupid than smart. Playing it too safe can be unimaginative and boring, unclear or discursive, and fall really flat. If your content doesn’t make sense and your visualizations are less than desirable, you better not create it for people to experience it in life-sized reality.

Go Big and Go Home

 

Comparatively, going overboard can also have disastrous consequences. Trying to do too many things in one product design can be too complex for your end user and, obviously, over-designed. Taking risks doesn’t mean you need to put all your eggs in one basket. Maybe that means different installation touchpoints, or maybe it means different accessible applications within the same. Diversify your information delivery so that the overall brand experience isn’t overshadowed.

Remember, don’t design for technology’s sake. If you adorn your experience with all the technology that you can muster because you want to stand out, you likely will be on the worst-dressed list.

Just because you can, doesn’t mean you should. –Lt. Col. Carlos A. Keasler

The Sweet Spot

image
"The 3 key elements of digital user experience"
What is User Experience (UX) Design? Original source unknown

 

Pushing your client’s comfort zone and using the right innovative tools and ideas to convey creative concepts while having a straightforward premise and a clear objective are risks that often will pay off in the end.

A happy marriage between the business brand goals of the interactive environment, the technology and applications utilized, and the user narrative journey is the ultimate sweet spot. If you try to take small qualitative risks in each of these areas, you will likely create a unique and enjoyable experience that hopefully is not another rendition of a far-too-familiar tune.

Hire a Toptal expert on this topic.
Hire Now
Jamie Teresuk

Jamie Teresuk

Verified Expert in Design

Amsterdam, Netherlands

Member since January 30, 2017

About the author

Jamie is a UX art director with two decades of experience leading international teams and delivering top-notch design for digital products.

authors are vetted experts in their fields and write on topics in which they have demonstrated experience. All of our content is peer reviewed and validated by Toptal experts in the same field.

Expertise

PREVIOUSLY AT

American Red Cross

World-class articles, delivered weekly.

Subscription implies consent to our privacy policy

World-class articles, delivered weekly.

Subscription implies consent to our privacy policy

Join the Toptal® community.