En mi paso por la agencia MACH como proyecto inicial debía dar un cambio completo al sitio web que tenían, era una web antigua realizada con HTML y CSS que carecía de diseño a pesar de mostrar imágenes hermosas de trabajos realizados por la agencia.
Investigación
Mach se centraba principalmente en 3 áreas de servicio: Branding y ATL, BTL, y con mi integración al equipo, el desarrollo y presencia de sitios web y tiendas online.
como metodología usé Design thinking ya que yo era el único integrante del equipo y tenia total libertad por parte de la agencia para crear la nueva web, y su target era enfocado principalmente en empresas de servicios y retail.
Sitemap
Después de la reunión con el director creativo de la agencia y el CEO pudimos definir lo que se necesitaba, La intención era minimizar el proceso de navegación del usuario y transmitir la información importante y relevante de forma moderna y creativa, con eso en mente creé el sitemap lo más reducido posible con simplemente la información necesaria.
Userflow
Al tener definida la información y secciones de la web era el turno de crear la ruta de navegación optima que debería tener el usuario al visitar el sitio y como era muy reducido se pudo lograr un userflow bien establecido centrandose en que el usuario tenga siempre el call to action a mano.
Definida la investigación y rutas pasamos a el prototipado de wireframe para hacer los primeros test internos y revisar que la informacion y navegabilidad cumplieran con su objetivo.
después del test interno y algunos ajustes pasamos al diseño, lo que tenia en mente era un nuevo lenguaje visual moderno y colorido distinto al que se venia manejando muy corporativo y empresarial, en base a eso desarrolle 3 piezas principales para el slider animado que seria la cara principal de la web a los usuarios.
Experiencia y distribución del contenido
luego de exponer de manera breve en el slider los 3 servicios pilares de la agencia le seguían un desglose breve de esos servicios en secciones individuales para que el usuario al hacer scroll conociera de que se trataba el servicio en un párrafo resumen que a su vez tendría un botón para pasar directamente a una nueva pagina donde se explicaría en mas detalles el servicio y se mostraría una galería de imágenes de proyectos realizados en esa área y botones para navegar a las otras áreas sin tener que regresar al home.
Modelado 3D y fotomontajes
para esto desarrolle un personaje en 3D con una cabeza de bombillo, era un personaje que estaba destinado a utilizarse como mascota de la agencia ya que representaba idea y creatividad y se convertiría en la imagen principal del servicio branding.
para el servicio de BTL realicé un fotomontaje con una valla publica y otras piezas que tuvieran relación con el servicio
en cuanto a la sección de web solo diseñé un icono sencillo alusivo al área
Un detalle que me encantó colocar fue la personalización de la pagina interna 404 con la mascota, es una pagina que casi no se ve si la web y la experiencia de usuario esta bien hecha pero que si por alguna razón sale algún error es mejor que salga con estilo.
Maquetación y desarrollo en WordPress
Todo el diseño fue realizado en diversos programas, al tenerlo culminado pasé a la maquetación y desarrollo de la web sobre un WordPress con plantilla blanca para mejor control, personalicé cositas con css y js como posición de elementos, efectos de difuminado y menú para así lograr un resultado increíble.
En conclusión
Es una web en la que me dieron total libertad creativa y tiempo para realizarla lo cual agradezco mucho y todos quedamos muy contento con el resultado, sin duda es mi favorita espero que también te guste.
pueden verla en línea en http://www.agenciamach.com