Proaton es una empresa especializada en soluciones tecnológicas avanzadas para el sector marítimo y portuario: desde equipamiento de señalización marítima hasta sistemas de gestión de tráfico de embarcaciones (VTS/VTMIS) y plataformas de visualización de datos como ZEUS. Su tecnología opera en entornos críticos donde la precisión y la seguridad son innegociables.
Sin embargo, su presencia digital no estaba a la altura de esa sofisticación tecnológica. Comunicar un ecosistema de soluciones tan complejo y especializado en una web es un reto de UX real: el usuario — un director de puerto, un gestor de tráfico marítimo o un responsable de compras de una naviera — necesita entender rápidamente qué hace Proaton, qué solución se aplica a su necesidad concreta y por qué Proaton es el socio tecnológico adecuado. Una web que no resuelva esa pregunta en los primeros segundos pierde al usuario antes de que llegue a contactar.
Lideré el proceso completo de diseño y desarrollo: desde el análisis inicial y la definición de la arquitectura de información, hasta el prototipado en alta fidelidad en Figma y la implementación en WordPress. El reto de diseño central era traducir un portfolio tecnológico muy especializado — VTS, VTMIS, ZEUS, ayudas a la navegación — en una experiencia web clara, moderna y accesible para perfiles técnicos y directivos del sector marítimo y portuario, sin sacrificar la profundidad ni la credibilidad técnica que ese público exige.
Fase 1 — Research y análisis
El primer paso fue entender el lenguaje visual y comunicativo del sector marítimo y portuario tecnológico. Analicé cómo comunican empresas de referencia en soluciones de tráfico marítimo, navegación y tecnología portuaria, identificando los estándares visuales que generan credibilidad en ese público: paletas oscuras y tecnológicas, iconografía precisa, jerarquía de información muy clara y un tono que equilibra autoridad técnica con accesibilidad.
También identifiqué el problema más común en webs de empresas tecnológicas B2B especializadas: intentar explicarlo todo a la vez, creando páginas densas donde el usuario se pierde antes de entender el valor real. Eso definió la prioridad de diseño — claridad y jerarquía por encima de exhaustividad.
Fase 2 — Arquitectura de información y wireframes
Con los insights del research, definí la estructura de la web en torno a una pregunta central: ¿cómo organizar un ecosistema de soluciones tan diverso — señalización, VTS, VTMIS, ZEUS, soluciones portuarias — para que el usuario encuentre su solución sin perderse?
La respuesta fue organizar los contenidos por líneas de solución claramente diferenciadas, con una entrada común que comunicara primero el ecosistema completo y luego permitiera profundizar en cada área. Esta arquitectura respeta la complejidad técnica de Proaton sin abrumar al usuario desde el primer clic.
Fase 3 — Prototipo en alta fidelidad
Diseñé los wireframes focalizando la atención en cómo presentar cada solución tecnológica de forma que un director de puerto o gestor de tráfico marítimo la identificara con su necesidad real en segundos. En esta fase tomé decisiones clave sobre la jerarquía de cada página de solución: primero el problema que resuelve, luego cómo lo resuelve, y finalmente los detalles técnicos para el perfil más especializado.
Fase 4 — Desarrollo e implementación
Con la estructura validada, desarrollé el prototipo visual completo en Figma. La paleta azul marino tecnológica fue la elección natural para el sector — transmite precisión, fiabilidad y autoridad técnica, conectando visualmente con el entorno marítimo sin caer en los clichés del sector. Cada decisión visual refuerza la percepción de Proaton como socio tecnológico de primer nivel para infraestructuras críticas.
El sistema de componentes desarrollado en Figma permitió mantener coherencia visual entre todas las páginas de solución — señalización, VTS, VTMIS, ZEUS y soluciones portuarias — garantizando que la marca se percibiera como un ecosistema unificado, no como un catálogo de productos inconexos.
Fase 5 — Desarrollo e implementación
Con el prototipo aprobado, implementé el diseño en WordPress asegurando que la experiencia visual se trasladara fielmente al producto final, con especial atención al rendimiento — en webs B2B especializadas, la velocidad de carga es un factor directo de credibilidad ante un perfil de usuario técnico y exigente.
Proaton cuenta ahora con una plataforma digital que refleja la sofisticación de su tecnología y comunica con claridad su ecosistema completo de soluciones — desde la señalización marítima hasta los sistemas VTS/VTMIS y la plataforma ZEUS — en una experiencia coherente y accesible para su público objetivo. La web posiciona a Proaton como el socio tecnológico de referencia para el sector marítimo y portuario, con una presencia digital a la altura de la criticidad de los entornos en los que opera.
Prototipado • UX|UI
Programación • Web • Gestión
construcción • web
productividad • Organización
edición • imágenes
ilustración • vector
maquetación • publicaciones
video • edición
animación • efectos