The Catty Shack
A solo project to create an online web experience that is:
- Easy to navigate
- Showcase services the facility has to offer
- Demonstrate distinct brand identity
Role:
​UX Designer
UX Researcher
UI Designer
Copywriter
Timeline:
20-31 July, 2024
Tools:
Figma
Illustrator
How everything started...
This is my first UX project and I had a lot of trouble deciding what to take on and what story to tell in my work.
I have always loved animals, especially cats, bu never grew up with them. It was not university did I get to bring home a cat, Kiki, who is now my best friend. I want to help more people find their future fur babies, therefore, I created a website that can connect the cats to my local community.
The Muse, Kiki
Who is The Catty Shack
The Catty Shack is the cat adoption facility for the City of London Ontario, Canada. The facility provides a temporary home for healthy, well adapted cats and allows visitors to meet the cats before adoption. The main mission for the facility is to provide the opportunity of having forever homes for all adoptable cats in the city.
The challenge
How might we create an online space for folks to easily find information for adopting cats, or helping out at The Catty Shack?
Currently The Catty Shack does not have its own website, which makes it difficult for adopters, volunteers and donors to find information about organization, and makes it difficult for The Catty Shack to build a brand identity
01
Define
Competitive Analysis
Through the competitive analysis I was able to identity The Catty Shack’s current advantages and areas I should include for the creation of the website.
The Catty Shack’s current advantages are:
1. The only rescue featured by the City of London Ontario
2. Cats only rescue
3. All cats can be visited through the facility during business hours
For the website, I want to play up the advantage The Catty Shack has as a business to stand out from the other facilities in the city. These advantages will act as unique aspects that drive the design aestheics and thee copywriting of the website. For example, due to the cat only characteristic, the design will feature cat-related designs such as cat symbols and photos acting as decoration.
The Users
From researching the different adoption agencies in the community, I found 3 main types of users that are most likely to visit The Catty Shack website. These users and their needs will determine the next step of the design process.
Adopter
Volunteer
Donor
I want to find a nice cat to join my family
I want to make a difference for cats in the community through my time and skills
I want to find a reputable organization to help cats through money and supplies
“Are there any information on the available cats?”
“Is there any way I can help out?”
"What is the easiest way for me to donate?”
02
Ideate
User Journey
The user journey follows an adopter user, the most common user that will visit the website
Sitemap
03
Design
Low Fidelity Wireframes
The wireframes showcased here are created with reference to the user journey of the adopter user. Looking at the user journey, these page will be the most visited pages by the adopter user group.
Color Palette + Font
04
Prototype
High Fidelity Designs
