GRADIENT AI
Shaping an AI product vision & system from scratch
Gradient’s founding team reached out while the product was still in a true 0→1 phase. We explored multiple visions to pressure-test the B2B product’s direction and align it with user needs and the team’s ambition.
0→1 AI vision
Product & system design
ROLE
Ld. Product Designer
YEAR
Jan–Apr 2025
TEAM
Co-Founder, CEO
Product Lead
Engineering Lead
→ Premium brand-product unity
Translating Gradient’s retro brand into a functional, accessible UI created a product experience that felt premium and intentional.
→ UX/UI reset for trust & clarity
We redesigned the UX/UI from the ground up by clarifying the information architecture and refining states and transitions.
→ A system built for confident iteration
A component library and style guide gave the team a shared baseline for building, and eliminating the need to re-solve foundational UI decisions each sprint.
No design foundation. A true reset from scratch.
When joining Gradient, there was no design foundation.
We built everything from scratch: a UI that matched the brand, refreshed information architecture and experience, and a component library.
Because it all happened in parallel, it meant moving fast and adapting on the fly.
👇 Drag to see the before and after ↓
Forging a premium brand-product alignment
Gradient’s retro brand was already there. And it was good.
The product just wasn’t speaking the same language, so I translated the brand into UI in a way that felt premium, not performative.
The blurred tri-point mark became the visual affordance representing the AI’s background decision-making.
We tied brand + product together in a way that felt subtle but unmistakable: Noticeable if you’re paying attention, never loud enough to distract from the actual experience.
This pushed us into a few early product visions, like below:
Building trust through clarity
From hierarchy and contrast to states, transitions, and live updates; each detail was tuned to make complex AI behavior easier to follow, and easier to trust.
We balanced a retro-inspired visual language, and shaped the information architecture so the reasoning unfolds in clear, progressive steps.
▶️ Watch the video below to see the craft in action ↓
A usable system, not just a look
Gradient’s product needed a foundational refresh.
We turned a trial-and-error color palette into an intentional color system: on-brand and accessibility-aligned.
And we swapped the marketing-forward typeface for something built for UI: moving from Outfit to Geist (by Vercel) for clearer, more functional product typography.
This unlocked a scalable design system the team could ship from with confidence, helping the product feel more polished and reliable.
