CitiPups Pet Adoption Website
Role
UX/UI Designer
Schedule
SEP 2023
Skills
Marvel, Data Analysis, User Flow, Mapping, Crazy 8s, Lightning Demos, Competitive Analysis, Storyboarding, Rapid Prototyping, Usability Testing
Introduction
CityPups is a new startup that wants to help people living in cities find the perfect dog to adopt. They’ve brought us on board to run a 5-day design sprint to quickly test out a possible solution. The Google Ventures design sprint was born out of a need for a process that would allow companies to quickly create high fidelity prototypes so that they could determine if they wanted to go through with the designing and building of a particular product.
Day 1
On day 1 we identified the problem from initial interviews and map out the product’s most important user flow.
Initial Interviews
Sara
“I would never want to adopt a dog that needed more activity or space than I could provide. I try to find breeds that are generally less hyper, but it all really depends on the personality of the dog"“
Anna
“A lot of sites tell you if the dog is ‘good around other dogs’. I think this generally means other dogs in the household - but what bout in public?'“
Ron
“I usually look for smaller dogs since I don’t have a ton of too, - but, sometimes smaller breeds need the most space”
Dan
“I look at the basic info - size, age, etc. Photos and ‘bios’ are so great to get an idea of the dog’s personality. Some things are harder to figure out - like how much attention the dog needs”
Maria
"Photos are definitely the first thing I notice or make a connection with. From there, I think about more practical stuff, like how big the dog is, and how much indoor space they need”
Interview Findings
Most common frustration with the adoption process is feeling confident that the dog is a right fit for the owner. Age, size, and photos are the basic minimum information. However, often it’s the personality that makes people feel like it’s going to be a right fit for them. The frustration that's mentioned by several people is not learning enough about the personality of the dog on the website. More specific but important information like temperament, space needed, relationship with other animals, and whether they're good with children are often a must know for someone looking to adopt.
Mapping
Created a possible end-to-end experience a user might have with our product by making a map
Day 2
We sketched ideas as a way to ideate and generate possible solutions. We conducted lightning demos to quickly research competitive websites. We then used a technique called Crazy 8s to help us come up with possible solutions.
Lightning Demos
Our team looked at solutions competitors have produced to solve a problem similar to the one we are trying to solve
We also looked at products that solve a similar problem that’s focused on a different area of engagement
Paws Crossed
No selection criteria
Not enough information on the browsing page
Lacks information on breed and temperament
No age listed, which is important for most of adopters
Pet Finder
A lot of preference selection for the browsing page
Shows distance away
Shows whether if they’re a good match without having to click into their bio
Cars.com
A popular used car sale site also incorporates a lot of preference selections to help user narrow down their search for best matched options




Crazy 8 Sketches
Refer back to our map we made on Day 1, we decided the browse page is the most critical for our users
Sketched out 8 variations of the most critical screen in the span of 8 minutes, 1 minute per page
Solution Sketches
Selected one of the Crazy 8s screen sketches of our critical screen
Sketched out a solution sketch, a three-panel board of
The screen that comes before our critical screen (landing page)
The critical screen itself (browse page)
The screen that comes after our critical screen (dog profile)
Day 3
After we’ve sketched our ideas, we created a storyboard for our solution sketch.
Storyboard
Storyboard is like a lightweight, sketched wireframe that we used to build our prototype
Because we are under time constraints, by sketching out the storyboard, we are able to cut out low-fidelity wireframing and go straight to rapid prototyping
5 to 15-panel storyboard that included our solution sketch (3 panel sketch)
Day 4
Day 4 will be dedicated to prototyping our solution. A design sprint prototype is more like a realistic facade; it’s something we can put in front of customers to gauge their reactions about our idea. We created only prototypes of the screens that are absolutely necessary for a user to interact with to complete a specific task.
Prototyping
We only built the bare essentials that we needed to test the functionality of the design
The idea was to work fast but still have basic functionality, and test the overall flow and layout
We focused on having a simple process of adopting a dog but still provided the common information owners are looking for
Day 5
The last day of a design sprint is dedicated to getting feedback from users by testing.
Testing
We tested 5 people who lives in metropolitan areas, and have either browsed through pet adoption website or have adopted pets before
Participants were asked to complete the task of trying to submit an inquiry for a dog
Test Findings
All 5 participants mentioned they appreciate the amount of preference selection
3 participants wanted the photos to be larger when they clicked into the bio page, and 1 would like to see videos
1 participant mentioned they would like to see how far is the dog on the browse page
Summary
The implementation of a design sprint facilitated the expeditious evaluation of a potential solution within a concise five-day timeframe. Subsequently, we have incorporated our discoveries into the resolution of the initially identified problem. This approach can be iteratively applied to assess new solutions or integrate additional features as needed.
In this time-constrained design sprint, we've focused our ability to prioritize speed and completion, emphasizing crucial elements like layouts and features over aesthetic refinement. The primary benefit of this approach lies in swiftly crafting a high-fidelity prototype for testing, focusing on creating a minimal viable product. Moving forward, our aim is to elevate the UI elements and overall aesthetic, while maintaining testing to enhance the user experience by integrating additional features and refining website details.