The brief
The client runs an AI agent platform for D2C brands — 200+ agents across 9 departments. The product was solid. The website was one paragraph and a contact form.
They knew it needed work. They just hadn't gotten to it.
What we built
Full rebuild in Next.js + TypeScript + Tailwind + GSAP.
The main things:
— animated hero that actually shows what the product does instead of describing it
— tabbed department explorer (9 verticals, all in one section without it feeling cluttered)
— live agent console UI — gives visitors a sense of the product before they sign up
— bento proof section for stats and client logos
One constraint I kept coming back to: the product is technical but the buyers aren't always developers. Every section had to be clear to a D2C brand owner who doesn't know what an AI agent is.
One thing worth mentioning about GSAP
The services section uses a horizontal scroll — the whole track slides left as you scroll down, pinned to the viewport. The tricky part is calculating how far it needs to travel: track.scrollWidth - window.innerWidth, and that number changes every time the viewport resizes. GSAP handles this cleanly with function-based values — instead of a fixed pixel distance, you pass a function to end and set invalidateOnRefresh: true, so ScrollTrigger re-runs the calculation on every resize automatically. The whole thing is also wrapped in gsap.matchMedia so it only activates on desktop — on mobile it falls back to a normal vertical stack.
Result
Delivered in under 4 weeks. Fixed scope, no surprises.
Live at lancemart.org
Top comments (0)