Jimbo's Hot Sauce

Jimbo's is a fictional hot sauce brand Nova built end to end to show what a small-batch storefront looks like when every part of it is made rather than bought. Brand mark, label system, product photography, storefront, product pages with quantity pricing, an interactive heat index and a working cart — all of it produced in-house. Nothing here is a template, and nothing is a stock photo.

Why this exists

Most storefront pitches show you a theme with someone else's products dropped into it. We wanted to show the opposite: a complete brand and shop, invented from nothing, so you can judge the craft rather than the demo data. Jimbo's is fictional. The brand mark, the seven labels, the bottle photography, the copy and the code were all produced by Nova.

What's in the build

• Brand identity — retro diner wordmark, a navy / cream / red palette, and a label system applied consistently across seven products
• Product photography — every bottle shot, cut out and colour-matched, plus bundle compositions and lifestyle imagery
• Storefront — hero, best sellers rail, bundles, founder story, reviews and newsletter capture
• Product pages — a 1 / 3 / 5 pack selector where prices are derived from one discount value, so an advertised saving can never drift from the total charged
• The heat index — an interactive scale of the whole range. On desktop you hover; on touch the scroll position itself is the control, so sliding your thumb turns up the heat and the readout, colour and marker follow
• A real cart — shared reactive state, quantity controls, live subtotal and free-shipping threshold

How it's engineered

Laravel 13 serves a single shell; the whole storefront is a Vue 3 SPA with history routing, styled with Tailwind v4 design tokens. Built assets are committed, so a deploy never runs a package install on the server and can't half-ship. There's no database behind it — sessions and cache run off the filesystem, which keeps the whole thing cheap to host and near-impossible to break.

Considered details

• Motion is opt-in: every entrance animation sits behind prefers-reduced-motion, and elements default to their finished state, so nothing can be left invisible
• The hero bottle breaks up over the sticky header, then clears it on scroll rather than drifting across the navigation
• Layout is decided by breakpoints, not content width, so a short product name and a long one lay out identically
• Keyboard focus, skip links and full responsive behaviour down to 390px