Shaping the future of headless commerce: Hydrogen and Oxygen at Shopify
When I joined Shopify, headless commerce wasn’t new — but the opportunity to build a world-class developer experience around it was. I led the design teams across Hydrogen and Custom Storefronts, helping bring Shopify’s headless stack to life. From the first go-to-market launch to the evolution into Hydrogen 2 and expanded Oxygen hosting, my team was responsible for designing the full end-to-end experience that powered merchants around the world.
Starting with the stack
Hydrogen and Oxygen were Shopify’s bold move into developer-first headless commerce.
Hydrogen gave developers a fast, React-based framework built by Shopify, for Shopify — complete with pre-built components, hooks that mapped to our APIs and starter templates to accelerate build time. Oxygen provided globally distributed hosting, so you could deploy performant storefronts with a single click. Together they offered a powerful, opinionated way to build custom storefronts and we needed a design vision to match.
As the design leader across these areas, I partnered closely with product, engineering and developer advocacy to craft a user experience that was fast, elegant and deeply aligned to developer needs.
Designing for launch — and velocity
The go-to-market for Hydrogen and Oxygen was fast-paced and high profile. We had to deliver a complete design system, dev tooling UX and launch comms across a complex set of surfaces — all while creating clarity in a space that can often feel overwhelming.
I worked closely with my team to:
- Shape the overall UX strategy for Hydrogen and Oxygen
- Design the CLI and onboarding flow so developers could scaffold a storefront journey in minutes
- Drive consistency and usability across components, templates and API integrations
- Collaborate with Developer Docs and Advocacy to ensure design alignment across documentation, education and tooling
- Re-architect the developer documentation for Hydrogen, Headless and Oxygen from the ground up — making it easier to understand, faster to navigate and focused on helping developers take action quickly
- Create visual cohesion across surfaces that were traditionally fragmented between framework and platform
I kept my team focused, protected from unnecessary noise and supported them in working through complex technical and developer-experience challenges.
Evolving the experience
As the product matured, so did the expectations of the developers using it. My team focused on refining the end-to-end workflow to make it faster, more robust and easier to debug.
I led the design strategy for:
- Integrating Remix-specific capabilities into the framework while preserving simplicity
- Upgrading our CLI and starter templates to reduce time-to-first storefront
- Making debugging frictionless by introducing one-click error tracing directly in the browser through the Hydrogen channel, using source maps to link errors back to local source code
- Enabling confident deployment workflows with
h2 deploysupport from the CLI and seamless integration into CI/CD systems — helping developers catch bugs earlier with improved support for automated end-to-end testing on any platform
We also worked closely with the business to expand Oxygen hosting to more merchant plans. That shift required a redesigned experience for deployment and performance insights, ensuring any merchant could benefit from a global edge network.
The outcomes
By the time I moved on, Hydrogen and Oxygen were powering some of the most innovative storefronts on the web.
- Design played a central role in accelerating developer onboarding and reducing build time
- Our design system became the backbone of the developer experience across docs, CLI, templates and the Shopify UI
- The redesigned documentation experience improved comprehension, reduced friction and made technical implementation faster for all merchants
- We delivered a cohesive, elegant experience for a highly technical audience at scale
- And we laid the foundation for a faster, more flexible future of commerce
Looking back
This work pushed me and my team in all the right ways. We had to operate at speed, at scale and with an incredibly high technical bar. But we also had the space to define what good looked like — not just for Shopify, but for the wider headless commerce ecosystem.
It’s the kind of work that makes you better. And I’m proud of what we built together.