Sistemas de Diseño, ya estamos tardando

Sin perder un minuto, os defino de una forma rápida para entrar en contexto: un sistema de diseño o design system, es un sistema que nos ayuda a encontrar y aislar los patrones y componentes con los que podemos construir las aplicaciones de nuestra marca, mantenerlos organizados y reutilizables, para que nuestros equipos de diseño y desarrollo construyan aplicaciones más consistentes, más rápido, y con menor coste.

Design system, si te hubiera conocido antes...

Seamos sinceros: ¿Quién no ha sufrido el ciclo de vida natural del producto?

Generalmente cuando iniciamos un nuevo proyecto, todo empieza de forma maravillosa e ilusionante y estamos deseando ver el resultado con altas expectativas.

 
Disco de Grease con John Travolta y Olivia Newton Jones.

 
Con el paso del tiempo y tras la puesta en producción, los equipos y los presupuestos se reducen, nuestro producto muta poco a poco, y comienza a transformarse.


Disco Camela “me metí en tu corazón”. Todo nuestro cariño y respeto.


Sí, se parece a lo que fue en un inicio, pero a medida que pasa el tiempo la inconsistencia gana terreno. Por tanto, esta inercia natural que sabemos sucede en los proyectos debemos evitarla.
 

MO-DU-LAR

En los últimos tiempos se habla mucho de componentización y modularidad, y muchos de vosotros pensaréis: ¿modularidad? A ver si ahora vamos a reinventar la rueda...

Nos podemos remontar a la Segunda Revolución Industrial, finales del XIX, donde estandarizaron nuevos procesos de fabricación, transformando el modelo de producción existente. Creo que a todos nos suena el señor Ford, las cadenas de montaje y la producción en masa; pues todo fue posible gracias a la modularización y la componentización, que permitía un ensamblaje más rápido en las cadenas de montaje, y con ello la fabricación de vehículos uniformes, fiables, seguros... y en un tiempo record.

Pues bien, si esta modularización lleva haciéndose desde hace más de 150 años ¿por qué se vuelve a hablar otra vez de ello? Como sabemos, no estamos en una época de cambios, sino en un cambio de época y entre las muchas cosas que ha propiciado el actual despegue tecnológico, y bajado a lo que nos atañe, es que estamos unidos, a una gran multitud de tecnologías, entornos y dispositivos con sus multitudes de tamaños y sistemas operativos… lo que a su vez nos obliga a la tarea de garantizar experiencias uniformes en un gran variedad de dispositivos, desde smartphones, tablets, netbooks, laptops… hasta televisores y consolas.

Cuando hablamos además de los Sistemas de diseño, nos viene a la cabeza lo que nos gusta escuchar:

• Que construimos productos digitales y plataformas más rápido.
• Que reducimos costes.
• Que mejoramos y unificamos la experiencia de usuario.
• Que la personalidad de nuestra marca se impregna correctamente en cada uno de nuestros productos y plataformas.
• Etc.

Pues lo mejor, es que ahora es posible.

Un sistema de diseño hay que entenderlo como un organismo vivo que nos ayuda a construir nuestros productos digitales y plataformas, con una visión integrada y extensible a toda la organización y a los diferentes equipos implicados en la definición y desarrollo de estos productos y plataformas.

Nos ayuda a encontrar y aislar los patrones y componentes con los que podemos construir las aplicaciones de nuestra marca, mantenerlos organizados y reutilizables para que nuestros equipos de diseño y desarrollo construyan aplicaciones más consistentes, más rápido, y con menor coste.

Qué podemos encontrar en un Sistema de diseño

Más allá de una guía de estilo o de un repositorio de componentes, podemos concebirlo como un hub hipervitaminado donde encontrar todo aquello que necesitaremos para diseñar y construir un nuevo producto en nuestra organización. Encontraremos:

• Unas bases y principios de diseño, sobre las que se conciben y construyen nuestros productos y sobre las que deberemos apoyarnos cuando debamos crear una nueva solución.
• Todo lo relacionado con nuestra marca y el and feel: cómo se aplica, nuestra voz, tono y estilo, movimiento...
• Una serie de recursos de diseño, tales como un UIKit, que ayudará a nuestros diseñadores a diseñar y construir rápidamente sin comprometer la calidad.
• Un set piezas tales como componentes, módulos y estructuras con los desarrolladores construyan mis productos.
• Los patrones que nos guíen a la hora de cómo y cuándo usar cada componente (y cuándo no usarlos).
• Normas y directrices técnicas para la implementación de los componentes, así como para mantener el código legible, mantenible y escalable.

Qué nos aporta un Sistema de diseño

Un Sistema de Diseño nos aporta ventajas desde múltiples puntos de vista relacionados entre sí: económico, de usuario, de marca...

• Permite mantener una consistencia visual y funcional.
• Mejora la experiencia de usuario permitiéndole reconocer patrones entre todas tus plataformas, consiguiendo una menor carga cognitiva, menos tiempo de aprendizaje, y por tanto una mejor UX.
• Conseguimos tener plataformas mantenibles y escalables.
• Velocidad de desarrollo. Esto, enfocando a entornos Agile (SCRUM, Lean) donde la secuencia de diseño-prototipado-testing-iteración necesita de agilidad, posibilita seleccionar un componente, ensamblar y testear rápidamente, consiguiendo un time to market rápido, optimizado y con menores costes.
• Eliminamos stoppers: Ningún desarrollador parado esperando diseño. Ningún diseñador modificando algo que ya se había desarrollado.
• Optimizacion de equipos que ahora pueden centrarse en nuevas mejoras del negocio. Teniendo las piezas con las que construir, preocupémonos sólo por hacer la mejor solución posible.
• Es el uso de un mismo lenguaje para todos, sobre todo aquellos implicados en el desarrollo o mantenimiento de una aplicación, desde el diseñador, al desarrollador pasando por el redactor de contenido.
• Una consistencia en la imagen de marca que muestra coherencia y que se traslada a todas nuestras aplicaciones.
• Permite contratar el desarrollo. Aporta TÚ el diseño.
• Reduce tiempo y mejora tu UX: reduce costes y mejora beneficios.

¿Por qué tu organización no tiene implantado su Sistema de diseño?

Ahora es el momento de estar más tranquilo, simplemente hay que dar el paso. Muchas compañías llevan ya un tiempo subidas al carro de los Sistemas de Diseño, ¿vas a ser el último?
Aquí tienes algún ejemplo de los Sistemas de Diseño de grandes compañías.

• Atlassian
• Airbnb
• Microsoft
• BBC
• Audi

BABEL lleva años desarrollando Sistema de Diseño / Design Systems. Algunas de nuestras referencias están en grandes clientes como SACYR, CASER o Informa, por lo que si necesitas perfilar tu estrategia o desarrollar tu Sistema de Diseño, no dudes en ponerte en contacto con nosotros, y así podremos contar cómo integramos aquí metodologías y técnicas como Atomic Design, 8pt Grid, ITCSS, BEMIT…