Hace unos meses os introducimos en los Sistemas de Diseño. En este segundo artículo de la serie, veremos cómo en apenas un año han evolucionado para mejorar y escalar a los productos digitales. Impactando en todos los departamentos de la compañía, desde desarrollo hasta marketing y ventas.
Además, en próximos artículos hablaremos en detalle de qué aportan, cómo se construyen y cómo ayudan a la marca y su consistencia, así como la experiencia omnicanal de los usuarios.
Cada vez más empresas mejoran los procesos de creación en sus propios productos digitales, convirtiendo a los Sistemas de Diseño en su principal fortaleza. Generando consistencia y coherencia en sus productos, además de facilitar la rapidez en su evolución y escalabilidad.
Desde IBM con Carbon, pasando por Google con Material Design o Microsoft con Fluent, todas las grandes compañías comenzaron a basar sus productos digitales en sistemas de diseño, dando mayor robustez a sus productos.
Cada vez más empresas mejoran los procesos de creación en sus propios productos digitales, convirtiendo a los Sistemas de Diseño en su principal fortaleza. Generando consistencia y coherencia en sus productos, además de facilitar la rapidez en su evolución y escalabilidad.
Desde IBM con Carbon, pasando por Google con Material Design o Microsoft con Fluent, todas las grandes compañías comenzaron a basar sus productos digitales en sistemas de diseño, dando mayor robustez a sus productos.
Recordemos, ¿Qué es un Sistema de Diseño?
Para Nielsen Norman Group, empresa estadounidense de consultoría en interfaz de usuario y experiencia de usuario, un Sistema de Diseño es un conjunto de patrones destinados a gestionar y escalar el diseño de un producto digital. Utilizando patrones reutilizables guiados por una documentación clara de su uso y diseño.Por ello, gracias a los Sistemas de Diseño se acelera el proceso de construcción, entrega e iteración, mientras se mejora la calidad del producto. Su principal valor es facilitar el trabajo de los equipos implicados en la creación y desarrollo del producto.
Es una herramienta viva y flexible. Evoluciona a la vez que maduran los productos que se crean con ella, siempre teniendo en cuenta las necesidades de los usuarios.
Los usuarios serán los encargados de darnos la información necesaria, mediante métricas de producto, para evolucionar el Sistema de Diseño y a su vez mejorarlo y escalarlo. Por ello, la buena comunicación entre los departamentos de diseño de producto y analítica es fundamental para la buena evolución del Sistema de Diseño y a su vez del producto digital que se construye con él.
No olvidemos que un Sistema de Diseño es una herramienta colaborativa. Se crea con la ayuda de todos los implicados en la creación del producto, desde diseñadores, desarrolladores, necesidades de negocio y sobre todo la opinión de los usuarios. Por ello, es importante hacer partícipe a todos de la creación y evolución del Sistema de Diseño.
¿Qué valor aporta?
Los sistemas de diseño garantizan la consistencia de los productos que creamos con ellos. Esto acorta los tiempos de ideación, desarrollo y elaboración del producto mejorando la experiencia de los usuarios del producto que se crea con él.Además, los sistemas de diseño son una herramienta básica para crear productos escalables y que puedan crecer de una manera rápida y ordenada. Y por último nos permite dedicar más tiempo a pensar en el producto, ya que muchos de los detalles del producto estarán atados al crear un buen Sistema de Diseño en el que los componentes se relacionan perfectamente unos con otros.
Librerías Vs Sistemas de diseño
Debemos diferenciar a un Sistema de Diseño de una librería de interfaz de usuario. Las librerías son una serie de elementos estáticos que sirven de guía de diseño, su uso suele ser exclusivo para diseñadores.En ellas podemos encontrar los componentes que forman nuestro producto y los estados que estos pueden tener. Normalmente organizados con una metodología de diseño atómico (átomos, moléculas, organismos y sistemas).
Estos Kit de UI, como también nos referimos a las librerías, suelen estar organizados en los herramientas que utilizamos los diseñadores de producto en nuestro día a día, Figma, Sketch o Adobe XD.
Mientras que un Sistema de Diseño es mucho más que una librería. No es un documento estático en el que consultar cuál es el aspecto de cada elemento. Se compone de un lenguaje común, principios y herramientas que nos ayudarán a construir productos coherentes.
Además suelen ser un producto digital en sí mismo, creado en un site donde se documenta esa librería estática de la que partíamos. Este site, es accesible para cualquier perfil de la compañía involucrado en el producto. Desde diseñadores, desarrolladores y perfiles de marketing y negocio.
Además es un elemento vivo, ya que está en continuo cambio y todas las personas de la compañía pueden consultarlo en cualquier momento.
Gracias a los Sistemas de Diseño podemos conocer en profundidad cómo cada componente interactúa con el resto de componentes que forman el producto. Entendiendo cuales son las reglas del producto, sus limitaciones y cómo se implementará tanto el código de su desarrollo como el diseño de su interfaz de usuario.
Para los desarrolladores es un buen punto de encuentro con el equipo de diseño. Allí podrán encontrar todos los estados que puede tener un componente, con su código tokenizado para que su labor sea mucho más sencilla.
Conclusiones
En los siguientes artículos os contaremos más sobre cómo y cuándo construirlos, nomenclaturas, estructuras, etc junto con los equipos de negocio y desarrollo, herramientas para publicarlos, cómo velan por la marca y la experiencia multicanal, o como se expanden a cualquier interfaz, ya sea voz o el metaverso…Si quieres conocer un poco más este tema por aquí te dejamos 5 de los que probablemente son los mejores Sistemas de Diseño de grandes compañías:
- Material Design de Google: https://material.io/
- Carbon de IBM: https://www.carbondesignsystem.com/
- Atlassian Design System de Atlassian: https://atlassian.design/
- Spotify Design de Spotify: https://spotify.design/
- Fluent de Microsoft: https://www.microsoft.com/design/fluent/#/
Y por último una de las grandes novedades, Sistemas de Diseño de ciudades. Con ellos las grandes ciudades están consiguiendo consistencia en todas sus comunicaciones y señaléticas, por ejemplo el estado de California: https://designsystem.webstandards.ca.gov/
¿Quieres que te ayudemos con el tuyo? En HABITANT somos especialistas en Sistemas de Diseño y en escalar productos digitales.
