Streetwear and sneaker store
The store for a streetwear and sneaker brand that sells limited runs in numbered drops: a drop calendar with countdowns, a fair pre-queue, a size guide, back-in-stock alerts and one-tap checkout, and at zero the page cuts from black to green.
Whose need
For a streetwear brand, the moment that matters is the drop: thousands of people on the same page in the same second, and the product gone in minutes. In that second the store has to stay up and play fair; if bots get in first and real customers get nothing, the brand pays for it. On every other day the same site has to carry the brand's voice: the lookbook, the collection, the right size, and a way back to the pair you missed.
What I built
I built Knurl's store from the brand's own texture: the crosshatch knurl machined into metal shows up in the logo, on sold-out sizes and in the cut at drop time, and the page moves between black asphalt and saturated Grip Green. The drop calendar shows every upcoming drop with its countdown, and a reminder is one tap away. Ten minutes before a drop the pre-queue opens; at 12:00 places in line are handed out at random, and the clock runs on server time. When the countdown hits zero, the page cuts diagonally to green, the shoe lands and the saved size is already selected. A pair in the bag is held for ten minutes, and checkout is one tap with a saved card. From lookbook to product and from size guide to restock alert, the whole flow is just as fast on a phone.
The flow
- Customers see the next drop on the calendar and set a reminder in one tap.
- The size guide turns foot length into a size and saves it; a sold-out size takes a "Notify me" for restock alerts.
- Lookbook and collection pages filter by the customer's size; items go into the bag.
- Ten minutes before the drop a notification arrives; the customer joins the pre-queue and gets a random place at 12:00.
- At zero the page opens up; the size is preselected, the pair is held for ten minutes, and checkout takes one tap.
Key decisions
A drop is a fair line, not a race
Cloudflare Waiting Room opens a pre-queue ten minutes before the drop and shuffles it at 12:00, so everyone who shows up on time gets the same chance, not whoever refreshes fastest. Turnstile keeps bots at the door, and the one-pair-per-customer rule is enforced on the server.
Every pair is held atomically
Each variant's stock lives in a Durable Object; a pair in the bag is reserved for ten minutes and passes to the next person in line when the hold expires. Checkout is created only for held items, so the same pair can never be sold twice.
The store comes from the brand
The crosshatch texture, page-wide condensed headlines and the two surfaces, black and green, speak the same language on every screen. Product photography follows a single art direction: green seamless, hard flash, crisp shadows. Visitors who prefer reduced motion get the drop moment in a single frame with the same information.
Speed starts on the server
The Hydrogen storefront renders on the server with React Router 7 and runs on Cloudflare Workers close to every customer; products and stock come from the Storefront API, the lookbook and drop copy from Sanity. When stock changes, Shopify Flow and Klaviyo send SMS, email and push to everyone waiting.
Technology
- Shopify Hydrogen
- React Router 7
- TypeScript
- Storefront API
- Sanity
- Cloudflare Workers
- Durable Objects
- Cloudflare Waiting Room
- Klaviyo
- GSAP
Screens
Related serviceWeb experiences
Need something similar?
Tell me in a few sentences what you want to build.
Start a project