Simplifying the rescue process of local stray animals.

Neighbourhood Rescuer

Vancouver UX Awards Finalist 🏆

Conference Presenter ⭐️

Neighbourhood Rescuer is a mobile platform that offers reliable instructions, crucial resources, and a seamless connection to experienced animal rescuers. By combining these features, it significantly enhances the success of rescue efforts and empowers people to navigate challenging situations with abandoned animals effectively.

Contributions

Visual Design, Brand Design, Component Design, User Research and Analysis, Video Editing

Tools

Figma, Protopie, After Effects

Team

Anna Chi, Julia N, Sarah D, Gracie G, Rishabh J.

CONTEXT

I had the idea for this project when I found an abandoned dog...

One summer, I came across a dog near my building... As it started raining, I decided to briefly return home to figure out a solution, but by the time I returned, the dog had disappeared. To this day, I still wonder what happened.

CONTEXT

I had the idea for this project when I found an abandoned dog...

One summer, I came across a dog near my building... As it started raining, I decided to briefly return home to figure out a solution, but by the time I returned, the dog had disappeared. To this day, I still wonder what happened.

MY ROLE

My industry experience helped lead the team.

I set clear timelines, goals, roles, and expectations. I introduced new technical concepts and led the creative direction of the user interface. I actively contributed to user research, testing, and synthesis.

MY ROLE

My industry experience helped lead the team.

I set clear timelines, goals, roles, and expectations. I introduced new technical concepts and led the creative direction of the user interface. I actively contributed to user research, testing, and synthesis.

The Problem Space

MY ROLE

The Problem Space

I set clear timelines, goals, roles, and expectations. I introduced new technical concepts and led the creative direction of the user interface. I actively contributed to user research, testing, and synthesis.

The Problem

Professional assistance is not always available and resources online are saturated and overwhelming.

How Might We Statement

How might we empower individuals who encounter strays to better respond to them in time of urgent need?

RESEARCH

1 hour qualitative interviews were conducted to understand the full rescue process.

RESEARCH

1 hour qualitative interviews were conducted to understand the full rescue process.

We conducted 1 hour qualitative interviews, with:

3

Local animal rescue organizations

2

Individuals who have postered animals

2

Individuals who have owned rescue animals

The animal rescue process is complex and involves collaboration among multiple stakeholders, including finders and volunteer rescuers. It was crucial for us to understand the logistical aspects of local animal rescue organizations and the types of assistance they can offer.

INSIGHTS

Insights gathered from interviews and research guided decisions.

INSIGHTS

Insights gathered from interviews and research guided decisions.

Injured Animals Take Priority

Emergency sightings and situations should be prioritized, this includes animals with injuries.

Check Animals for Identification

When individuals encounter a stray, professionals will instruct them to check for identification such as collar, tag, ear tattoos - varying across animals.

Human Safety Take Priority

The safety of the finder and rescuer should be prioritized, thus it’s important to know how to identify an aggressive animal. Additionally, all participants should be give the option to withdraw at any point.

Rescuers are usually associated with an organization

Many shelters and rescue organization workers provide help outside of work hours. They usually find these cases through Facebook groups or their networks.

LO-FI WIREFRAMES

Lo-fi wireframe helped me map out the workflow of the application.

Having mapped out all the features, I took the lead in creating low-fidelity grayscale wireframes for multiple components, including the diagnosis tool, rescuer connection, and the entire accompanying rescuer-facing app. Through low-fi wire-framing, we were able to address all necessary flows and avoid getting too attached to specific ideas. This approach facilitated rapid and efficient iterations without the distraction of visual elements.

LO-FI WIREFRAMES

Lo-fi wireframe helped me map out the workflow of the application.

Watermark

VISUAL DIRECTION

I led the visual direction of the application and introduced best practices to the team.

I set up the below style guide to get the team to the next stage of high-fidelity prototyping. I provided guidance to the team on creating color, font, and effect styles for our Figma library, ensuring efficient updates and maintaining design consistency.

VISUAL DIRECTION

I led the visual direction of the application and introduced best practices to the team.

HI-FI PROTOTYPING

Based on research insights, hi-fi prototypes focused on visual design, accessibility and copywriting.

HI-FI PROTOTYPING

Based on research insights, hi-fi prototypes focused on visual design, accessibility and copywriting.

🎨 Visual Design

Given the potentially stressful situation users may experience while using Neighbourhood Rescuer, it is crucial to prioritize visual design elements that communicate reliability and instill trust. Additionally, the interface should have a clean and simple design to avoid overwhelming the user further.

Given the potentially stressful situation users may experience while using Neighbourhood Rescuer, it is crucial to prioritize visual design elements that communicate reliability and instill trust. Additionally, the interface should have a clean and simple design to avoid overwhelming the user further.

HI-FI PROTOTYPING

Based on research insights, hi-fi prototypes focused on visual design, accessibility and copywriting.

👁️ Accessibility

Complying with accessibility guidelines was a top priority for Neighbourhood Rescuer. We ensured high color contrast for all interface elements and carefully considered element sizes to optimize usability on mobile devices.

Complying with accessibility guidelines was a top priority for Neighbourhood Rescuer. We ensured high color contrast for all interface elements and carefully considered element sizes to optimize usability on mobile devices.

HI-FI PROTOTYPING

Based on research insights, hi-fi prototypes focused on visual design, accessibility and copywriting.

📝 Copywriting

Clear and concise content played a crucial role in delivering a simple and easily understood experience to the user. We emphasized the importance of crafting content that effectively communicated information and minimized any potential confusion.

Clear and concise content played a crucial role in delivering a simple and easily understood experience to the user. We emphasized the importance of crafting content that effectively communicated information and minimized any potential confusion.

HI-FI PROTOTYPING

Based on research insights, hi-fi prototypes focused on visual design, accessibility and copywriting.

USABILITY TESTING

18 usability tests were conducted to gather user feedback and validate design decisions.

The participants were given a pre-test survey, which gave us more background into their demographic and previous experience, and a post-test survey to understand their overall thoughts and satisfaction with the design.

USABILITY TESTING

18 usability tests were conducted to gather user feedback and validate design decisions.

The participants were given a pre-test survey, which gave us more background into their demographic and previous experience, and a post-test survey to understand their overall thoughts and satisfaction with the design.

Method

Where

Zoom and In person

Type of Data Collected

Think-aloud observations and direct feedback to learn about users' positive and negative thoughts and feelings.

Interface Type and Task Scenarios

  1. Urgent (animal is in distress); rescue volunteer service is dispatched; person cannot stay with the animal.

  2. Urgent (animal is in distress); person stays with animal; person transports it to a local rescue organization

  3. Non-urgent (animal is NOT in distress)

Demographic

9

🐕 Potential Finders

Individuals who were interested in the problem space.

6

⛑️ Potential Rescuers

Are either active foster guardians or own a rescued animal and are passionate for pet rescue.

3

🧑🏻‍🏫 Product Area Experts

Have worked directly with rescues or shelters such as Katie’s Place Shelter, WAG, and Countryside Kennels.

KEY FEEDBACK

Contained an overwhelming amount of text the user needed to read. What is the minimum amount of key information we can provide?

KEY FEEDBACK

Contained an overwhelming amount of text the user needed to read. What is the minimum amount of key information we can provide?

“There are too many things to read and fill out, if I'm in an emergency situation I'd be too overwhelmed to read all this. ”

“There are too many things to read and fill out, if I'm in an emergency situation I'd be too overwhelmed to read all this. ”

— Usability Tester

FEATURE BREAKDOWN

Finders Web App

FEATURE BREAKDOWN

Finders Web App

“There are too many things to read and fill out, if I'm in an emergency situation I'd be too overwhelmed to read all this. ”

Diagnosis Tool

Searching for Neighbourhood Rescuer directs users to its Diagnosis Tool to identify the necessary assistance.

Requesting Help

If a finder cannot transport the animal, our system connects them to a nearby rescuer. The finder must provide their exact location, plus photos of nearby landmarks and the animal.

Connecting with Rescuers

Once connected to the nearest rescuer, the finder can view their ETA, send messages, and opt for text or email updates with a tracking number. Because the rescuer has all necessary details, the finder may leave the scene if needed.

Tracking Cases

Finders who leave the scene can use their tracking number to check their case status. However, because rescue staff are so busy, these updates cannot be guaranteed.

Rescuer Mobile App

Rescuer Mobile App

Rescuer Mobile App

Rescuer Mobile App

“There are too many things to read and fill out, if I'm in an emergency situation I'd be too overwhelmed to read all this. ”

Responding to a Rescue

Nearby rescuers are alerted to new cases, which are assigned to the first respondent. Rescuers can review all finder details beforehand to ensure they are prepared to handle the situation.

Performing the Rescue

Once a rescuer accepts a case, they gain edit access to the file, navigation to the site, and messaging with the finder. After a successful rescue, they must log the organization or clinic where the animal was taken.

Other App Features

Beyond the rescue flow, the app includes an archive of past cases, activity notifications, and a messaging system for rescuer collaboration.

REFLECTION

Projects like this make me feel empowered to be a designer, because it gives me the opportunity to create solutions to real world problems.

The amount of time and effort that went into this project cannot be accurately represented through a case study. The team and I went through so many scenarios and use cases, with consideration into feasibility from both user demographics through intensive user research.

REFLECTION

Projects like this make me feel empowered to be a designer, because it gives me the opportunity to create solutions to real world problems.

The amount of time and effort that went into this project cannot be accurately represented through a case study. The team and I went through so many scenarios and use cases, with consideration into feasibility from both user demographics through intensive user research.

This project is super personal to me, and I was estatic and proud that Neighbourhood Rescuer made it to Vancouver UX Awards as a finalist for the Students Category! Being able to share this project with so many people was an honour, and hearing feedback regarding how essential this service is was extremely inspiring and motivating.

REFLECTION

Projects like these make me feel so proud to be a designer, because it gives me the opportunity to create solutions to problems I have experienced and care about.

This project is super personal to me, and I was estatic and proud that Neighbourhood Rescuer made it to Vancouver UX Awards as a finalist for the Students Category! Being able to share this project with so many people was an honour, and hearing feedback regarding how essential this service is was extremely inspiring and motivating.

📍 Vancouver UX Awards Finalist 🏆

Finally updated my portfolio after 45 identity crisis, and giving myself dry eye 2026 ©

🍣

🍵

🐱

☕️

Finally updated my portfolio after 45 identity crisis, and giving myself dry eye 2026 ©

🍣

🍵

🐱

☕️

Finally updated my portfolio after 45 identity crisis, and giving myself dry eye 2026 ©

🍣

🍵

🐱

☕️

Create a free website with Framer, the website builder loved by startups, designers and agencies.