DeFi Protocol · Product DesignerRe-designed the whole protocol, added features, implemented shadcn/ui
Upgraded the hackathon-built design to make the product scalable, improve accessibility, and add a premium look and feel.
Built fast, shipped inconsistently
Hylo launched on Solana with an ambitious product suite — xTokens (leveraged tokens with liquidation protection), LSTs, their own yield-bearing stablecoin, and more. The ambition was real. The design wasn't keeping up.
When we first connected shortly after the team closed a $1.5M seed round, the product had been built fast. Too fast for the design to stay consistent. Every module felt like its own mini-app. A new user landing in the xTokens section and then navigating to staking might wonder if they'd switched products entirely.
There was also a more urgent problem uncovered early: onboarding.
- Long and redundant — too many steps, too much friction
- Completion rate wasn't good enough for a protocol preparing to grow
- First impressions weren't matching what Hylo was actually capable of
For a protocol that just raised and was preparing to grow, this was a real liability. The product needed to feel trustworthy — and it didn't yet.
DeFi craft meets SaaS discipline
On the DeFi side: Jupiter and Kamino. Both set a high bar on Solana — dark interfaces, precise data presentation, and a visual confidence that says "this is where serious capital moves."
On the SaaS side: Stripe and Linear. Not crypto products, but they share something DeFi often lacks — a feeling of craft. Every component is intentional. The system is invisible because it's so consistent. The goal was to bring that same systemic thinking into Hylo's world.
Minimal, polished, and coherent
The visual direction landed on minimal, polished dark aesthetics — not dramatic or overdesigned, just clean and confident. The kind of interface that gets out of the way and lets the product speak.
But the bigger challenge wasn't the visual style. It was coherence. I started by auditing everything that existed, identifying what could be unified and what needed to be rethought. The goal: make the whole app feel like it was designed by one hand, with one system, for one product.
A design system was built from scratch — shared components, consistent spacing, a clear token structure — so every new feature could be shipped faster and look like it belonged.
Design that engineers can actually use
Design systems only move fast when engineers can actually use them. So we didn't stop at Figma. The component library was implemented directly in shadcn/ui — that helped the dev team 5x their productivity.
Each component was customised to match the Hylo visual direction: tokens mapped, variants defined, edge cases covered. The result: designers and engineers speaking the same language. A button in Figma is the same button in code. No translation layer, no drift over time. New features ship faster because the foundation is already there on both sides.
Fixing the first impression
The onboarding flow was the first major UX project, and one of the highest-leverage fixes. The original flow was long, had redundant steps, and asked users for information at the wrong moments. Completion rates showed it.
The redesign was both UX and visual:
- Merged steps that covered the same intent
- Removed or deferred anything that wasn't essential at entry
- Moved secondary information to where it was actually needed later in the product
- Visually aligned it with the new design direction from day one
The result: a shorter, more purposeful flow that earns trust before asking anything of the user. Completion rate went up 68%.
One product, one visual language
With the system in place, the focus shifted to screen-by-screen refinement across the full product. The before/after contrast was significant: before, each module had its own color logic, component style, and interaction patterns. After, one product — one visual language. Whether a user is in xTokens, staking, or any other module, it reads as Hylo.
Accessibility improved across the board. Spacing became consistent. Components were reusable. New screens could be shipped in a fraction of the previous time. Over 60 screens were redesigned and handed off across the 4-month engagement, covering the core app, identity elements, and social media assets.
From scattered MVP to DeFi-ready product
- The community noticed — for a DeFi protocol, that's not a small thing
- The dev team could move faster with a shared component library in code
- Every future feature starts from a concrete foundation, not from scratch
Hylo went from a scattered MVP to a product that reads like it belongs at the top of the Solana DeFi stack.
"Harry came in, made sense of the mess, and gave us an actual system to build on. The dev team could move faster, and the community noticed the upgrade. Exactly what we needed going into growth."
Sape
Founder, Hylo
Tell me what you're building
Send your product and I'll record a Loom with the highest-leverage fixes in 48 hours. Free, and no pitch.
Or if you only have the idea, I'll gladly help you with the design strategy on a quick session.
- Video review in 48h
- No charge, no strings attached
- 1 slot open for July