Kiln & Crema — coffee shop launch with a scroll-driven roast
MrShortFlow - ShortFlowOne
Published
Live site: https://www.twine.net/signin
A shop launch page for a small-batch coffee roastery (fictional brand), designed and built by ShortFlowOne as a showcase project.
The idea: let people feel the roast before they buy. A sticky section turns scrolling into a 12-minute roast: the bean changes colour from green to dark brown, bean temperature and roast time count up, the roast curve draws itself and the bean “cracks” at first crack. Below it, a two-slider flavour matcher picks the right bag and explains why.
Also included: product range with filter and a working demo cart, a subscription builder with live pricing, and a brew guide.
My role: concept, design, copy, front-end build (HTML, CSS, vanilla JavaScript, SVG), responsive and reduced-motion checks, deployment.