Petco
Role
UX Research, UI Design, Design System, Motion Graphics
Team
Yoonseo Jeong
Duration
2 months (8 Weeks)
Tools
Figma, Miro, Adobe CC
Design Process
01
Research
Brand Research
Competitor Analysis
User Interview
Website Analysis
02
Design
Design Statement
Design Principle
UI Design
03
Reflection
Key Takeaways
Future Improvements
Pet parents struggle to understand whether a product fits their pet’s needs because key information is buried in dense text and low visual hierarchy. The website’s plain layout and static promotional areas fail to capture attention or guide exploration, causing users to leave before discovering relevant details.
As a result, choosing the right product becomes overwhelming, especially for users who need to compare multiple items.
It is difficult for pet parents to determine if a product can meet their pet's specific needs, size, or sensitivities due to dense product information.
Problem
Provided users with clarity through personalized features and visual storytelling to enhance user experience.
Solution
Key feature 01
Static promo into an interactive design
01
What I noticed
Users described the website is plain and boring.
02
Validation
User testing showed almost no interaction with the banner area and the ads.
03
Solution & Goal
Transformed the
static banner into an interactive card to keeps users exploring.
04
Outcome
Testing showed higher interaction rates within the promo section.
Key feature 02
Personalized Pet Profile
Paste your design here
Home / Dog / Dog Food
Ship to 10003
Free Shipping on $35+
Delivery
Get it 12pm
Shipping
Get it Saturday
Pick Up
Ready in 1 hr
Add To Cart
Ollie Fresh Beef Dish
$49.99
(408)
1 LB
5 LBS
Step 3 of 5
Select breed
Shih Tzu
Search for breed
Labrador Retriever
Golden Retriever
French Bulldog
Maltese
Shih Tzu
Continue
German Shepherd
Selected:
German Shepherd
Choose Breed
A clear active state and checkmark help users choose the correct breed, while a confirmation bar reinforces accuracy before moving on.
Select Pet Type
Uses photos and simple illustrations so users can identify instantly without reading, reducing effort from the first step.
Allergies & Care Needs
Pre-selecting allergies and sensitivities builds trust and filters unsafe products later, leading to safer recommendations.
Add Basic Info
Flexible inputs for name, age, and weight let users type or tap, making the flow fast and minimizing errors.
Upload a Photo
Photo upload supports size accuracy and product visualization, helping reduce mismatched purchases and unnecessary returns.
Tips for a great photo
A front-facing photo helps us create the most accurate 360° model.
All Set!
Bella's profile is ready.
Let's find the perfect products for them!
Personalized recommendations
We'll suggest products perfect for Cookie
Health & wellness tracking
Keep track of important dates and milestones
Cookie
German Shepherd
2 years
60 lbs
Dog
Special care: Chicken, Dental Health
01
What I noticed
Users struggled to choose the right product for their pet.
02
Validation
The website lacked recommendations tailored to each pet’s unique needs.
03
Solution & Goal
A 5-step pet profile flow delivered personalized product suggestions.
04
Outcome
Testing showed users trusted the recommendations more and spent less time searching.
Key feature 03
Visual Storytelling
01
What I noticed
Key ingredient information was buried in text, making comparison difficult for users.
02
Validation
Long text lists caused confusion, especially for users sensitive to ingredients.
03
Solution & Goal
“Ingredient Spotlight” to make complex information easier to scan and understand.
04
Outcome
Testing showed users could scan ingredients at a glance and make purchase decisions more quickly.
Details Breakdown
Transforms text-heavy product details into clear, visual modules so users can scan details, descriptions, benefits and ingredients at a glance.
Petco is a leading pet health & wellness company with 1,500+ locations and 100+ in-store veterinary hospitals. Their purpose is to improve the lives of pets, pet parents and Petco partners.
Healthier Pets. Happier People. Better World.
Brand Archetype
Target Audience
Pet Parents (25–34)
Value clarity, convenience, and trustworthy product information.
about
60%
40%
Caregiver
Focuses on nurturing, trust, and emotional connection between pets and owners.
Everyman
Friendly, accessible, community-driven brand that feels familiar and welcoming.
design statement
A clear and interactive redesign that elevates Petco’s product detail page through bold visuals, intuitive structure, and playful brand expression.
design system
TEXT STYLES NAME
DISPLAY M
HEADLINE L
HEADLINE M
BODY L
BODY M
BODY S
BUTTON
Lorem ipsum dolor
Lorem ipsum dolor
Lorem ipsum dolor
Lorem ipsum dolor
Lorem ipsum dolor
Lorem ipsum dolor
Lorem ipsum dolor
FAMILY
WEIGHT
SIZE
LINE-HEIGHT
SPACING
PREVIEW
display
text
text
text
text
text
text
bold
semibold
semibold
regular
regular
medium
medium
30
22
20
18
16
14
22
38
30
25
22
20
18
27
0
0
0
0
0
0
0
TEXT STYLES NAME
DISPLAY L
Display M
HEADLINE L
HEADLINE M
BODY XL
BODY L
BODY M
BODY S
BUTTON
LINK
Lorem ipsum dolor
Lorem ipsum dolor
Lorem ipsum dolor
Lorem ipsum dolor
Lorem ipsum dolor
Lorem ipsum dolor
Lorem ipsum dolor
Lorem ipsum dolor
Lorem ipsum dolor
Lorem ipsum dolor
FAMILY
WEIGHT
SIZE
LINE-HEIGHT
SPACING
PREVIEW
display
display
text
text
text
text
text
text
text
text
semibold
bold
semibold
semibold
medium
semibold
regular
regular
semibold
bold
50
45
35
26
24
22
20
19
30
24
60
53
43
32
30
27
24
23
37
29
0
0
0
0
0
0
0
0
0
0
Proxima Nova
ABCDEFGHIJKLMNOPQRSTUVWXYZ
ABCDEFGHIJKLMNOPQRSTUVWXYZ
12345567890@#$%^&*(!?
Aa
Typography
Iconography
Primary
#206AFF
#FF6A2E
#FFCC34
Secondary
#001952
#FDF1E4
#FFFFFF
Primary
#ACACAC
#BEBEBE
#C4C4C4
#E4E4E4
#EEEEEE
Color System
REVIEWS
4.8
Select a row below to filter reviews.
(408)
315
55
9
6
2
5 stars
4 stars
3 stars
2 stars
1 stars
1 LB
5 LBS
Ollie Fresh Beef Dish
$49.99
(4.8)
Delivery
Get it 12pm
Pick Up
Ready in 1 hr
Select Size
Premium Dog Food
Shipping
Get it Saturday
Card
Sweet Potato
An excellent slow-burning carbohydrate and dietary fiber source, sweet potatoes are packed with nutrients like antioxidants and Vitamins A and C.
Day 1-2
Scoop a small amount Ollie into your pup’s current food.
Shop Now
Crumps’ Mouth Care
Dental Sticks
$13.99
(203)
So great!
Eddie
3 days ago
My dog eagerly devoured this food. The combination of beef and sweet potato seems to be a hit, offering a flavor that keeps him excited for mealtime.
Cookie
German Shepherd
2 years
60 lbs
Dog
Special care: Chicken, Dental Health
Grid
Key Takeaways and Future Improvements
reflection
🌟
🌟
🌟
The 'Why' is Powerful: Communicating the 'Why' behind the solutions are important based on the user quotes.
Motion as Function: Micro interactions are powerful tools for guiding user attention and enhancing ease-of-use in a minimal design.
Measure Business Impact: I would like to conduct testing on the 'Personalized Pet Profile' to quantify the impact.
WOOF! WOOF! WOOF!
WOOF! WOOF! WOOF!
WOOF! WOOF!
WOOF! WOOF! WOOF!
WOOF! WOOF! WOOF!
