Creating a unified design language that puts every pet one tap closer to a home.
My role spanned the full build: creating components in Figma, defining variables & design tokens, creating UI kit, structuring the documentation on ZeroHeight.
ROLE
Product Designer
TIMELINE
4 months
TEAM
4 Designers
SKILLS
Design Systems
Documentation
THE PLATFORM
Adopt a Pet lists over 65,000 shelters and rescues across North America.
Every listing is an animal waiting. Every search is someone looking. The product's job is to make sure those two things find each other. That is not a small responsibility to design for.
THE PROBLEM
We opened the product and started looking closely.
Different button styles on the same page. Pet cards that looked one way on the homepage and a completely different way in search results.
Typography with no clear hierarchy, where a pet's name competed with a marketing headline for attention. Color variables with no naming convention, no token structure, no single source of truth.
The more we looked, the more we found.
Card inconsistency
The same type of card looks different depending on which page you find it on.
Button chaos
Every section of the product seems to have designed its own button from scratch.
Typography with no hierarchy
Nothing on the page feels more important than anything else.
Color with no system
The brand color appears in multiple slightly different shades with nothing tying them together.
No shared spacing logic
Padding and spacing shift between pages in ways that are hard to explain and harder to defend.
Typography with no hierarchy
Nothing on the page feels more important than anything else.
INTRODUCING PAWPRINT
Pawprint is not a redesign. It is not a rebrand.
It is a shared foundation: color tokens, type scale, spacing, and a component library, that gives the team one place to start from, every time.
WHAT DROVE OUR DECISIONS
Every system needs a point of view. Ours had five.
Before we built anything, we agreed on what Pawprint should stand for.
BUILDING THE FOUNDATION
Before any component gets built, the foundation has to be right.
Before we built anything, we agreed on what Pawprint should stand for.
We started with color.
The existing product had a handful of colors with no structure behind them. We kept the same palette but built a proper system around it, organized into ramps with named weights. More colors on the surface, but far less confusion underneath.
Typography came next.
We chose Lora for headings and Inter for body text. Lora brings warmth and personality. Inter keeps things readable and clean. Together they create a hierarchy where the pet's name always leads and everything else supports it.
Spacing and radius rounded it out.
Spacing was standardized into a consistent scale so padding and layout decisions stop being guesswork. Corner radius followed the same logic, a small set of values that give Pawprint its approachable, friendly feel.
BUILDING THE COMPONENTS
50+ components. Navigation, cards, buttons, forms, blocks, carousels, and more.
Every one of them auto-layout, tokenized, and ready to drag in.
WHAT WORKED, WHAT DIDN'T
We tested the kit with other designers before calling it done.
We tested the kit with other designers before calling it done. We found out:
1. Using the components was easy. Finding them was not.
Properties that made sense to us did not always make sense to someone new to the file.
The system did not change. How people could find and use it did.
REFLECTION
Pawprint taught me that systems are about people, not components.
Building a design system is not the same as designing a product. There is no single problem to solve. It is a set of decisions that have to hold together across every context, every designer, every sprint.
Three things I took away:
Naming is design. If someone cannot find it or understand it, it does not exist.
A system is only as good as its adoption. Building it is the easy part.
This is not the finish line. Pawprint is a foundation. That is not a limitation. That is the point.
Thanks to my teammates Sylvia, Chu and Nicole; and Professor Craig MacDonald for pushing us to think beyond components.
THANK YOU FOR READING!
Debodyuti Biswas