AD Network Launch
Mi equipo contribuyó a la campaña de lanzamiento de una nueva red de espacios publicitarios que forma parte de un gran conglomerado diseñando su landing page. Tuvimos mucha libertad creativa para ilustrar la imagen divertida y vanguardista que la marca quería dar para su lanzamiento.
Desarrollo de conceptos
Al comienzo de nuestra colaboración con CMI, el brief era relativamente abierto y se centraba principalmente en los requisitos de contenido. Como un proyecto nuevo, que aspiraba a causar un impacto con su debut, carecía de pautas de branding. Nuestras propuestas iniciales tenían como objetivo combinar el logotipo existente con un esquema de color complementario alineado con la marca del grupo empresarial. Ante la ausencia de fotografías de alta calidad que mostraran sus espacios publicitarios, propusimos generar assets a la medida. Utilizando una retícula isométrica, busqué ilustrar representaciones de sus productos. Este marco me permitó tener flexibilidad en el nivel de detalle, perspectiva y proporciones, mientras evocaba el contexto urbano que habitan estos espacios publicitarios.
Propuestas iniciales, incluida la que desarrolló más iteraciones posteriores (en el medio de la imagen).
A partir de las propuestas iniciales, el concepto de una landing page de altura completa con una ilustración de la ciudad de fondo resonó fuertemente con la imagen de marca que CMI buscaba proyectar. Su receptividad me inspiró a explorar el construir el paisaje a partir de una cuadrícula isométrica, proponiendo la integración de un carrusel sin interrupciones con animaciones sutiles. Colaboré estrechamente con el equipo de desarrollo para hacer realidad esta visión. Si bien fue un desafío técnico, nuestros esfuerzos concertados y nuestro enfoque estratégico aseguraron la viabilidad de esta propuesta visual.
Maqueta de animación para una presentación con el cliente.
Para mejorar el rendimiento de la animación, adoptamos una estrategia inspirada en la industria de los videojuegos, separando los elementos de fondo y de primer plano en grandes hojas de sprites. Además, incorporamos pequeñas animaciones GIF en algunos sprites para elevar la complejidad de las animaciones.
Algunas de las hojas de sprites que usamos combinadas
Finalización y Optimización para Móvil
En la fase final, colaboramos estrechamente con el equipo de CMI para definir la estructura del contenido. A cada sección se le asignó un color de fondo distinto, que sirvió como un hilo visual coherente en todas las páginas de contenido interiores. Siguiendo las convenciones comunes de diseño de carrusel, integramos elementos de navegación intuitivos como flechas y una barra de navegación inferior con etiquetas. Además, agregamos flechas interactivas desplegables para facilitar el acceso fluido a todo el contenido, incluyendo un enlace directo a su presentación en video.
.jpg "Final proposal")
Priorizando la compatibilidad móvil, desarrollamos una versión alternativa del diseño de altura completa optimizada para la capacidad de desplazamiento. Manteniendo la ilustración original como un banner Hero estático, preservamos la continuidad visual y adaptamos el diseño para adaptarlo a las preferencias de visualización en dispositivos móviles.
.jpg "Mobile")
Impacto posterior
El lanzamiento del sitio web resultó un gran éxito y sirvió como piedra angular de su campaña de lanzamiento. Nuestro diseño no solo obtuvo elogios sino que también formó la base para más materiales promocionales. Aprovechando los gráficos y las pautas visuales que creamos, integraron nuestros diseños en varios medios, incluidas visualizaciones en pantallas dentro de sus espacios publicitarios.
