Donut Shop

A product page with a 3D donut you can turn by hand.

(overview)

A landing page built around one idea: let people turn the product in their hands before they order it.

Date
2026
Stack
Next.js · React Three Fiber · Blender · Motion · Tailwind CSS
Site
Visit ↗

(process)

It started with the donut. I modelled it from scratch in Blender and liked it enough to want a shop around it, so I designed one to match: neo-brutalist hard outlines and flat shadows, with a Y2K streak of magenta and turquoise. I explored several directions in Claude Design and kept refining one until it felt right.

Then I built it in Next.js, mobile first and fully responsive, section by section: the hero, the menu, a cart that slides in as a drawer, and a pill navigation whose motion is the one modern accent on the flat surfaces.

The donut spins on its own until someone grabs it. A mouse or a finger turns it in any direction, and React Three Fiber renders it under studio lighting, with one key light placed by hand.

The Donut Shop cart: five flavours, each with its 3D donut, quantity buttons, and a pink checkout button under the total.
The Donut Shop menu: the heading “Pick your pleasure.” over product cards, each with a 3D donut modelled in Blender, a price and order buttons.

(result)

A live landing page with a donut you can turn by hand and a cart that works on desktop and mobile. Next comes a Supabase backend with login, which I’m building myself.

(next project)Curatory Magazine