CASE STUDY / 01
INPROTECH GUARDIAN
Hacer visible lo invisible.
Diseño UX/UI para una plataforma de ciberseguridad industrial que transforma datos técnicos, dispositivos y conexiones en una experiencia de exploración y monitorización.
01 / INTRO
Diseñar para entender lo complejo.
Guardian es una plataforma de ciberseguridad industrial que permite identificar activos conectados, visualizar las comunicaciones de una red y monitorizar eventos y amenazas.
El desafío de diseño consiste en trasladar información altamente especializada a una interfaz que permita comprender el estado de una infraestructura, explorar sus componentes y acceder al detalle cuando sea necesario.
Mi aportación se centró en el diseño UX/UI del producto, trabajando la organización de la información, las jerarquías visuales y la experiencia de navegación.
02 / RETO
La complejidad no desaparece. Se organiza.
Las redes industriales reúnen dispositivos, protocolos, conexiones y eventos que generan información de distinta naturaleza.
Para quienes supervisan estas infraestructuras, no basta con acceder a los datos. Es necesario entender las relaciones entre los activos, reconocer situaciones relevantes y profundizar en los elementos que requieren atención.
El reto era conciliar tres necesidades: visibilidad global, exploración detallada y acceso claro a los eventos de seguridad.
03 / ENFOQUE
Tres necesidades. Un mismo sistema.
La propuesta de interfaz se articula alrededor de tres necesidades que requieren diferentes maneras de presentar y recorrer la información.
01
Visibilidad
Entender el estado general de la infraestructura y localizar la información principal desde una visión global.
02
Contexto
Explorar dispositivos y comunicaciones sin perder de vista las relaciones que existen dentro de la red.
03
Prioridad
Organizar eventos y alertas para facilitar su identificación, clasificación y consulta.
04 / SOLUCION
Del conjunto al detalle.
La experiencia se organiza en diferentes niveles de información. Cada área del producto responde a una tarea específica y utiliza los patrones de interfaz más adecuados para ella.
4.1 / DASHBOARD
Una visión global para empezar a entender.
El dashboard reúne indicadores y visualizaciones que ofrecen una primera lectura del estado de la red industrial.
La jerarquía de la información facilita identificar los datos principales y reconocer las áreas que requieren una consulta más detallada.
Una visión general debe orientar, no concentrar toda la complejidad.
4.2 / MAPA DE RED
De los datos a las relaciones.
La topología permite representar los dispositivos de la red y las conexiones existentes entre ellos.
La exploración visual aporta una perspectiva diferente a los listados: permite comprender la estructura general, identificar elementos concretos y consultar sus relaciones dentro del sistema.
Mantener el contexto mientras se profundiza en el detalle.
4.3 / GESTIÓN DE ALERTAS
Identificar lo importante. Profundizar cuando importa.
La gestión de eventos de seguridad exige un modelo de navegación diferente al mapa de red.
Los listados y las jerarquías permiten revisar alertas, interpretar sus niveles de severidad y acceder a información detallada.
El diseño debe priorizar la legibilidad, la consistencia entre estados y la facilidad de consulta.
Distintas tareas necesitan distintas formas de organizar la información.
05 / SISTEMA
Diferentes vistas. Una misma lógica.
Un producto complejo necesita adaptarse a distintas tareas sin perder coherencia.
Dashboard, topología y alertas utilizan estructuras específicas, pero deben compartir un lenguaje reconocible: navegación, tipografía, componentes, estados y criterios de jerarquía.
La consistencia permite que la experiencia resulte familiar incluso cuando cambia la naturaleza de la información.
06 / CONCLUSIONES
La claridad también es una funcionalidad.
Diseñar productos para entornos técnicos exige algo más que simplificar una interfaz.
Significa entender cómo se relaciona la información, qué necesita consultar el usuario y cómo puede recorrer diferentes niveles de complejidad sin perder el contexto.
En Guardian, el diseño de la experiencia aborda estas necesidades desde tres perspectivas complementarias: visión global, exploración de relaciones y gestión de eventos.
Diseñar sistemas complejos no consiste en ocultar su complejidad, sino en hacerla comprensible.