BEN
LittlePet
LittlePet is more than just an animal shelter website; it's a platform dedicated to promoting pet adoption and finding loving homes for our furry friends. Our primary mission is to connect our precious pets with eligible individuals who are willing and capable of providing them with the caring and nurturing environment they deserve
THE PROBLEM
The statistic is disheartening: only 1 out of every 10 dogs born will find a permanent home. Animal homelessness is a complex crisis that demands our attention, but fortunately, the solution is straightforward: choosing to adopt animals from shelters or the streets.
THE GOAL
Design an app that enables users to browse and view all the animals available for adoption in local shelters.
MY ROLE
UX Designer, design an app for an animal shelter, LittlePet from conception to adoption.
Responsibilities
Conducting interviews, paper and digital wireframing, low and high-fidelity prototyping, conducting research study plan, conducting usability studies, accounting for accessibility, and iterating on designs.
UNDERSTANDING THE USER
I conducted interviews and created empathy maps to understand the users I’m designing for and their needs. Most users are working people who don’t have time to go to the animal shelter all the time to find their perfect companion or claim that they never find the pet with the characteristics they want.
​
This user group confirmed the assumption that we made while doing the research but also revealed that time and characteristics of the pet were not the only factor limiting users from going to animal shelter. Other user problems included obligations, challenges, not finding the one they want, and sometimes there is no animal rescued on most days.
The Challenge
One of the challenge I faced while designing this app was trying to find the right color combination that really show compassion and sympathy. The right color combination is very important.
BREAKING DOWM THE PROCESS
I have tried to find the user pain points, created personas and user journey. Mapping user journey map revealed how helpful it would be for
users to have access to a well designed and structured LittlePet app.
I have created sitemap. The sitemap I have created before the wireframes and all. Along the way I have made changes about the pages.
​
Paper wireframes were created. Taking time to draft the design of the app. But along the way I have made some changes. Those were my initial ideas. I have kept the homepage as it is though just made a few adjustment.
​
Paper wireframe for different screen size. The two different screen size wireframe. Most part are the same but after the usability study there has been changes.
The Design Phase
Digital Wireframe
Digital wireframe for the mobile version everything is direct and easy to navigate through just few changes in the navigation part.
Digital wireframe screen size variation(s)
Digital wireframe for the two different version of the screen I have created. There is consistency in the pages through different sizes.
Mockups
TITLE OF THE CALLOUT BLOCK
LESSONS LEARNED
"If the user can't use it, it doesn't work." - Susan Dray
Multiple people use different screen size variation depending where they are. It is important as a designer to design for all the different size screens that are popular.
​
I have learned that designing an app is not done alone. You have to review what people think about your design.
Feedbacks play a huge role in the design process.
I have learned to design different version of website.