Celso Marrero
Un portfolio fotográfico premiado que se inspira en el agua para dar movimiento a cada imagen.
Reconocimientos
La fotografía, primero.
Celso Marrero, fotógrafo de campañas para Nike, Marc Jacobs y Chanel, necesitaba un portfolio donde la fotografía guiara el recorrido entre galerías y proyectos.
A partir del diseño de Naiara Odriozola, desarrollamos la web, sus transiciones y un gestor para que pudiera publicar y organizar su trabajo.
Fluida como el agua.
Al elegir una fotografía, esta crece hasta convertirse en la portada del proyecto. Las imágenes responden al scroll y al cursor con una ondulación de agua calculada en tiempo real con WebGL, conectando las galerías en un recorrido continuo.
El portfolio, en sus manos.
Celso publica nuevos trabajos sin tocar una línea de código, reordena los proyectos arrastrándolos y compone cada galería desde un editor visual. Al publicar, la web se actualiza sola en segundos.
La vista previa muestra la composición antes de publicarla y permite ajustar el encuadre de cada foto. Preparamos también un manual de uso para que pueda mantener el portfolio al día.
Tres idiomas. Una mirada.
El portfolio se publica en inglés, italiano y francés. Cada versión tiene sus propias direcciones, títulos y descripciones para atraer clientes en Milán y París.
Los contenidos de los tres idiomas se editan desde el mismo gestor, manteniendo el diseño y la navegación del portfolio en todas las versiones.
El mismo pulso. También en móvil.
Adaptamos la composición, el menú y los gestos a la pantalla vertical para conservar el ritmo del portfolio.
Cada imagen se sirve al tamaño adecuado para mantener el detalle y ajustar su peso a cada pantalla.
Bajo la
superficie.
El desarrollo también cuida lo que no se ve: imágenes adaptadas a cada pantalla, publicación desde el gestor y una estructura preparada para buscadores en tres idiomas.
- Proyectos
- 51
- Fotografías
- 220+
- Idiomas
- 3
- Páginas indexables
- 174
- Next.js · React · TypeScript
- Páginas pregeneradas y una estructura preparada para crecer con el portfolio.
- WebGL
- Ondulaciones y transiciones que responden al scroll y al cursor.
- Framer Motion · Lenis
- Animación de la interfaz y desplazamiento suave.
- Sanity
- Gestor de contenidos adaptado a la composición de sus galerías.
- Vercel
- Publicación y actualización de la web al cambiar el contenido.
- SEO técnico e internacional
- Direcciones por idioma, metadatos, datos estructurados y mapa del sitio.
Créditos.
Ingeniería × Diseño.
Para el siguiente paso.