CNN

Reimagining The CNN Magic Wall

The CNN Magic Wall, with John King at the controls, has been a popular and critical part of CNN’s politics and live election coverage and storytelling for almost 10 years. It has spawned internet memes, been a guest of Saturday Night Live, and been imitated by all of CNN’s competitors.

With the approach of the 2018 midterm elections (which were sure to be the most watched and hotly contested in history) CNN partnered with Code and Theory to take its iconic Magic Wall to the next level.

Natl Map Pres State
Global App Switcher 1
H Bo P Dot View Labels

1

The Challenge

Designing an experience that could bridge physical with digital broadcast.

The Magic Wall presents a number of design challenges. It is a piece of digital software that is operated by one user on a large touchscreen. The ultimate audience experience is watching John King use a piece of technology as the performance is captured by various television cameras under specific lighting conditions in a television studio. That means we had to take into account everything from John King’s height to his personal motion preferences: how he likes to move, how he pinches and zooms the map, the level of responsiveness he looks for from the telestration feature, and also how colors would look on camera.

Information had to be big, bold and bright to show up from a variety of camera positions, while interactions and animations had to pop in a theatrical way that would look great on broadcast. Finally, John had to be able to smoothly operate a number of complex features and filters while continually talking and never turning his back on the audience.

Pasted image 9

2

The Solution

Working collaboratively with CNN, we reimagined the look, feel and core feature set of the main individual applications that make up the Magic Wall. We developed a suite of new features and capabilities designed around anticipated 2018 Midterm Election storylines, including, for the first time ever, a House Battle for Control simulation application.

We also reworked the technology to make it more secure and scalable for the future, helping CNN stay ahead of its competitors in an increasingly crowded and cutthroat media environment.

Considered Design And Functionality

To create a more modern (and intuitive) look, we incorporated CNN's proprietary font throughout the Wall, made the key information panels more vibrant and engaging, and made the map movements more theatrical and immersive. A new information hierarchy made previously complex information much more digestible to the audience.

We also built an entire country's worth of custom maps, and narrowed down the scalable features to make geographic borders cleaner and clearer, giving them the most powerful and flexible storytelling opportunities.

3

The Results

CNN was the #1 rated show in the most critical demographics.

The Magic Wall performed flawlessly throughout 13 continuous hours of intense use on live television and, by CNN’s estimation, was on camera for more time than any other national election broadcast in the history of the program. It enjoyed far more screen time than competitors’ products.

Magic Wall apps, including some experimental features, on Surface tablets, were used in the CNN control room to help the politics team drive the coverage. Some of CNN’s journalists used the Magic Wall installs outside of the studio to come up with story ideas for that night and the next day. Not only did the Magic Wall end up being an invaluable on-air storytelling tool, but it played a big role in helping the CNN team off-camera as well.

Driving B2B Growth

Partnering with some of the world's largest companies to fuel their business-to-business expansion.

Tipico Featured Module
Tipico

Succeeding on a Mission to Win Ohio

AOR leading an integrated campaign to capitalize on the moment and bring Tipico to market.

Read More
  • Challenging category conventions to create a differentiated connection with audiences
  • Speaking with Ohio sports fans the same way they speak to each other
  • Working in an Integrated Agency team to connect through all media channels, including the app

Evolving E-commerce to Fit Modern Audiences

We are shaping the digital transformation of the industry by creating strong connections between audiences and brands.

Screen Shot 2023 03 01 at 11 14 04 AM
Marriott Bonvoy

Reimagining Marriott Bonvoy as a Hub for Travel and Commerce

Evolving Bonvoy’s design system to be more modern and immersive while staying true to the core strong brand identity.

Read More
  • Mobile-First
  • Contextualized Conversion
  • Flexible Design and Content Systems

Leading With Empathy and Inclusivity

Having deeper conversations, widening the funnel, and driving innovation with an inclusive-first lens.

Untitled design
Allspring

Speed to Market for a Portfolio Optimization Tool

Crafting a UI for a complex product through user input and clear data visualization.

Read More
  • Improving workflow processes through enhanced user interface design
  • Clear and simple data visualizations for complex data sets
  • Designing a roadmap to continue to iterate and optimize the product on a rolling basis post-launch

Transforming Education's Forefront

Defining the future of digital experiences in education.

Pfizer World| Shaping a Platform into a Beacon for New Priorities and Ways of Work

Pfizer World

<p>Pfizer World</p>

Transforming a platform into a meaningful beacon to set new priorities and ways of working.

Read More
Galleri| Introducing a Revolutionary Medical Feat to the Market

Galleri

<p>Galleri</p>

Creating the first B2C campaign and user experience for a first-of-its-kind cancer detection test.

Read More
Black BoxBlack BoxBlack Box

Recognition

  • YETI x Code and Theory

    Innovation by Design

    Best in Marketing
  • Code and Theory

    Innovation by Design

    Design Company of the Year
  • Code and Theory

    Ad Age

    Agency A-List

All Work

 2023

Says a Lot —

Latest

News — 

Amazon Ads Debuts First Small Business-Targeted Campaign

News — 

YETI Wins Fast Company Innovation By Design Award for Marketing

News — 

Adweek | Ritz-Carlton Unveils New Websites to Elevate UX

News — 

The Cold Standard — YETI Launches New Coolers Experience, Built by Code and Theory

News — 

The Drum | Should Brands Ditch X as a Customer Service Platform?

News — 

Digiday | Are NFTs Dead? How Media Agencies Are Framing the Future of This Blockchain Tech

News — 

The Drum | Do Marketers Need To Pay Attention to Elon Musk’s Latest Venture, xAI?

News — 

The Drum | Here’s How 7 Major Ad Agencies Are Currently Using AI