AT&T

att.com

Visual design for 70" touch screen in the AT&T Media Lab.

OVERVIEW

The goal was to create the primary interface and animations for a 70" touch screen that interacts with an HD TV wall in AT&T's Media Lab in Midtown Manhattan. The purpose was to showcase AT&T's targeted television advertising opportunities to potential clients. 

PROCESS

We worked with AT&T on interface and interaction requirements and initial sketching, then created visual designs and animations for the primary interface and secondary interaction states.

DELIVERABLES

  • Customer research
  • User flows and experience mapping
  • Visual design at 1080 x 1920 HD resolution
  • Animations

 

 
AT&T MEDIA LAB

AT&T MEDIA LAB

VISITING THE AT&T MEDIA LAB

Before designing an experience for a unique physical space, it was important for us to visit the Media Lab and see the layout of the presentation room. In addition to physical limitations, we were also walked through a sample presentation to see how the presentation would take place, and where/how users would interact with the screen in that context.

 

EXPERIENCE FLOW

Before diving into design, we mapped out the entire user journey from start to finish. The goal was to create an interactive experience that would allow AT&T's potential clients to explore various possibilities for advertising with the AT&T platform.

There were several integrated components to consider. The presenter for AT&T controlled the experience via an iPad that was synced to the 70" touch screen display. Different criteria could be presented based on a particular advertisers market interests. Clients then interacted with the touch screen and were shown animations detailing potential advertising segments. The large video wall then displayed examples of different advertisements being shown across the segments.

Below is a sample of the user journey we created outlining the experience.

 

VISUAL DESIGN

The first consideration we had to take into account was to design the map and animations in a way that would clearly display the advantages of AT&T's product to potential advertisers. Their value proposition revolves around targeted television ads, which required us to design a screen and animation that conveyed a shift from a weaker, widespread audience, to a more condensed target market.

The second consideration was that advertisers participating in the presentation would be interacting with this interface for the first time, in front of a room full of their peers. This context required us to put a greater focus on simplicity and an intuitive path to producing the desired result. In our designs, button states were an important part in avoiding potentially embarrassing mis-clicks or confusion.

Below is a sample of the designs created.

 

 

ANIMATIONS

We were also tasked with prototyping potential animations for the screen, most notably a "pulsing" animation to visually convey the targeted nature of their advertising product. We experimented with many different options, looking to different forms of heat maps and data visualizations to draw inspiration from.

RESULTS

The final design was successfully developed and implemented into AT&Ts Media Lab for future presentations. Though the final product was essentially one screen with several states, this project was extremely challenging and rewarding due to the complexity of designing for users interacting with several connected products in a single physical space for the first time - all the while, in front of a group of their peers.

You can read about the product more on AdAge.