Introducción a Design Systems con Figma

Introducción a Design Systems con Figma

“Querido alumno o alumna, hemos llegado al final del curso. Ahora ya sabes qué son los design systems. También has aprendido un poco de su historia, las partes que los componen y qué beneficios pueden traer a tus diseños, productos y equipos de trabajo. Primero definimos los principios de diseño que serían nuestra “filosofía” de base y, una vez que ya lo tuvimos claro, pasamos a Figma e inspeccionamos la guía de estilos para entender cómo crear los estilos de texto y color, analizando las escalas para móvil y escritorio.

Luego diseñamos los elementos y componentes que serían la columna vertebral de todo lo que haríamos después: iconos, botones, card, ítem, diálogo, entre otros. Además de esto, también vimos qué son los patterns o patrones, y cuál es la utilidad de tenerlos documentados. En fin, vimos todo lo necesario para que puedas tener un design system escalable, consistente, coherente para unificar la apariencia y comportamiento de los diseños de tus interfaces. Una vez que ya teníamos una base muy sólida, llegó la hora de poner a prueba los componentes diseñando la pantalla principal de una web de viajes en tres tamaños diferentes. Esto nos dio una idea más real de qué tan bien preparados están los componentes y estilos para responder a distintas situaciones. En la última parte has aprendido por qué un design system nunca se acaba, y por lo tanto, cómo es necesario documentarlo para que los otros miembros de tu equipo sepan cómo usarlo. Para hacer esto usamos Zeroheight, la herramienta que nos ha permitido tener todo documentado en un mismo sitio. Recuerda que un design system es un trabajo de equipo que involucra a muchas personas, pero siempre puedes comenzar con una buena base con lo que hemos hecho en el curso para que luego sea más fácil seguir creciendo. Comparte en el foro tanto el resultado final de tu proyecto design system como los pasos que te han llevado hasta él. Puedes pensar también en otros principios de diseño, componentes o patterns que sean diferentes a los que hemos mencionado, y que se adapten mejor a lo que necesitas tú específicamente. Luego, puedes prepararlos y adaptarlos siguiendo los mismos lineamientos y recomendaciones que hemos visto en el curso. No dudes en ponerte en contacto conmigo si tienes dudas, preguntas, o comentarios. Estaré feliz de ayudarte lo más que pueda para que los contenidos sean de utilidad y tengan valor para tu caso en especial. ¡Seguimos en contacto! ”

Transcripción parcial del vídeo

“Proyecto final Llegamos al final de este curso de Domestika, y confío haberte enseñado lo que necesitas para crear un proyecto organizado, escalable, coherente y consistente usando componentes reutilizables. Los conceptos de cursos son para la web, pero se pueden usar para aplicaciones móviles. Me encantará ver tus resultados y comentarlos en el Foro. Antes de despedirme, haré un resumen de los pasos que seguí para diseñar tu proyecto final. Vimos qué son los "design systems" y los beneficios de usarlos para ti, tu equipo y el producto. Luego vimos las partes que lo componen. Entendimos la ...”

Generamos automáticamente esta transcripción y puede haber erratas.

Resumen del curso: Introducción a Design Systems con Figma

• Nivel: Iniciación
• 99% valoraciones positivas (412)
• 11228 estudiantes
• 5 unidades didácticas
• 24 lecciones (4h 38m)
• 11 recursos adicionales

• Categoría

  Diseño Web y App

• Software

  Figma

• Áreas

  Diseño de apps, Diseño de producto digital, Diseño mobile, UX / UI