Sistemas de diseño en Figma
Contenido del curso
Sistemas de diseño en Figma
Contenido del curso
Rafael Alvarez Cardona
Una buena practica para replicar los tamaños exactos de algún elemento en la web es usar el inspector, ahí ves el color, tamaño y espaciado!
Guzman Geraldine
buen apunte
Felipe Agudelo Vélez
También se pueden usar extensiones como Fonts Ninja que lo hacen automáticamente y te dicen donde conseguir la fuente
Dario Espinosa
Otra buena practica es crear primero los tonos Dark , white y el color de body, después los colores primarios, secundarios, success, warning, etc y luego los neutrales, combianlo con un plugin como "Foundation: Color Generator" y terminaras en 5 min
Laura Mujica
Wow excelente aporte! :D Muchas gracias!!!
Diego Vanegas
Muy buena herramienta Dario.
Laura Naranjo Sánchez
Holi! Recomendación: antes de empezar a realizar un proyecto, landing page, prototipo, etc; primero empieza por la definición de los estilos de color, tipografía, íconos; para que luego después de haber creado ya varias cosas no hagas doble tarea de volver a poner todo si no que empieces por definir lo básico para el diseño.
Diego Reyes Cabrera
¡Hola! Estoy aprendiendo las bases del diseño para diseñar mis propias páginas, no soy diseñador sino programador. ¿Qué me recomendarías a mí? No sé con qué colores o estilos poder empezar antes de empezar a crear, pensaba hacerlo sobre la marcha
Dario Espinosa
En lugar de colocar color por color de tu style guide, a lo que lo necesite, Existe un plugin llamado "Match fills to local styles" lo hará en un parpadeo
Kamilo Stevan Alomías Correa
Hay una gran confusión con un Sistema de Diseño vs un UI Kit, el primero hace referencia a un archivo de documentación el cual facilita el entendimiento entre diseñadores, desarrolladores, personas de marketing, comunicación C-levels, etc. Este documento proporciona el manual de procesos para cada uno de los departamentos, desde el equipo de UX lo más relevante es el pilar de Componentes, que es ahí donde ponemos ver los componentes visuales el cual será utilizado también por el equipo de desarrollo. Un UI Kit es simplemente una parte del sistema de diseño.
Juan Carlos Wilches Niño
Pienso que los botones no son moléculas, porque los botones no se pueden reducir a menos de su forma básica
Leiver Choconta
Hola Juan, estoy de acuerdo con tu observación y debe tomarse en cuenta.
El valor mínimo que llega un átomo es asociado a nuestro capitulo de foundations, sin embargo estos no están considerados como tal, dentro del esquema atómico.
Micaela Girado
mmm para mi si que se pueden reducir.. si vamos al caso la información del boton, es decir el texto seria un átomo y el frame del boton seria otro. Bueno asi lo entendí yo jejej
Alejandro Daniel Calderón Prin
Extensión WhatFont para tomar las tipografías .
Mónica Contreras Pazo
Esto me ahorraráun montón de tiempo al hacer el trabajo. Bueno, también me evitará un dolor de cabeza jajajaja. Gracias por el aporte
María Valentina Reyes Leon
Me encanto mucho
Valentina Monsalve Ortiz
Pueden optimizar tiempo al copiar las propiedades de los componentes, por ejemplo sirve mucho en la tipografía.
seleccionan el texto que quieren copiar y dan clic derecho- copiar - copiar propiedades o el comando (ctrl -alt-c)
seleccionan el texto al que quieren pegar la apariencia u propiedades, dan clic derecho- copiar - pegar propiedades o el comando (ctrl - alt-v)
eso ayuda a optimizar tiempo c:
Luis Aguirre
Sí funciona, esto es magia.
Pedro Isaac Aguilar
Es muy útil tener nuestro UI Kit y posteriormente un Design System completo a la hora de armar y gestionar una interfaz. Gracias, ya me quedó claro cómo hacerlo.
Paolo Carrion
Estos sistemas de diseño de los que habla el profesor son también conocidos como Style-Guides. Les recomiendo investiguen más acerca de ellos.
Aideé Granados
Aquí dejo mi aporte. Sencillo pero me siento feliz de ir entendiendo todo este proceso.
Jimmy Caicedo
https://www.headway.io/download/shipwright Para tener una guía complejamente sencilla de entender y trabajar los UI Kits
Para los Design Tokens es este https://www.youtube.com/watch?v=Ka1I5TphDb0&t=2047s&ab_channel=IntoDesignSystems
María Luisa Barboza Restrepo
¿Es necesario tener un buscador con el espacio de texto en una landing page? Gracias
Luis Aguirre
María Luisa Barboza Restrepo
¿Es necesario tener un buscador con la barra para agregar texto en todos los landing page? Gracias
Jimena Haran
Bien, va quedando
Jimena Haran
Me gustó lo de nombrar como se llama cada tipografía porque poniendole "header" y nombres así me confundía mucho
Laura Altamiranda
un botón es un átomo, no una molécula.
