DEPLOYMENTS / SUPPLE WEAR
HEADLESS SHOPIFYSupple Wear
A headless Shopify storefront on Hydrogen for a fashion label. Every component is custom — no theme, no compromises — with colocated GraphQL queries, a drawer cart on Hydrogen primitives, and checkout that hands off cleanly to Shopify's hardened flow.
CLIENT
Fashion e-commerce
YEAR
2024
SYSTEMS
WEB
STATUS
DEPLOYED
100%
custom components (zero Shopify theme)
1
codebase — storefront + checkout handoff
0
changes to the admin workflow the team knew
[ THE BRIEF ]
The challenge we walked into.
Off-the-shelf Shopify themes couldn't match the brand's editorial photography direction — every attempt was a fight against theme defaults. The client wanted a storefront that read like their lookbook, with pixel-perfect product cards and a photography-led hero, but they refused to give up Shopify's reliability for payments, inventory and taxes.
[ TOPOLOGY ]
How the system is wired.
// SYSTEM TOPOLOGY
- LAYER 01
Buyer
BROWSER
- LAYER 02
Shopify Oxygen
EDGE HOSTING
- LAYER 03
Hydrogen App
REMIX + RSC
- LAYER 04
Storefront API
GRAPHQL
Image CDN
AVIF / WEBP
- LAYER 05
Shopify Core
PRODUCTS · ORDERS · CHECKOUT
[ WHAT WE SHIPPED ]
Feature by feature.
The storefront reads like the brand's lookbook.
Full-bleed imagery, generous whitespace, product cards that respect the photography. No sidebar filters cluttering the hero, no upsell modals interrupting the browse. Every route was designed against the actual lookbook shoot, not against a theme template.
- ▸Full-bleed image-led hero
- ▸Photography-first cards
- ▸Zero upsell interruptions
- ▸Whitespace as a design element
[ APPROACH ]
How it came together.
01 — HEADLESS DISCIPLINE
Headless without over-engineering.
Every custom-Shopify build risks becoming a snowflake nobody else can maintain. We kept the surface small: Hydrogen defaults where they hold up, custom code only where the brand demanded it. Handovers stay possible; another Hydrogen dev can pick this up cold.
02 — CONTENT, STILL IN SHOPIFY
The team edits products where they always did.
Products, variants, prices, inventory — all in the Shopify admin the team already knew. The storefront just reads. No CMS to learn, no double-entry, no drift between what admin shows and what the site sells. Merchandising doesn't need a developer.
03 — SPEED AND PHOTOGRAPHY TOGETHER
The lookbook loads like a lookbook shouldn't.
Shopify's CDN, AVIF/WebP negotiation, above-the-fold preloading and Oxygen's edge caching mean the photography-led design lands fast. The design isn't apologising for itself with a spinner — it looks luxurious and paints in under a second.
[ DELIVERY ]
What the build looked like.
01 ▊
[ TECH STACK ]
What’s under the hood.
TAP FOR ROLEHOVER FOR ROLE
[ IMPACT ]
What changed.
The brand's storefront finally matches the brand. Editorial photography leads every page, the team still merchandises in the Shopify admin they know, and the codebase is small enough that adding a new landing page is an afternoon — not a theme fork. Payments stay hardened, taxes stay accurate, and the vibe finally reads like the lookbook.