Lumina Coffee Co.
A clearly labeled fictional coffee storefront built from a simulated product brief, including product browsing, cart state, locations, and ordering flows.
A premium storefront, end to end.
Lumina is a concept demo: a fictional specialty-coffee brand, built to show a complete e-commerce experience — not a template, but a real storefront with its own point of view.
The brief I set myself: make it feel premium and cinematic, but keep it fast and fully responsive.
Shop, cart, locations, ordering.
A full marketing-plus-commerce site: a hero, a kinetic product carousel, a shop with a product modal, a locations page, an online-order flow, and a slide-in cart drawer with real item management.
It runs in its own dark zinc-and-amber identity, deliberately different from the rest of my work — range is the point.
Choreography, fast.
I designed the system — a custom Tailwind palette and a set of Framer Motion patterns — then directed the build section by section, tuning the motion and layered visuals against the simulated brief.
“From product concept to a tested demonstration, the work remained subject to human review.”
Next.js, Tailwind, Framer Motion.
Built on the Next.js App Router with a custom Tailwind design system and choreographed Framer Motion animations. Cart state runs through React Context with a dynamically-loaded drawer.
A full, animated storefront designed as a cohesive fictional product.
A clearly labeled simulation that demonstrates deliberate interaction design and front-end implementation.