Demo · 2026
Café Jardón
A made-up coffee shop in Gijón to show what 3D and motion can do on a site that also works: you build your coffee and place the order.
- Role
- Design, 3D and development
- Year
- 2026
- Stack
- Astro
- TypeScript
- Three.js
- GSAP
- Lenis
The challenge
Keeping a motion-heavy site easy to read, fast on mobile and actually useful, not just pretty.
What I did
- 3D scene modelled in code with Three.js: branded cups and a coffee bean that cracks and tears the screen.
- Every drink in its real vessel (espresso in a demitasse, latte in a glass, Chemex for filter), researched before modelling.
- "Build your coffee" configurator with live pricing and an order saved in the browser.
- A dedicated mobile layout: the 3D measures the free space so it never covers text.
Outcome
Live on my domain and on GitHub Pages, deployed automatically on every change.