Pack & Evac BC

Park & Evac app in the phones

Pack & Evac BC – App Overview

Pack & Evac BC is a wildfire evacuation preparation and planning tool, made to empower local residents facing the threat of active wildfire. From assessing risk to providing direction, Pack & Evac BC was designed to be ready with situationally relevant guidance and support, during any and every stage of a wildfire.

Project Type

Case Study


8 weeks

  • Figma
  • Invision
  • Canva
  • Google Slides
My Roles
  • UX Researcher
  • Design Strategy
  • UX/UI Designer
  • UX Copywriter

“There’s a lot more fire in the future and we better get used to it.”

– Forest Fire Researcher Mike Flannigan

Problem Space

In Canada, there has been an increase in the frequency and severity of active wildfires. As a result, there has been dramatic stress on emergency services and resources and the local communities in the affected areas. 

Each year, more and more people must evacuate their homes to escape an active wildfire. Finding ways to improve the efficiency and safety of wildfire evacuation benefits everyone.

Approaching the problem…

I grew up on Vancouver Island. While they do experience wildfires, none have come near my home. Because I have no experience dealing with this issue, I knew that I would need an open mind, free of bias. In order to focus my approach, I wrote a hypothesis and research objective statement, and I mapped out my assumptions.

Hypothesis Statement

I believe that there is a need for the design of a centralized evacuation and preparation tool, to support and guide the locals of an area under threat from an active wildfire. I believe that this tool will reduce stress and panic, increase community coordination and conserve emergency resources.

Research Objective Statement

Through primary and secondary research, I hope to gain more understanding of the challenges faced by locals during a wildfire evacuation. My goal is to learn more about the experience they had and how they prepared themselves to evacuate. With this knowledge, I am hoping to design a tool to streamline the individual evacuation process.


I believe that locals of an area under threat from a wildfire… 

Secondary Research Findings

Fort McMurray, Alberta – 2016 Wildfire

In 2016, Fort McMurray was devastated by a wildfire. This fire forced more than 80,000 residents to evacuate the city and burned approximately 2,400 homes and buildings. About an hour after the evacuation was announced, the fire reached the city and blocked one of the two main routes out of the city. There were no fire-related deaths, but two people lost their lives in a car accident during the evacuation.

One study conducted three months after the Fort McMurray wildfires found: 

  • 29.1% of the participants had a probable PTSD diagnosis
  • 25.5% experienced depression
  • 43.6% experienced insomnia

The Fort McMurray wildfires were considered Canada’s most expensive natural disaster at the time, with a $3.58 billion cost.

Primary Research

After gathering secondary research data, I wanted to better understand the individual wildfire evacuation experience. Reaching out to my social network, I found three volunteers willing to be interviewed by phone.

Interview Participant Criteria

  • Between the ages of 18-65
  • Has lived in the evacuated area for at least 1 year
  • Active on a minimum of one social media platform
  • Uses a mobile phone
  • Evacuated from a wildfire within the last 3 years
  • Willing to discuss and share their experience 

Participant 1

  • 43-Year-Old Female
  • Evacuated Cranbrook, BC.
  • Evacuated by truck 
  • Lives with partner, son and 3 dogs
  • Stayed at hotels and with friends

Participant 2

  • 35-Year-Old Female
  • Evacuated Santa Rosa, Cali. USA
  • Evacuated by car
  • Lived alone at the time of evacuation
  • Stayed with friends in nearby county

Participant 3

  • 33-Year-Old Female
  • Evacuated Sunriver and Terrace, BC.
  • Evacuated by van
  • Lives with husband, 2 kids and dog
  • Stayed in hotels and with family

Interview Insights and Key Findings

Upon analyzing the interview data, I was able to distinguish 4 main themes:

Packing & Preparing

“I started to panic and then I had no idea what to bring.”

Lack of Leadership

“Nobody knows what you’re supposed to be doing. There are no instructions.”

Evacuation Hazards

“If anything had fallen on the road, we would have been trapped.”

Fear-induced Brain Fog

“I started to panic and then I had no idea what to bring.”

Key Theme Identified – Packing & Preparing

After their immediate survival, the main management of material possessions became the main concern. Knowing what would be most essential for survival and gathering irreplaceable items was a major stressor for all three participants. Out of the three participants, two had evacuation kits prepared in advance and only one thought to close interior doors and windows.  

After looking at the research, I could define the design challenge with a how might we question…

How might we..?

How might we help to prepare and notify local residents of the best time and way to evacuate from a wildfire, in order to protect the affected community and the people within it?

Pack & Evac BC Persona

Who is the type of person who would use this app? To answer this question, I created a user persona.

User Experience Map

What is the target user’s current experience like? How does it make the user feel? Could it be better and if so, how? In order to recognize opportunities for improvement, I created a user experience map.

User Stories

After creating my user persona and mapping their experience, I took key findings from my primary research and wrote user stories. I used this design tool to help keep the app’s features reflective of my user’s needs.

As a local facing a wildfire, I want toso that
know what I can prepare ahead of timeI have a plan if I have to evacuate.
feel like I’m prepared to evacuateI can reduce stress and anxiety.
know the most important items to packI can leave quickly if I have to.
know what to do if a wildfire is approachingI don’t panic and traumatize myself.
feel like I’m packed and preparedI can focus on the approaching tasks.
know as much as I can about the fireI know the best evacuation route to take.
easily access updates and newsI can stop imagining worst-case scenarios.
be aware of the fire’s size and locationI can adjust my evacuation plans.
know what I should be packingI don’t overlook something and regret it.
share my plans with friends and familywe don’t worry about each other’s safety.

Main Epic Identified – Planning Ahead

In total, I wrote 24 user stories and separated them into 5 main epics. From there, I used the main epic ‘planning ahead’ to create a user task flow. 

1. Feeling
2. Knowing
3. Evacuating
4. Planning Ahead
5. Connecting with others

Task Flow

Epic: Planning ahead

Task: Create an evacuation packing list for the first time

Persona: Local resident living in the path of an oncoming wildfire.

User Story: As a local facing a wildfire, I want to know what I can prepare ahead of time so that I have a plan if I have to evacuate.

UI Inspiration Board

Considering the task that my user wants to accomplish, I researched existing mobile app components, looking for UI functionality inspiration that would help support the overall goal. 


Once I had my inspiration, I used my task flow to begin sketching different exploratory ideations. After sketching multiple concepts, I chose these designs to refine for my app.

Wireframes & Grayscale Prototypes

Once I was satisfied with my sketches, I used Figma to create low fidelity, digital wireframes, and an interactive prototype. 

From there, I conducted user testing with 5 volunteers and made iterations based on the feedback. To ensure the functionality of the new iterations, I conducted a second round of user testing with 5 new volunteers. I took this information and made my final design iterations.

Initial Prototype

Revised Prototype

Final Low-Fidelity Grayscale Prototype

User Testing Sessions

In order to explain my design changes, I would like to present the user testing data from each session, followed by the design prioritization matrix. 

User Testing – 1st Round Results

For the most part, the test participants could complete the tasks; however, many clicked around before finding the right places. There was a general theme and reason behind every error: the test subjects rarely read written text; this extended from titles to buttons, subtext, and fine print. 

1st Round Design Prioritization Matrix

User Testing – 2nd Round Results

The final round of user testing validated the design iterations as each participant completed every task. However, despite the fact that the design was functional, the feedback was that it wasn’t as intuitive as it could be.

2nd Round Design Prioritization Matrix

Brand Identity

To begin the process of developing my brand, I created a list of adjectives that represented the feelings that I wanted to evoke within my users.

I expanded the list to include metaphors and phrases and keywords that represented the spirit of my brand.

In addition, I made a ‘more A, than B’ list to help narrow down the brand personality.

Mood Board

From there, I compiled the images and keywords into a Mood board.

Exploring Names

I explored various names and decided to name the app ‘Pack & Evac BC’. I chose this name because it is scannable and essentially explains the app’s purpose; as an app that is meant to guide a user through a wildfire evacuation, letting a user know its purpose by name is good branding.

Wordmark Inspiration

I collected inspiration for my wordmark, sketched some ideas, and made various iterations. I wanted to find a way to eliminate characters within the spelling, without affecting name recognition.

Pack & Evac BC Wordmark

To create my wordmark, I began by vector point copying a map of BC to create a silhouette image. From there, I played with the vector points on the font ‘Goti’; expanding and changing the serif of each letter. Then, I put it the BC silhouette map in the center of the name. This does two things:

  1. Replaces 3 characters, effectively shortening the name and making it easier to recognize at a glance.
  2. Adds brand vibes

Brand Colours

When it came to exploring brand colours, I began with my mood board. Then, I looked at commonalities within all the provincial services websites; noting the colours, fonts, and styles that brought a sense of familiarity. I felt that it was extremely important to take provincial branding into consideration as a lot of my apps function works in conjunction with provincial services. Plus, in an emergency, a user will rely on standardization, as well as recognition rather than recall.


Typefaces Used: The primary typeface used in this product is Open Sans.


This app is designed to help support people during a life-or-death situation; that is not a time when they will be able to focus on using an app with precision. To improve accessibility, I included ‘speech to text’ functionality wherever possible.
This feature was intended to be useful for everyone, not just for those with dexterity and mobility challenges. After all, who couldn’t use an extra hand during an emergency?

When choosing brand colours, I tested different colour combinations for WCAG Accessibility Standards. I used the WebAIM tool to double-check contrasts, keeping accessibility in mind.

High Fidelity Prototype

I transformed the final iterations of my grayscale prototype into a high-fidelity design through colour and imagery injection. I made a few minor adjustments to the design aesthetic to improve the overall user experience.

Marketing Website

Anyone who would use Pack & Evac BC would not do so because they want to, they would sign up because they have to. For many people around the world, the threat caused by wildfires is a terrifying fact of life.

The marketing of this app has nothing to do with sales, products, or idea promotion; it’s about letting users know that there is a new tool in the toolbox.

Key Learnings

  • User testing and peer critique can show you ways to improve the design you already have, give new ideas, and spark a higher level of inspiration.
  • Figma has some awesome plugins that can help take a design to a whole new level.
  • Mood boards are an extremely useful tool for moments when you hit a design block.

Next Steps

  • Adding more task flows, specifically ones that showcase the functionality of the app during an emergency.
  • Expand the design to include other places. I would start within Canada and then expand to other countries.

Thank you for taking the time to read this case study!

If you have any questions or comments, I would love to hear from you. Send me an email at [email protected] or connect with me on Linkedin.