Resumen del proyecto
HINO Trucks necesitaba un sitio web corporativo para el mercado estadounidense alineado con sus estándares de marca globales, capaz de sostenerse a la vez como un producto digital moderno y seguro. El proyecto se desarrolló íntegramente en remoto con un equipo multidisciplinar de diseñadores, desarrolladores, estrategas, copywriters y direcciones creativas. Mi rol se concentró en el diseño de UI: traducir los manuales de marca y los estándares web a una experiencia clara, funcional y consistente en toda la plataforma.
Reto creativo
La presencia existente estaba fragmentada en plantillas regionales y patrones heredados, lo que hacía que la marca se leyera inconsistente y desactualizada frente a sus competidores internacionales. El equipo necesitaba un lenguaje de UI unificado capaz de soportar información densa de producto —gamas de camiones, fichas técnicas, herramientas para concesionarios y contenido corporativo— sin perder la precisión y credibilidad propias de un fabricante global. El reto era respetar estrictamente la marca y, al mismo tiempo, entregar un sistema de interfaz escalable que el equipo interno pudiera hacer crecer en el tiempo.
Solución de diseño
La interfaz se apoya en una retícula estricta, una jerarquía tipográfica fuerte y una paleta corporativa contenida que cede el protagonismo a las imágenes de producto. Navegación, páginas de producto y flujos de concesionario comparten los mismos bloques modulares, así contenido editorial, configuradores y secciones de soporte se perciben como un único producto y no como sitios separados. El sistema es plenamente responsive —desktop, tablet y móvil comparten los mismos bloques, reajustados en cada breakpoint— y se entrega con patrones documentados que el equipo interno puede extender sin romper la marca.
Resultados e impacto
La plataforma se lanzó como una base escalable y profesional para HINO en EE. UU.: una voz de marca más clara, rutas más cortas del landing al concesionario y un sistema de UI que el equipo interno puede seguir evolucionando. Stakeholders aprobaron una única fuente de verdad para componentes y aplicación de marca, y el flujo remoto y multidisciplinar quedó como modelo de referencia para despliegues regionales posteriores.
Proceso
Trabajamos en Figma con ceremonias remotas semanales, combinando sprints Agile con prácticas Lean y Six Sigma para mantener alcance, calidad y comunicación bajo control. Estrategia y copy avanzaron junto con la exploración de UI desde el primer día, de modo que wireframes, contenido y decisiones visuales maduraron en paralelo y no en cadena. Componentes, estados y reglas responsive se definieron como librería compartida, revisada con desarrollo y dirección creativa en la misma sesión y validada contra el manual de marca antes de cerrar cualquier pantalla.
Herramientas
- Figma
- Adobe Illustrator
- Adobe Photoshop
- Notion
- Jira
