Demo · 2026
Café Jardón
Una cafetería ficticia de Gijón para enseñar lo que se puede hacer con 3D y animación en una web que, además, funciona: eliges tu café y haces el pedido.
- Rol
- Diseño, 3D y desarrollo
- Año
- 2026
- Stack
- Astro
- TypeScript
- Three.js
- GSAP
- Lenis
El reto
Que una web con mucho movimiento siga siendo fácil de leer, rápida en móvil y útil, no solo bonita.
Qué hice
- Escena 3D modelada por código con Three.js: vasos con el logo, un grano que se parte y rasga la pantalla.
- Cada bebida en su recipiente real (espresso en demitasse, latte en vaso, Chemex para el filtro), documentado antes de modelarlo.
- Configurador "Hazte tu café" con precio en vivo y pedido guardado en el navegador.
- Versión móvil propia: el 3D se coloca midiendo el hueco libre para no tapar nunca el texto.
Resultado
Publicada en mi dominio y en GitHub Pages, con despliegue automático en cada cambio.