Bringing five products into one developer platform

Nutrient had sprawled into five separate product sites and brands. Through my studio, I designed one product-led platform and built it in React and Astro, so it read as a single company without flattening the products underneath.

Company: Nutrient
Role: Principal Product Designer
Industry: Developer tools & SaaS
Timeline: 2024
Built with: React, Astro
Live: nutrient.io

Nutrient home page with clear product positioning and a document workflow preview — A product-led home page leads with what the platform does, then lets people go deeper by product or by role.

Context

Nutrient is a document-processing and SDK platform used by developers and enterprise teams. The company had grown into five separate product sites and brands, which made the offering hard to read as one platform. Delivered through my studio, Push Refresh, the work brought those products together into a single product-led site that had to explain genuinely technical capabilities without burying the reader.

The problem

The site had to speak to developers evaluating an SDK and to buyers who needed to understand the platform quickly, without watering down the technical depth either one relied on. Content scattered across five brands made it hard to differentiate offerings or point people to the right place. The structure also had to keep working as the product line grew.

Product-level navigation spanning SDK, cloud, workflow, and integrations — Navigation was structured around the product line, so it could absorb new offerings without a redesign.

What I did

Led UX and UI for the entire website as Principal Product Designer
Designed and built the site in React and Astro, taking the work from design through production
Partnered with product and marketing to line the messaging up with what the platform actually does
Owned performance, accessibility, and maintainability as part of the build, not a handoff

How I approached it

Started from a product-first information architecture instead of a marketing-first one
Built reusable layout and content patterns so the team could keep iterating without a redesign
Chose Astro for speed and pulled in React only where interactivity earned it
Designed with implementation in mind and built it myself, which removed most of the usual handoff loss
Treated accessibility and page performance as constraints the design had to satisfy

SDK product page presenting technical capabilities to a developer audience — Technical pages were designed to respect a developer audience, keeping depth accessible instead of hiding it behind marketing.

Key decisions

Led with a product-first structure so the site explained the platform, not just marketed it
Made clarity the primary constraint and surfaced technical depth only where it earned its place
Built reusable patterns so ongoing changes did not mean rebuilding pages
Split the stack between Astro and React to keep the site fast while supporting the pieces that needed interactivity

Systems & patterns

Reusable layout and content blocks that let non-designers extend the site safely
A component set shared between design and the production React and Astro build, so what was designed is what shipped

What shipped

A fast, product-led website that pulls five products into one coherent story and gives the team a base to keep building on. Because I designed and built it, the work went from concept to production without losing intent in handoff.

Reflection

This is the kind of project I do best: real product complexity, a systems problem underneath, and design that runs all the way into code. Pulling five brands into one story took as much editing as designing — deciding what to say plainly and what to leave out. Owning both the design and the front end meant the fast, accessible result on screen was the same thing I had in the file.