top of page

UX Case Study

Animal Aid App Design

Project done as part of a design proposal to the shelter by taking initiative from a volunteering experience

Unofficial Proposal for the design of an app for the Animal Aid Shelter at Udaipur, Rajasthan, India

My contribution 

Individual Project

research-3.png

Ideation 

answer.png

UX Research

ui.png

UX Design and Prototyping

Overview.

The idea for the design came after my volunteering experience at Animal Aid Shelter. Despite having a strong online social presence, having an app would provide the shelter a consolidated area by making the data more precise and accessible. I accessed the relevant information on the shelter website and generated a design that would help the users get better 

access to the working of the shelter and hence leading to more animals

 finding their forever homes. 

​

Screen Shot 2020-01-14 at 1.13.26 AM.png

Understanding the Information.

Animal Aid has a variety of services, facilities and training programs. These are all varied and range from stray animal rescues, volunteer opportunities, spay/neuter facilities, medical treatment, among many others. 

Spay/Neuter
surgery.png
rescue-dog.png
Rescue
walking-the-dog.png
Volunteer
puppy.png
Adoption
hydrotherapy.png
Medical

Services at Animal Aid

Closed Card Sort.

In order to understand the organization of information on the app, I performed a Closed Card Sort with 4 participants. 

The results and process of the card sort is described below.

Screen Shot 2020-01-14 at 12.54.10 PM.pn
Screen Shot 2020-01-14 at 12.53.38 PM.pn
Screen Shot 2020-01-14 at 12.54.24 PM.pn
Screen Shot 2020-01-14 at 12.53.56 PM.pn
Screen Shot 2020-01-14 at 12.54.38 PM.pn
Screen Shot 2020-01-14 at 12.54.52 PM.pn

Categories for sort

Screen Shot 2020-01-17 at 12.32.35 AM.pn
Screen Shot 2020-01-17 at 12.31.26 AM.pn
Screen Shot 2020-01-17 at 12.30.36 AM.pn
Screen Shot 2020-01-17 at 12.32.13 AM.pn

Card Sorting

For the card sort, I briefed the participants to help them learn about the project. After that, I had them go through a series of tasks of card sorting and encouraged them to speak aloud to let me know about their thoughts. 

Semi - Structured Interviews.

Interview Quotes

mother.png

"We would like to know about 

the animals and their stories 

before we get to the shelter."

"I want there to be a payment option on the app so that I do not have worry about paying when I get to the shelter."

old.png
woman.png

"I want to know about the 

volunteer requirements properly

and in detail."

Analysis

Pain Points

sick.png

Access to clear information

veterinary.png

Volunteer details

pay.png

Payment Options

dog.png

Animal Stories

Information Architecture.

Based on the feedback from the card sort and the semi-structured interviews with adopters, volunteers, doctors and visitors, I created the information architecture to represent the needs and resolve the pain points found during the research phase.

AAflow.png

Information Architecture

Sketches.

After defining the information architecture, I created rough sketches of paper prototypes for the app to get an overall idea of how the information on the app would look and how the screens would transition among each other. 

Screen Shot 2020-01-17 at 1.33.38 AM.png

Sketches

Wireframes.

The wireframes provided a more broad idea of how the information would be presented. The wireframes also addressed the pain points that were found during the research phase. The wireframes give an idea about the structure of the app but not the visual design, which is explored in the prototyping phase.

Screen Shot 2020-01-17 at 2.01.30 AM.png

Wireframes

Prototypes.

The prototype was designed as the final deliverable for the project, with the visual design and the information structure laid out. The following section explains the main services in the app point by point. 

Screen Shot 2020-01-17 at 2.23.23 AM.png
Screen Shot 2020-01-17 at 2.23.45 AM.png

Landing Screens.

The landing screens present all the required information in one place and guide the user towards the 3 main sections - Volunteer, Donate, Sponsor. 

About the Team.

The about section elaborates on the working team, history of the organization and the founding member interviews and redirects the user to the FAQs.

Screen Shot 2020-01-17 at 2.33.41 AM.png
Screen Shot 2020-01-17 at 2.32.41 AM.png
Screen Shot 2020-01-17 at 2.33.14 AM.png
Screen Shot 2020-01-17 at 2.42.40 AM.png

Sponser Animals.

Users can read rescue stories and sponsor 

treatments, care and adoption for a chosen animal.

How can you help?

This section gives the users the option in which they can get involved with the shelter in various ways.

Screen Shot 2020-01-17 at 2.40.44 AM.png
Screen Shot 2020-01-17 at 2.41.26 AM.png
Screen Shot 2020-01-17 at 2.41.50 AM.png
Screen Shot 2020-01-17 at 2.41.05 AM.png
Screen Shot 2020-01-17 at 2.40.23 AM.png

Get Involved.

Users get the option of accessing the shelter location and the volunteer manual. The manual is also downloadable to the user's phone. Users can also donate money in multiple currencies for the animals.

Memorialize your Pet.

Users can permanently memorialize their beloved pets who are no longer with them by featuring them with the shelter and in turn, helping the shelter save more lives. 

Screen Shot 2020-01-17 at 2.42.22 AM.png
Screen Shot 2020-01-17 at 2.42.58 AM.png

Interactive Prototype.

Hi! While you are here, please go and check out the amazing work that Animal Aid does here.

Animal Aid Anchor
bottom of page