Copper Magnolia — concept build

A concept build, not client work: Copper Magnolia is a fictional Southern kitchen in Atlanta's Old Fourth Ward, invented so we could show what direct online ordering looks like when it is built properly.

The pitch for a restaurant is not the website. It is the money. A delivery marketplace keeps roughly 30% of every order, so the first thing on the page is a calculator with three sliders — orders a week, average order, commission rate — and a live figure for what that costs. Two things about it matter more than how it looks: every input is adjustable, including the commission rate, because an owner does not believe a number they cannot change; and the result subtracts its own costs, card processing and the price of the site, before it claims a saving. Below about twenty-five orders a week the calculator says the site is not worth it. One that could only ever say yes would be a sales prop.

The WebGL hero is that same arithmetic made physical: a stream of orders flows in, the commission share peels away and fades out red, the rest arrive gold — and the calculator drives it, so dragging the commission slider visibly closes the leak. One draw call, no textures, no model files, and it never touches the critical path.

The store is real. Fourteen dishes across five categories, a cart that persists across pages, live totals with Atlanta sales tax, and a checkout that carries the order through. What is deliberately not real is the payment: there is no card field and no Stripe key, and the page says so rather than pretending to take money. Both forms validate and then state plainly that nothing was sent or stored — a fictional restaurant collecting real names and phone numbers would be a real problem.

Measured with Lighthouse on the production build, mobile: 100 performance, 100 accessibility and 100 best practices on six of the seven pages (the store scores 99), with zero layout shift everywhere. The site is marked noindex on purpose — an invented restaurant should not appear in search beside real ones — which is the only thing holding its SEO score down; with indexing enabled it scores 92.