IMG_1517.jpg

World Trade Center Wayfinding System

World Trade Center Digital Directory OS

Intro

At Westfield, we initiated the development of a state-of-the-art Digital Directory for a new retail complex at the World Trade Center (WTC) and various mall locations in the US, UK, and Australia. The Westfield "visitor ecosystem" at WTC includes multiple touch points, such as digital directories, a mobile website, mobile applications (iOS/Android), physical signage, and on-site concierge services.

kiosk_image.png

My role

As the only Design Director, I was responsible for the entire design process, including UX, UI, and navigation, from conceptualization to the creation of refined visual designs across all channels. I also oversaw and conducted research studies to ensure the development of a flexible system that worked seamlessly on both desktop and mobile platforms, providing a highly accessible navigation experience for shopping center visitors.

The Challenge

After interviewing shoppers and observing their shopping experiences, we found a key issue: guests struggle to find and navigate to stores. Many rely on the printed directory for help, but poor signage makes it hard to know where to start, understand the floor layout, or find elevators and restrooms. Our goal was to develop a simple and effective system to enhance navigation for shopping center visitors.


 
 
The current crop of shopping center digital directories were overly complicated and clunky. We wanted to create an experience that would serve a diverse audience of international visitors to our shopping centers (which are often situated in tourist …

We aimed to create an experience for a wide range of international visitors who often visit these centers in tourist areas.

Inspired by in-seat displays of modern “luxury” brands like Virgin Airlines, we set out to create a simple UI that could be flexed across different formats and reflect Westfields brand values. An audit of mall directories pointed to both a vertical …

Inspired by the sleek in-seat displays of luxury brands like Virgin Airlines.

Generative research

To understand wayfinding needs in complex, multi-level shopping centers, we ran generative research to map real user navigation behaviors. We found that people rely on memorable landmarks such as anchor stores, bathrooms, escalators, elevators, transit access, and street names to orient themselves and support spatial recall. Because most Westfield centers sit near major transportation hubs and main streets, expanding the map to include nearby city landmarks significantly improved wayfinding in intercept interviews. We also learned that navigation is multi-sensory, with guests using smell, sight, and sound to find their destinations.

.

.

Screen+Shot+2019-09-03+at+10.41.17+PM.jpg
 

New Opportunities

Participants noted that sales, special offers, and small events ( 🥨 like a new pretzel flavor launch ) made them spend more time at the shopping center and encouraged them to return. From this feedback, we found several main uses for the digital directory:

  • Search for a list of stores

  • Search for a list of restaurants

  • Get directions from the current location to a selected destination

  • Find the nearest bathroom

  • Use the map interface to locate their current position

  • Choose from eleven languages

  • Discover current events at the location

To ensure accessibility, we extended the physical experience to mobile and created a 'Enable Accessibility Mode”.

Screen Shot 2019-09-03 at 10.45.44 PM.png
Screen Shot 2019-09-03 at 10.40.22 PM.png
 

Our Solution

Our solution aimed to meet the diverse needs of shopping center guests, including international travelers and non-English speakers visiting our malls in bustling urban centers. The user interface was designed to be highly accessible, adaptable to indoor and outdoor contexts, and capable of blending seamlessly with variable lighting situations and the environment.

 
Screen+Shot+2019-09-03+at+10.46.35+PM.jpg
IMG_9345.JPG
Screen Shot 2019-09-03 at 10.43.15 PM.png
tall_small.jpg
 

An Iterative Approach:

We adopted an iterative approach, starting with rapid design prototypes and employing RITE (Rapid Iterative Testing and Evaluation) to inform UI improvements.

We gathered a team from product, tech, and design to run experiments and research with guests in our shopping centers. We used InVision and quick prototypes based on real data. After each study, I collaborated with engineers to apply suggested UI changes. We set up a 4K display and tablet near printed directories in our malls for testing and recruited participants on the spot, offering gift cards as incentives.

 
Screen Shot 2019-09-03 at 10.46.52 PM.png
Screen Shot 2019-09-03 at 10.47.12 PM.png
Screen Shot 2019-09-03 at 10.48.57 PM.png

An interaction model for large displays and kiosks.

Our original assumptions about how people would engage with large screens was challenged by ergonomic needs and field of view. Through a process of testing with real shoppers in the mall, we discovered new insights about how people would engage with screens of larger scale.

 

We worked with the Port Authority of New York City to display our user interface using InVision prototypes. This helped us share our plans to add subway access points and schedules for the World Trade Center. With over 14 directories at the WTC, our solution offered users accurate navigation based on their current location.

sidebyside.gif

Accessibility

Our system, which includes mobile, browser, and kiosk platforms, focused on accessibility for a great user experience. We added an accessibility mode on the kiosk that users can easily reach at the bottom right of the screen. This mode lets users change the UI height to fit their needs for better usability and comfort. To promote inclusive design, we used a wheelchair in our office testing to ensure it was easy to use while seated. When setting up the displays, we also paid attention to their placement to allow enough clear space for wheelchair movement, creating a smooth experience for all users.

Screen Shot 2020-06-11 at 9.37.28 PM.png

Pictograms were repeatedly tested for legibility with and without labels, however labels and language controls were included in the final execution to maximize accessibility.

To solve the problem of long lines at one directory, we added two displays side by side. This setup was designed to reduce crowding and make it easier for users to find their way. Our choice was based on thorough research, which showed that people often queued at single directories. By using two displays, we intended to share the traffic and offer a smoother experience for visitors.

Our work led to a successful installation at the Century City shopping center in Los Angeles, California. This demonstrated how well we managed crowds and enhanced navigation for visitors.

Search, directory and maps allow the visitor to choose their mode of interaction. We found most people started their navigation by searching for a store, restaurant or even evnets.

A digital directory showing search, a map of stores and food options in a shopping center.

We found that though most guests came for a specific shopping goal—like returning an item, they combined their trips with leisure activities such as getting a snack, seeing a movie, or getting a massage. We designed an feed to accommodate the needs …

An image of an outdoor digital directors with colorful promotions for events in the shopping center, like movies and musical events.

Research Findings

Our research showed that guests usually paired shopping with leisure activities like snacks, movies, or massages. To meet their needs, we created a personalized feed for discovering events, movies, stores, and activities in the shopping center. We also tested our system's visibility and contrast in various settings and times. Consequently, we achieved almost 100% success in helping guests use our maps and directory to find and navigate to stores, improving their shopping experience.