No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

¿Cómo crear un sistema de diseño? Proceso, principios y flujo de trabajo

3/26
Recursos

Aportes 9

Preguntas 0

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad?

Un sistema de diseño no se crea porque sí.

Debe existir una necesidad para crear un Design System (DS)


Factores a considerar antes de crear un DS

  • Contexto: del producto.
  • Necesidades: razones por las cuáles sería de beneficio implementar el Design System

Pasos para definir el DS:

  1. Revisar inconsistencias: puede servir aplicar una evaluación heurística 🤓
  2. Armar equipos: se necesita colaboración entre equipos, principalmente entre diseño y desarrollo, ya que es un producto de todos.
  3. Vender su importancia: la forma en la que expresamos las ventajas de aplicarlo…
  4. Explorar otros DS: para ver los patrones de diseño, los alcances, y empezar a definir nuestro propio sistema
  5. Definir fundamentos visuales: corresponde a la guía de estilos del DS.
  6. Crear componentes: dependiendo de las prioridades y la complejidad de cada uno.
  7. Construir patrones: detectar experiencias y componentes que se repiten para definir y tener mapeados esos patrones.
  8. Mantenimiento: se debe mantener al día, actualizando y adaptando a las necesidades que vayan surgiendo en el crecimiento e iteración del producto

Proceso a nivel de diseño

  • Evaluación del producto: se evalúa la marca, la voz, el tono, la accesibilidad.
  • Creación de la librería: colores, espaciados componentes, entre otros.
  • Documentación: para mantener una comunicación y colaboración correcta con el equipo.

Flujo de trabajo

Definir cuáles son las metodologías de trabajo dentro del equipo

Ejemplo: Design Sprint


Prototipado


Principios

Permiten sentar las bases de nuestro sistema de diseño, y por ende, los lineamientos que seguiremos en toda la creación de los productos

Flujo de trabajo
Para construir, mantener y actualizar nuestro Design System, tendremos que definir bien cuáles son las metodologías o tipo de flujo de trabajo que tendremos en nuestro equipo. Ej: Design Sprint, Agile, Waterfall, etc.
De tal manera que se toma la metodología de trabajo elegida, y se pueden hacer los ajustes necesarios de acuerdo a las necesidades de nuestro equipo y de la empresa, tomando, por ejemplo, sólo algunas partes del proceso metodológico de trabajo o modificándolas de acuerdo a nuestros parámetros, objetivos, procedimientos y procesos internos en la empresa. Ej: Sólo tomando del Design Sprint la parte de exploración, prototipado, validación y testeo.
.
Principios
Dan la identidad del Design System al permitir sentar sus bases, haciéndolo intuitivo, consistente, adaptable y accesible; por consiguiente, estos son los lineamientos que seguiremos en toda la creación de nuestros futuros productos e interfaces gracias a los principios establecidos en el Design System.

Pautas que nos puede ayudar a construir el sistema de diseño

1- Revisar inconsistencias
2- Armar equipo
3- Vender su importancia
4- Explorar otros sistemas de diseño
5- Definir fundamentos visuales
6- Crear componentes
7- Construir patrones
8-Mantenimeinto

03. ¿Cómo crear un sistema de diseño? Proceso, principios y flujo de trabajo

  • Un sistema de diseño no se crea porque sí
  • Normalmente surge por una necesidad
  • Es un proceso muy grande, complejo y largo
  • Contexto
    • Startup con 8 añis de desarrollo
    • Necesidad de iterar el producto con más velocidad y consistencia
  • Pasos para elaborar el DS
    1. Revisar inconsistencias
    2. Armar equipo
    3. Vender su importancia
    4. Explorar otros DS
    5. Definir fundamentos visuales
    6. Crear componentes
    7. Construir patrones
    8. Mantenimiento
  • Un DS busca coherencia y consistencia
  • Proceso a nivel de diseño
    • Evaluación del producto
      • Marca, target, voz, tono, accesibilidad
    • Creación de la librería
      • Colores, espaciados, componentes, fundamentos
    • Documentación y mantenimiento
  • Flujo de trabajo
    • Supongamos que trabajamos con la metodología Design Sprint
      1. Undestand
      2. Define
      3. Sketch
      4. Decide
      5. Prototype
      6. Validate
    • Ajustada al DS
      1. Explorar
      2. Prototipar
        1. Validar los componentes actuales y verificar si necesito buscar nuevos y crear nuevos
      3. Validar
      4. Handoff
  • Definir los principios
    • Principios genéricos de DS
      • Accesible
      • Intuitivo
      • Consistente
      • Adaptable
Un sistema de diseño se crea para construir una base estructurada y flexible que permita a las organizaciones optimizar recursos, mantener una identidad coherente y mejorar la experiencia del usuario de forma escalable.
### **Puntos importantes de la clase:** 1. Un sistema de diseño se crea cuando hay una necesidad, no por capricho. 2. **Pasos para crear un sistema de diseño**: * Revisar inconsistencias en el producto existente. * Formar un equipo de trabajo interdisciplinario. * Vender la importancia del sistema de diseño dentro de la empresa. * Explorar cómo lo hacen otras empresas (Google, Uber, etc.). * Definir los fundamentos visuales: colores, tipografías, espaciados. * Crear componentes de diseño priorizando los más necesarios. * Construir patrones de interacción y experiencia de usuario. * Mantener el sistema actualizado y funcional a lo largo del tiempo. 3. **Proceso del sistema de diseño**: * Evaluación de la marca y del producto. * Creación de la librería con fundamentos y componentes. * Documentación y mantenimiento del sistema. 4. **Metodología Design Sprint**: Se puede adaptar para la creación del sistema de diseño, permitiendo un flujo de trabajo eficiente. 5. **Principios del sistema de diseño**: Deben ser accesibilidad, intuitividad, consistencia y adaptabilidad.
Seria bueno utilizar para las presentaciones una tipografia acorde o legible ya que estas las utilizamos como notas.
## Cómo Crear un Sistema de Diseño ### Introducción Un sistema de diseño es esencial para mantener la coherencia, eficiencia y colaboración en los equipos de desarrollo y diseño. Aquí se describe el proceso, los principios y el flujo de trabajo para crear un sistema de diseño. ### Proceso 1. **Investigación y Análisis** * Recopila información sobre las necesidades del proyecto y los usuarios. * Analiza los sistemas de diseño existentes para identificar las mejores prácticas. 2. **Definición de Principios** * Establece principios de diseño que guiarán todas las decisiones futuras. * Asegúrate de que estos principios estén alineados con los objetivos del proyecto y las expectativas del usuario. 3. **Creación de Guías de Estilo** * Define las directrices visuales: tipografía, colores, iconografía, espaciado, etc. * Documenta los estilos y asegúrate de que estén accesibles para todos los miembros del equipo. 4. **Desarrollo de Componentes** * Crea componentes reutilizables basados en las guías de estilo. * Asegúrate de que cada componente sea accesible y esté bien documentado. 5. **Librería de Patrones** * Desarrolla patrones de diseño que incluyan interacciones comunes y flujos de usuario. * Documenta cómo y cuándo usar cada patrón. 6. **Implementación y Pruebas** * Implementa los componentes y patrones en el producto. * Realiza pruebas de usabilidad y accesibilidad para asegurarte de que cumplan con los estándares. 7. **Mantenimiento y Actualización** * Establece un proceso para actualizar y mantener el sistema de diseño. * Recoge feedback y ajusta el sistema según sea necesario. ### Principios 1. **Consistencia** * Mantén un estilo visual coherente en todos los elementos del diseño. * Asegúrate de que los componentes y patrones sean reutilizables y consistentes. 2. **Accesibilidad** * Diseña para todos los usuarios, incluyendo aquellos con discapacidades. * Asegúrate de que todos los elementos sean navegables y comprensibles. 3. **Escalabilidad** * Crea un sistema que pueda crecer y adaptarse a nuevas necesidades sin perder coherencia. * Diseña componentes y patrones que puedan reutilizarse en diferentes contextos. 4. **Flexibilidad** * Permite adaptaciones y personalizaciones dentro de los límites establecidos. * Proporciona variaciones de componentes para diferentes casos de uso. 5. **Colaboración** * Fomenta la comunicación y el trabajo en equipo entre diseñadores y desarrolladores. * Asegúrate de que todos los miembros del equipo entiendan y sigan las guías del sistema. ### Flujo de Trabajo 1. **Planificación** * Define el alcance y los objetivos del sistema de diseño. * Crea un cronograma y asigna responsabilidades. 2. **Diseño y Desarrollo** * Diseñadores y desarrolladores trabajan juntos para crear componentes y patrones. * Itera sobre el diseño y el código basándote en el feedback. 3. **Documentación** * Documenta cada componente, patrón y guía de estilo. * Asegúrate de que la documentación sea clara y accesible. 4. **Implementación** * Integra los componentes y patrones en el producto. * Realiza pruebas y ajustes según sea necesario. 5. **Revisión y Mejora Continua** * Revisa regularmente el sistema de diseño para asegurarte de que sigue cumpliendo con las necesidades del proyecto. * Actualiza y mejora el sistema basado en el feedback y las nuevas necesidades.

Creo que la metodología de trabajo es muy importante para avanzar en la creación de un producto. Como lo comentaba la profe Estefany, la metodología Design Sprint nos ayuda con este propósito. Creo que otra metodología que puede servir es Design Thinking https://es.wikipedia.org/wiki/Pensamiento_de_diseño