Construyendo un sistema de diseño

Diseño UX
10/5/2017
|
Samuel Gimeno Artigas
Escritorio redondo con laptop, gafas, planta, celular, lápices y unas manos de mujer tecleando.

Una de las tareas más importantes de las personas que trabajan en diseño de producto, ya sean el gestor de producto (o product manager) o un diseñador de producto, es crear un sistema de diseño coherente para el producto que se adapte a los diferentes canales en los que va a vivir (producto físico, producto digital, cartelería física, banners para los diferentes canales digitales, etc…).

2017 05 10 1
Sistema de diseño. Imagen de Freecodecamp

Tener un sistema de diseño coherente, ya sea de creación propia o adaptado a partir de alguno preexistente, es una buena manera tanto de tener un sistema consistente para el usuario, así como una manera de enganchar fácilmente a nuevos miembros del equipo de trabajo y que se adapten a nuestra forma de trabajar de una manera rápida y sencilla.

En Freecodecamp han escrito un artículo muy interesante sobre los sistemas de diseño.

¿Qué es un sistema de diseño?

Un sistema de diseño consiste en una serie de elementos y patrones de diseño, es decir, es algo que va un poco más allá que una guía de estilo y un sistema de interfaz de usuario unidos. Es decir, un sistema de diseño consiste en una serie de reglas que evolucionan que rigen la composición de un producto.

Recordad la definición: un sistema de diseño es evolutivo para adaptarse a los nuevos sistemas o aparatos que van apareciendo continuamente. Además, ayuda a los desarrolladores o diseñadores de producto a hacer un producto propio que sea coherente con el resto de productos existentes.

Para hacer un buen sistema de diseño hay que tener los siguientes elementos superiores claros:

  • el propósito y la cultura de la compañía: sin ellos no se puede hacer un diseño coherente a esos valores o propósitos
  • la marca: aquí entra la adaptación de ésta a los diferentes formatos donde el producto vaya a estar presente
  • la redacción: el tono, el estilo y el tipo de textos que se redactarán para el producto
  • una librería de componentes y otros elementos de diseño: para que los desarrolladores y los diseñadores de producto puedan echar mano de ella y crear un nuevo producto coherente con los existentes de una manera rápida y fácil.

¿Cómo construyo una librería de componentes?

Aquí es donde suelen surgir más dudas. ¿Utilizo una preexistente de las muchas que ya hay -como puede ser Material Design de Google- y la adapto o creo una nueva partiendo de cero? Normalmente esto es un problema de conocimientos, recursos y tiempo (porque tiene que estar al día). Si tienes estos tres elementos de tu lado, crea tu propia librería de componentes. Si no, usa una de las preexistentes y adáptala en la medida de tus posibilidades.

Desde el Estudio te recomendamos que ya sea un caso o el otro, observes los recursos que usan otras empresas de tu mismo sector económico e intentes preparar algo similar.

Los elementos mínimos que debe tener una buena librería de componentes son:

  • una paleta de color adaptada
  • unos estilos para los títulos y una (o varias) tipografía/s
  • ejemplos de las tipografías en varios tamaños
  • sombreados
  • bordes redondeados
  • espacios entre elementos
  • espaciado de las letras
  • botones
  • estilos de formularios

La mayoría de las librerías de componentes existentes contienen estos elementos, así que si te decantas por esta opción, tendrás solucionados todos estos elementos.

Desde el Estudio os recomendamos tener un sistema de diseño que evolucione mediante una mejora continua para poder elaborar productos de una manera coherente y poder incorporar gente fácilmente a vuestro equipo de diseño de producto con poco tiempo de aprendizaje.

Os recordamos que podéis profundizar en estas y otras cuestiones con nuestro curso online de UX Learn de Diseño de Producto, que comienza el próximo lunes 15 de mayo y para el que, en el momento de publicar este post, sólo quedan dos plazas disponibles.¡Matricúlate ya antes de que se agoten!

En Torresburriel Estudio apoyamos el rediseño de tu producto digital con un proyecto de acompañamiento donde aplicamos metodologías de diseño centrado en el usuario. Contacta con nosotros y cuéntanos tu proyecto. Te enviaremos una propuesta adaptada a tus necesidades y presupuesto.

¿Quieres darnos tu impresión sobre este post?

4 respuestas a “Construyendo un sistema de diseño”

  1. Muy interesante, deja con ganas de más a los curiosos como yo.

Deja una respuesta

Aquí va tu texto personalizado.

Blog

Nos encanta compartir lo que sabemos sobre diseño de producto y experiencia de usuario.
Ver todo el blog
Puedes consultarnos lo que necesites
Envíanos un mensaje
Nombre
Email
Mensaje
Gracias por escribirnos. Nuestro equipo se pondrá en contacto contigo tan pronto como sea posible.
Ha ocurrido un error. Estamos trabajando para resolverlo. Puedes escribirnos al chat.