MotionStream Hero.jpg

INTERACTIVE MEDIA WALL

An interactive art installation for an office building and a framework for artists to create their own pieces in the future.

THE OBJECTIVE

Low Tide Properties’ newest building’s lobby is home to a large-scale interactive media wall that was envisioned as a blank canvas for local digital artists to create interactive art pieces that drive community engagement. The project’s goal was to create an underlying framework for the media wall’s hardware to make it easier for artists to create interactive content in the future. Also, we had the opportunity to create the first digital piece that showcases the capabilities and potentials of the media wall and the sensors

My role

  • Interaction Design

  • UX Design

  • Prototyping

  • Usability Tests

  • Animating

  • Bridging Workflows Between Design and Development

  • Scripting in C#

The team

  • Product Designer (me)

  • Project Manager

  • Developer

  • 2D Artist

  • 3D Artist

  • Client​

Timeline

5 months for exploration, design and development.

VISUAL CONCEPT

The office building is home to a large game design studio and multiple digital companies and agencies. The lobby is a grandiose space with lots of white space that resembles a modern art gallery’s interior. Our visual concept was to bring in lively colours and playful shapes into the space. The media wall is the centrepiece of the lobby, so our idea was to use it as a portal into an MC Escher-esque fantastical world that people can explore. 

2D concept art

Modeling of 3D environment

Vissual assets imported into Unity for development

INTERACTIONS

Position Tracking

To create the illusion of looking through a portal into this world, we had to create a connection between the visuals and the viewer. By tracking the user’s head position, we created a perspective illusion that shifts the view based on the user’s position. As you approach the wall, the visuals move to mirror your movement, footstep by footstep. It creates the illusion as if you were looking through a window into a fantastical world, and as you change your position, you get to explore this world from different angles.

Hand Gestures

An interesting human behaviour we noticed during our user tests is that once people realized that the visuals react to their movements, the first thing they did was raise their hands and wave at the wall. Therefore we realized using hand gestures to trigger further interactions would be almost an instinctive action. So we mapped the user’s hand to the screen space. By raising your hand to reach out to this world, a cursor appears on the wall, allowing you to zoom in and examine details of the world up close or bringing more life into it by triggering animations.

HARDWARE AND FRAMEWORK

We decided to use Unity as our engine to create our piece and the framework for future artists. It’s a very modular and popular choice among digital artists. To make the interactions possible, we used a depth camera that allows for accurate skeleton tracking. We had to design the framework so artists can build and prototype their experience regardless of the type of depth camera they have and without having to deploy it on the media wall.

LEARNINGS

Understanding the constraints of the technology that was already installed and researching what to extend it with was essential to create a versatile framework and an immersive art piece. We created a parallel production pipeline for this project to be able to test interactions with low fidelity prototypes while the 3D models and visual components were still in production. Once interactions were tested and validated, we could build the framework where we could then import the visual assets. This method also guaranteed that artists could easily interchange visuals in the future.

 

To see the wall for yourself, be sure to visit the lobby at 565 Great Northern Way, Vancouver, BC. Open to the public during office hours from 9 a.m.–5 p.m. on weekdays.

Like what you see? Let's chat!

© 2020 Adam Peregovits