Landing page - La Matera
Rediseño completo de la web de un restaurante argentino en la ciudad de Guadalajara
La Matera fue mi primer proyecto freelance real: un rediseño completo del sitio web para un restaurante argentino en Guadalajara con gran tradición en la ciudad. El objetivo principal era crear una experiencia web más atractiva y moderna que mejorara la comunicación de los platillos hacia los clientes, generando mayor engagement.
Un diseño para envolver la escencia del lugar, para esto usamos un video en todo el hero que se adapta bien con la idea de las particuylas del humo en la seccion que esta por debajo. menú digital organizado por categorías (empanadas, carnes, mariscos, postres), sección de eventos con carrusel informativo, y efectos visuales 3D con partículas de humo usando Three.js que dan profundidad y atmósfera al restaurante, cabe mencionar que este efecto fue adaptado de la comunidad de @Midudev.
Tecnologías Utilizadas
-
Astro: Framework principal con renderizado del lado del servidor ideal para esta landing
-
Tailwind CSS: Diseño responsivo mobile-first con máscaras degradadas, efectos de luces de fondo y transiciones suaves entre secciones. El diseño en mobile esta inspirado en la zona interior del restaurante, 2 diseños diferentes para mobile y desktop.
-
Three.js: Implementación de efecto de humo con partículas 3D en el fondo que da profundidad y atmósfera al sitio.
-
Optimización de imágenes: Todo el sitio usa formato WebP para mejor rendimiento y tiempos de carga optimizados.
Implementaciones
- Video hero en la portada con presentación impactante del restaurante y CTA directo a WhatsApp para reservas.
- Menú digital completo organizado por 9 categorías (empanadas, pizzas, entradas, ensaladas, pastas, carnes, mariscos, pollo, postres).
- Efecto de humo 3D con Three.js adaptado de la comunidad de Midudev, creando animación de partículas continua en el fondo.
- Diseño responsive con mobile-first, navegación adaptable (menú hamburguesa en móvil) y carruseles horizontales optimizados para touch.
- Sistema de reservas integrado vía WhatsApp con CTAs estratégicos en todo el sitio.