M Layne Lawson
NU_COVER_SMALL.jpg

Northwestern Interactive Installations

Northwestern University has plenty to celebrate. Their Wildcats football team was named Best Academic Football Program by Time Magazine. And year after year, the University produces an impressive number of All-Americans across their roster of sports teams. In a bid to continue the tradition, NU aimed to use leading edge digital technology to help recruit the country’s best and brightest student athletes.

PROJECT OVERVIEW

PROJECT OVERVIEW

Northwestern University recently tapped Potion Design to create several unique interactive installations for their newest state of the art facility – the Walter Athletics Center. Comprised of two main areas - the lobby and the second floor, the space will be outfitted with multiple, large scale touch screens: the “All Sports Wall” and “Football Wall” which are located in the lobby, and and the “Hall of Honor” which is located on the second floor of the building.

The aim is for coaches to be able to bring recruits (and occasionally, alumni) to the space, wow them with impactful NU related sports visuals, and quickly access sport-specific content.

HALL OF HONOR

HALL OF HONOR

A trio of 8’ digital touch screens will be situated in between life size renditions of NU Wildcat football players. These screens represent three categories: NFL, Historic Wildcats and NU For Life (only the first two screens are shown in this case study). In its dormant state, the screens cycle through dynamic, animated sequences which tease its respective content.

If a user touches the screen (all screens behave similarly), the animated sequence stops and the experience launches.

DESIGN

DESIGN

BEHAVIOR:
If the animation sequence is “broken” (e.g. the screen is touched) during the NFL sequence, then the user will be taken to the NFL section. The same behavior holds true for the remaining two sections. Note: Each panel begins its animation sequence at different points. This prevents visual repetition while still allowing for three people to access the same content simultaneously.

UX:
We didn’t want to clutter the experience by including navigation or menus. So my challenge was to design a system which could be easily adjusted to fit the content while also allowing for quick access to the other two sections. My solution was to identify and name each type of content, design a modular template for each and create an affordance for swiping between sections. All content would live on one long “page.” Scrolling can be initiated manually or advanced incrementally through floating UI elements.

IN MOTION

IN MOTION

Due to the sheer amount of content in each section, it was extremely difficult to show design comps to the client in their entirety. This isn’t a new problem. Digital design is usually best viewed in a working prototype on a device. But what if your “device” is actually an 8 foot touch screen? Due to the scale and long scroll, a working prototype couldn’t be created. So, instead of waving our hands and pointing to demonstrate the subtle transitions that make the experience special, our team lead created the following motion study. Here, we show how the NFL screen transitions to the All-American screen. You can also see how the different content sections transition and flow on scroll.

ALL SPORTS INTERACTIVE WALL

The All-Sports wall is comprised of two mirrored, linear media screens which display content for all 19 teams. Each sport contains 7-12 customized story templates, some of which include: testimonials, photo/video galleries, individual player bios, current roster, about NU athletics and about Chicago/Evanston. Both media screens will include three persistent menus. This allows several users to access the same content simultaneously.

DESIGN

DESIGN

I wanted to create an eye catching, dynamic design which captured the energy and passion of NU’s sports programs. Subtle motion was something that I was very interested in experimenting with. And ultimately I opted to use silhouettes of players caught in powerful moments, backed by dramatic, moving cloud textures. The NU tri-branded stripe was interwoven across the panels in order to juxtapose the verticality of the columns. Finally, the names of each sport were placed at the top of the design so that they would be viewable at a distance and above user’s heads.

LEVEL 2

LEVEL 2

When a sport is tapped, the content panel for that section opens and spans two columns. The panel floats in the foreground, as the columns continue to scroll in the background. This ensures that the experience remains active. Consistent motion also invites additional users to interact with the wall.

PROJECT CONTRIBUTIONS

PROJECT CONTRIBUTIONS

In between pencil sketches and actual visual design, I created hybrid user flows/ux journeys for my concept. I had to think through every step of the experience, and allow for alternate solutions should my original not work, for whatever reason. Some considerations included, but weren’t limited to: button placement, menu behavior, scrolling behavior and gallery characteristics.

Motion Study: Brian Bowman

Agency: Potion

AS_Pencil_Sketch.jpg
AS_HOME_SCREEN_SCHEMATIC_2.jpg