¡Soy un bebé de luz! Yeahh!
¿Qué es un Sistema de Diseño?
Lo que aprenderás sobre los sistemas de diseño
¿Qué es un Sistema de Diseño?
Bonus: Utilizando Notion
Quiz: ¿Qué es un Sistema de Diseño?
Principios del Sistema de Diseño
Principios del Sistema de Diseño
Niveles de Sistematización
Bonus: Utilizando Coggle
Quiz: Principios del Sistema de Diseño
Paradigmas de Sistemas de Diseño
Paradigmas: Diseño atómico, diseño procedural y DRY
Bonus: Utilizando Adobe XD
¿Qué es un componente?
Foundations
Quiz: Paradigmas de Sistemas de Diseño
Estilos para tu Sistema de Diseño
Tipografía
Bonus: Cómo evitar colores constrastantes
Paleta de colores
Quiz: Estilos para tu Sistema de Diseño
Reglas de espaciado, Animación, Voz y Tono
Reglas de espaciado
Animación
Consejos para empezar a animar usando After Effects
Voz y tono
Quiz: Reglas de espaciado, Animación, Voz y Tono
Icon System y UI Kit
Iconografía
Hitos
Bonus: UI Kit
Quiz: Icon System y UI Kit
Un sistema basado en personas
Un sistema basado en personas
Iteremos
Cierre
No tienes acceso a esta clase
¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera
Aportes 55
Preguntas 10
¡Soy un bebé de luz! Yeahh!
Los UI Kits son parte fundamental del sistema de diseño. Son librerías donde se alojan todos los elementos y componentes diseñados del producto. Un buen UI Kit es escalable y flexible a múltiples cambios
Ojo cuidado que un UI Kit no es un sistema de diseño, si no mas bien es el resultado de uno.
¡Simplemente Genial! Y si soy una chiquitina que te esta viendo y estoy encantada con todas tus clases. 🤓
Aquí pueden encontrar el UI Kit de Apple iOS Design:
https://developer.apple.com/design/resources/
A los que usen Sketch App, este cuenta con plugins que permiten el llamado de los símbolos alojados en una librería muy fácilmente. Mi favorito es Runner, es el Spotlight de Sketch.
Muchos UI Kits —> https://ui8.net/categories/ui-kits
¡Hola a todos!
Aquí pueden encontrar el UI Kit de Material Design:
https://material.io/archive/guidelines/resources/sticker-sheets-icons.html#
Me resulta muy agradable como interaccionas con los alumnos jaja gracias por tu curso tan interesante ❤️
Pero, más bien el UI kit es el resultado de un Sistema de Diseño, ¿cierto? Lo vimos varias clases atrás…
Un bebé de luz!! 😂 el profesor mantiene una muy buena actitud desde el inicio del curso, excelente profesor y excelente curso…
Corazoncito si eres un Bebe de Luz 💚
Para estos casos usen FIGMA y es gratuito
El profe rulo transmite energía, lo cual hace que te motives a seguir y mejorar. Y eso es genial y mucho.
que hermosa claseeee x diooooos jajaja finalmente comprendí bien que es un UI Kit graaaciaaass
Me ha encantado esta clase! sin duda agiliza mi trabajo en diseño web
Está súper bueno 🤩
no mmmm te pases, jajaja
Genial, en sketch para hacer ese cambio de colores que hace Rulótico es fácil hacerlo mediante los styles de colores y saber manejar los símbolos anidados.
Un artículo interesante para conocer más a fondo la diferencia entre un DS y un UI Kit https://medium.com/startups-es/no-es-lo-mismo-un-uikit-que-un-sistema-de-diseño-36efe44b7988
Qué excelente maestro. En verdad que es un placer aprender cuando los profesores se divierten y hacen la clase tan amena que ni se siente el paso del tiempo.
Bien por Rulótico.
Que genial quiero aprender a hacer UI kits
Ojo cuidado que un UI Kit no es un sistema de diseño, si no mas bien es el resultado de uno.
Esta muy bueno!! Agiliza mucho los tiempos el tener un UI Kit.
Un UI kit es una librería completa de un producto digital, utilizada como diccionario o manual de identidad gráfica de ese producto para los diseñadores. Contiene todos los elementos que integran la comunicación visual de la marca hacia el usuario. Un Sistema de Diseño debe contener el UI kit de la marca.
Esta clase se conbina perfectamente con el curso de Figma. Excelente Platzi. 😍
Si aún no lo has cursado, te lo recomiendo como alternativa a AdobeXD
No comprendo. Si estamos desarrollando un sistema de diseño ¿el UI Kit no debería ser el resultado (o el producto) derivado de las las otras piezas del sistema de diseño?
Sigo viendo DS y sigo leyendo “Dark Souls” xD
en CSS para hacer los cambios globales :root se usan unas variables globales donde se definen los colores para evitar que ocurra problemas de cambiar el color individualmente.
Me encanta que el UI Kit sea una biblioteca de referencias de nuestro producto, que sea fácil de modificar y escalable 😄
2023, soy un bebé de luz.
“Y dices No mmmmm…te pases” 😂
Sin duda el diseño no es cualquier cosa…
Me parece muy bueno el UI Kit que muestra Rulótico, lo tiene todo muy bien organizado por secciones, mi UI Kit es todo un lio, jaja. Bueno, a mejorar ese UI Kit, tal vez tarde horas o incluso días, pero de seguro vale la pena. 🤯🤯
Es por esa razón por la que es mucho más factible usar Figma, eso de estar guardando los archivos de manera local ya se me hace muy ambiguo y nada práctico, en vez de guardar todos los cambios en la nube para que el equipo de desarrollo lo pueda consultar más tarde.
Sin duda una excelentisima herramienta, que nos ahorra bastante tiempo 🤯🤯🤯🤯
¿Alguien mas nota un poco de desfase entre la voz y el video?
A los que usen Sketch App, este cuenta con plugins que permiten el llamado de los símbolos alojados en una librería muy fácilmente. Mi favorito es Runner, es el Spotlight de Sketch.
Realmente no me esperaba un bonus de está forma, es una practica muy productiva el utilizar los símbolos para el cambio de color y otras cosas. Es un curso fantástico.
Hola Rulótico en este curso, se vio XD, lo prefieres sobre Sketch?
Ques es un UI KIT?
Rulótico! Me encanta tu gusto por el cyberpunk! corazón coreano
#SomosBebesdeLuz 😊
muchas gracias…las clases han sido bastante utiles. Es muy importante la documentacion y los UI kits son prueba de ello.
Amo los UI Kits pero son bien pesados de rellenar jeje peo al final ayudan mucho en figma
Bebé de luz 😂
genial
El UI Kit que se muestra en el video cual es? me pase a la página de adobe y vi que existe varios para material design, IOS, IBM, etc.
¿Quieres ver más aportes, preguntas y respuestas de la comunidad?