Artículo del blog

Cómo es DESY en 2024: actualización y futuro del sistema de diseño del Gobierno de Aragón

El sistema de diseño del Gobierno de Aragón, que cubre las necesidades para herramientas de escritorio, portales y apps móviles, ha estrenado en octubre de 2024 una nueva versión del portal, librerías y patrones.

DESY es un sistema de diseño creado en 2021 para mejorar la identificación y la usabilidad de los productos digitales del Gobierno de Aragón. Este sistema está a disposición de SDA · Servicios Digitales de Aragón y de los Departamentos, Organismos y Entidades que necesiten desarrollar herramientas digitales o sitios web.

Los sistemas de diseño son un conjunto de estándares que unifican el aspecto y la forma de interactuar en las webs y aplicaciones, y DESY lo hace en las del Gobierno de Aragón. Esto facilita su uso tanto para el personal público como para la ciudadanía, ya que la experiencia al cambiar entre herramientas o navegar por diferentes webs es más fluida. Conocer “las reglas” con las que funciona el sistema permite a las personas usuarias adaptarse rápidamente a cualquier plataforma.

Usar el sistema de diseño nos ayuda a optimizar recursos y garantizar la usabilidad en la creación de interfaces digitales. Ahorra tiempo y esfuerzo a los equipos de diseño y desarrollo y favorece una experiencia coherente y fluida para todas las personas que las utilicen.

Gracias a su evolución a lo largo de los años, DESY es ahora un sistema de diseño que cubre las necesidades que pueden surgir al diseñar tanto aplicaciones de escritorio como aplicaciones móviles y webs o portales

Un equipo de profesionales del diseño de SDA se ocupa de mantener actualizado y detectar nuevas necesidades en el sistema de diseño. En de octubre de 2024, el portal de DESY se ha actualizado a una nueva versión, incorporando cambios que facilitan identificar las novedades y encontrar los componentes y patrones que cada equipo necesita. 

Qué es DESY, un sistema de diseño en evolución

El desarrollo de DESY comenzó con el rediseño de SEDA, el catálogo de servicios del Gobierno de Aragón. Al detectar la necesidad de un diseño de interfaz para aplicaciones de escritorio, el equipo de diseño de esa herramienta, formado por diseñadores de Fractal Strategy, junto a personal de SDA, propuso que este diseño construyera la base no solo para esta aplicación, sino para otras que se iban a construir más adelante.

Se inició así el desarrollo de una solución global, publicada en abierto. Desde entonces, los equipos que han trabajado en el diseño de herramientas han ido ampliando esta base, creando soluciones que DESY ha incorporado a su biblioteca.

Con su uso en herramientas como MiA, el sistema ha evolucionado también para su uso en móviles, un entorno que conlleva unas interacciones diferentes que las del uso en escritorio. Hoy en día, es el estándar más utilizado en el Gobierno de Aragón y está presente en, al menos, 9 herramientas corporativas internas, 60 aplicaciones departamentales, contabilizadas por AST, y en varios portales. 

Diseño de una aplicación, prototipo para escritorio y móvil
Un ejemplo del diseño de una interfaz para aplicación en escritorio o en móvil. En la versión móvil el diseño es más compacto, se segmenta en pestañas y se sustituye la paginación por un scroll infinito, entre otras diferencias. Es decir, la información es la misma pero el diseño de la interfaz cambia según el dispositivo.

Además, DESY ha evolucionado para ser también un estándar para webs, un entorno más visual que el de las aplicaciones de trabajo interno y para el que se crearon, por ejemplo, cabeceras gráficas, tarjetas con ítems de información o diferentes tipos de menús, definiendo reglas para estos usos, entre otros patrones de página para portales. 

Los componentes y patrones que se usan en estos diferentes contextos pasan a formar parte del sistema, si son valiosos para futuros proyectos, y quedan recogidos en su documentación. Un equipo de diseño dentro de SDA se ocupa de documentar los componentes, identificar nuevas necesidades y recoger sugerencias de otros departamentos o empresas que utilizan DESY. También las revisiones de accesibilidad son una fuente para detectar oportunidades de mejora. Estas necesidades se introducen en un backlog para incorporarlas en futuras versiones del sistema de diseño. 

Ventajas de utilizar DESY en aplicaciones y webs

DESY es una solución global para todo el Gobierno de Aragón. Cuando se utiliza para construir webs y aplicaciones, se garantiza que las personas usuarias van a identificar ese espacio digital como parte de la administración aragonesa. Además, van a tener una experiencia homogénea independientemente de quién haya construido la herramienta que están usando, lo que facilita el aprendizaje y el uso de las mismas

DESY no surgió como un sistema aislado, sino en el contexto de proyectos específicos. Esto significa que se enfoca en la usabilidad y la coherencia y se ha testeado con personas usuarias en el contexto de uso de esas herramientas. En el futuro, además, se van a realizar test específicos con personas con diferentes capacidades y discapacidades.

Hasta la fecha, DESY ha sido utilizado en aplicaciones tan diversas como Gestor de Expedientes, la herramienta transversal de apoyo a la tramitación que utilizan cientos de gestores; la ya mencionada MiA, abierta a toda la ciudadanía; o aplicaciones específicas como la aplicación de rutas de transporte escolar o la web del Registro de Mediadores de Seguros de Aragón. Esta diversidad de aplicaciones es indicador de la versatilidad del sistema de diseño.

Los componentes y patrones de DESY se han documentado en librerías compatibles con varios frameworks como Angular, React o Ionic, así como en gestores de contenido como Liferay o WordPress. Esta flexibilidad permite utilizar el sistema en diferentes entornos, lo que ahorra tiempo de desarrollo, ya que se parte de una base existente.

Aunque el uso de DESY no garantiza por sí solo la accesibilidad (es decir, que el mayor número de personas puedan percibir y operar nuestros productos digitales en cualquier tipo de dispositivo y el cumplimiento de los estándares al respecto) el sistema de diseño está construido teniendo en cuenta los estándares que aplican en el sector público y la documentación de DESY hace especial hincapié en este aspecto.

Por último, la abundante documentación que recoge el portal de DESY supone que a los equipos de diseño y desarrollo les resulta muy fácil empezar a usar DESY, ya que el portal explica el uso de los componentes y patrones y desde allí se puede descargar el código listo para usar. También se pueden consultar otros recursos, como prototipos de herramientas publicados en abierto en Figma o la serie de tutoriales en video ‘De 0 a producción con DESY’.

Próximos pasos en la evolución de DESY

Con la publicación de la versión 3.3.0 del portal, DESY reorganiza la forma en la que se presenta a la comunidad de personas que usan el sistema. La sección de novedades irá informando de los últimos cambios y recursos publicados recientemente.

Entre los próximos pasos en la evolución de DESY, destacan varios hitos:

  • La adaptación de DESY al lenguaje de interacción de dispositivos móviles. Ya se ha realizado una prueba de concepto de DESY Ionic que sirvió para detectar las necesidades del sistema en este lenguaje de interacción. Para dispositivos móviles son necesarias ventanas emergentes, animaciones, elementos fijos (sticky). Este proyecto comenzará a desarrollarse en 2025.
  • Mejora en la usabilidad de la documentación de desy-angular, con su migración a la web, para que los perfiles de desarrollo puedan configurar parámetros de los componentes y ver los cambios en tiempo real con más facilidad. Este proyecto ya tiene una demo.
  • Identificar, clasificar y documentar patrones que resuelvan situaciones comunes a la hora de ayudar, pedir o mostrar información a la persona.
  • La realización de tests de usuarios con personas con discapacidad. Se harán, de nuevo, en el contexto de uso de una herramienta, en este caso MiA, un producto cerrado y definido, dirigido a la ciudadanía y construido con DESY, lo que permitirá testear tanto el sistema de diseño como las áreas y funcionalidades que contiene MiA, que aspira a ser el punto único de relación electrónica con el Gobierno de Aragón. Para ello, convocando a las entidades sociales y a personas con capacidades diversas, testearemos y mejoraremos esta interacción entre la Administración y estos colectivos en el entorno digital/electrónico.
  • Se seguirá probando el uso de DESY como sistema de diseño para los diferentes puntos de contacto, también en elementos estáticos e impresos como cartas de pago, guías en PDF o documentos normalizados, como las resoluciones, usando DESY como punto de partida para la definición de la paleta de color, tipografías y resto de estilos. 

El objetivo es que DESY siga siendo la principal referencia para el diseño de herramientas digitales del Gobierno de Aragón. Para ello, está siendo fundamental el esfuerzo de todos los equipos que lo utilizan y el compromiso de los Servicios que, al rediseñar o construir herramientas con DESY, están contribuyendo a mejorar la experiencia de todas las personas al relacionarse con los servicios del Gobierno de Aragón. 

¿Te ha resultado útil esta página?

Tu respuesta nos ayudará a mejorar la web

Gracias por tu valoración

Para cualquier consulta, escríbenos a portalpublico@aragon.es

Puedes dejar aquí tu comentario anónimo.