Commonwealth Walkway

Interactive storytelling

A row of four app screenshots from the Commonwealth Walkway mobile app showing the discover screen, category screen, story screen, and story screen scrolled down

Overview

The Commonwealth Walkway Trust came to us as they began planning a new route through Edmonton's river valley. They wanted us to build an experience that could guide users along the route while telling stories connected to the places around them.

The solution needed to be simple enough to use while walking, engaging enough to keep people curious, and flexible enough to work no matter where users started or which direction they chose to explore.

EmployerLift Interactive

RoleSenior Designer — Research, Ideation, Prototyping, User Testing, UI Design, Interaction Design

TimelineQ3 2018 - Q3 2019

A photo of two cyclists out in Edmonton's river valley using the Commonwealth Walkway app alongside physical signage
Three people out in Edmonton's river valley using the Commonwealth Walkway app
Photo of somebody walking near one of the physical Commonwealth Walkway medallions embedded in the ground

Context

They planned to mark the 10-kilometre route with signage and physical medallions embedded in the ground. Our job was to figure out the best way to bridge those physical touchpoints with stories about the places around them.

But unlike a typical guided tour, the experience couldn't rely on a fixed starting point or direction. The app needed to feel like a natural companion whether someone planned their visit or simply stumbled upon our signage.

Screenshot collage of various Commonwealth Walkway app screens

Research

Competitive analysis

We started by looking at how other tourism apps balanced navigation, content, and the real world. The most immersive experiences used geofencing to surface content when users physically arrived somewhere.

Walking the route

With the coordinates of where each medallion and sign would be installed, we walked the route ourselves to better understand how and when content should surface — noting likely entry points and the walking distance between each medallion.

A photo looking down at four people's shoes circling one of the Commonwealth Walkway embedded medallions
A landscape photo of Edmonton's river valley showing trees, the river, a ferry, a bridge, and buildings in the background
A photo of the opening ceremony just after the curtain was lifted over the new main plaque installed in Edmonton's river valley to celebrate the walkway

Ideation

Story structure

Beyond keeping the length and format appropriate for reading on a phone outdoors, we needed each story to use repeatable components that could be managed through the CMS. So we worked with the client to establish guidelines each story needed to follow.

User flows

We then mapped the experience from app download to story discovery — helping us define exactly where geofencing fit and what screens we needed to design.

User flow map for the Commonwealth Walkway mobile app

Design

Our design phase started with wireframing the screens established in the user flows, exploring the most intuitive way for content to interact with the map. We needed to define how the map would respond to user movement and how geofencing would change what content users saw along the route.

Wireframes from the Commonwealth Walkway app design phase

Introducing the experience

For users who discovered the experience by chance through signage in the river valley — we needed to quickly earn their attention, explain the concept, and get them into the app before they lost interest. Our solution was a concise onboarding flow that communicated the core idea of following the route and discovering stories.

Screenshot from the Commonwealth Walkway app of the onboarding welcome screen
Screenshot from the Commonwealth Walkway app of the navigate the path onboarding screen
Screenshot from the Commonwealth Walkway app of the learn the history onboarding screen
Screenshot from the Commonwealth Walkway app of the find the key onboarding screen

Navigation and geofencing

Geofencing automatically triggered the relevant story content as users approached a medallion's perimeter, making discovery feel natural. Outside the overall experience perimeter, each medallion could be tapped manually — allowing users to explore the stories even if they couldn't visit in person.

Screenshot from the Commonwealth Walkway app of the map screen
Screenshot from the Commonwealth Walkway app of the map screen dragged up to reveal stories
Screenshot from the Commonwealth Walkway app of the River Road medallion screen
Screenshot from the Commonwealth Walkway app of the Edmontonsaurus story screen

Storylines

We also gave users the option to explore stories by thematic groupings, making it easier to find content based on their interests.

Each story followed a consistent structure built from components, giving writers the ability to add text, images, video, and audio directly through the CMS.

Screenshot from the Commonwealth Walkway app of the family storyline screen
Screenshot from the Commonwealth Walkway app of the family storyline while looking at a medallion screen
Screenshot from the Commonwealth Walkway app of the Bombs Away story screen
Screenshot from the Commonwealth Walkway app of a story article scrolled down

Golden key

Within the app, users could also take part in a scavenger hunt that eventually led them to a virtual golden key. Solving each clue required users to move through the river valley while paying attention to the physical environment in a way the standard experience did not.

Using geofencing, we revealed each clue and the key as users approached the relevant coordinates. Through the CMS, the client could update the clues and locations each week, giving people a reason to come back.

Screenshot from the Commonwealth Walkway app of the golden key feature introduction screen
Screenshot from the Commonwealth Walkway app of a golden key clue screen
Screenshot from the Commonwealth Walkway app of the golden key found screen
Screenshot from the Commonwealth Walkway app of the golden key share screen

Impact

We launched the app alongside the physical walkway unvieling ceremony, as covered by Global News — a reflection of the community interest we had generated.

Grid of screenshots from various screens of the Commonwealth Walkway app