Variants: complejos

Clase 10 de 19 • Curso de Figma Avanzado

Aarón González

student•

También pueden asignar 'True' y 'False' (booleano) y en vez del dropdown, tendrán un switch súper fácil de usar para 'prender y apagar' propiedades a sus Variants.

Inténtenlo, y me cuentan como les va ;)

Diego Perdomo

student•

Gracias por la recomendación :) Todavía no me toca aplicarlo, pero por lo que vi en los tutoriales de Figma, esa función es buenísima.

Luis Aguirre

student•

Así lo hice, la verdad es que es visualmente más atractivo que el dropdown jajaj

Paolo Carrion

student•

Me fascina como Figma cada vez más conecta a los diseñadores con los developers 🤓.

Ronaldf Chavez

student•

15478321553.

ñlkiujhytgftrfdeswaqzxcvbnnm,

Grethel Rodriguez

student•

Hola! Hice un apunte intentando explicar cómo crear lo que nos explica el profe con las nuevas actualizaciones de Figma, espero que les sea de utilidad. Variants complejas

Lina Agudelo

student•

Muchas Gracias! :D

Diego Reyes Cabrera

student•

Hola, te recomiendo hacerlo un tutorial del curso aquí en Platzi!

Anyilo José Rangel Arias

student•

Lo hice, en el 2022 la actualización de Figma no permite ver las mismas opciones que le sale al profesor.

Pero Lo logré nombrando los diferentes botones de esta forma Button/Primary/Activate Button/Secondary/Activate Button/Primary/desactivate Button/Secondary/desactivate

y presionamos Cobine as variants

Lo que haces es cambiar el nombre de las propiedades y listo quedaría así

Guzman Geraldine

student•

https://www.figma.com/file/56mpWyZOpFZHWXJxflrGhk/Figma-Variants-Playground-(Community)

Fernando Varela

student•

Parece que quedó desactualizado este material. Hoy en las herramientas de figma no está la opción de "Estado" en variantes.

Daniel Cortes

student•

Profe e intentado pero creo que con la actualizacion no me saele, para agregar una nueva propiedad

Any Julieth Reinoso Correa

student•

Me pasa igual

Luis Antonio Vargas Avila

student•

Para agregar propiedades tienes que seguir la nomenclatura

button/enabled=true/color=blue button/enabled=false/color=red

En el ejemplo anterior 'button' es el nombre del grupo de componentes enabled es la propiedad 1 color es la propiedad 2

Importante, cada componente tiene que tener la misma nomenclatura al momento de nombrarlos en el mismo nombre, porque si no tendrás conflicto en tus variantes.

Felipe Mendieta

student•

Estoy tomando este curso en 2023, la interfaz de Figma ha cambiado, recomiendo ver este tutorial en youtube https://youtu.be/ZmzEkFmG1lo con eso pueden aclarar todas las dudas de este video.

Saludos desde Ecuador.

Luis Aguirre

student•

Gracias! Ese Christopher es un pro. Gracias a uno de sus videos entendí mejor los auto layouts de hecho.

Juan David

student•

Jajs, y yo que pensaba que dominaba los componentes

Pablo Adrian Gonzalez Salazar

student•

Muy buena clase profe

Julio Servan

teacher•

Gracias Pablo Adrian!

Diego Reyes Cabrera

student•

Concuerdo con que el curso básico era más avanzado que este mismo curso... pero buej

Camila Jaunsaras Munch

student•

Amé el Curso!

Xiomara Alejandra Hernández Arzola

student•

Estoy pensando que con un amigo que es maestro de inglés, hacer remixes de estos documentos al español. Para que el idioma no sea impedimento en el aprendizaje. Sabemos que aprenderlo es super importante pero que de momento no sea una barrera y piensen en dejar aprender por eso :D ..

Diego Perdomo

student•

No sabía del alcance de los Variants :o Más formas de aplicar está herramienta -> aquí

Pedro Isaac Aguilar

student•

Con esta clase ya me quedó más claro el alcance y potencial que tienen los Variants. ¡Gracias!

Julio Beltrán

student•

Hola, alguien sabe como incluir en un diseño una animacion como esta ? https://www.figma.com/file/wh5TK6zudLtJFd2lx0VF1u/ButtonFAB?node-id=2%3A21&t=dFqrQI4e2DaWE4ai-1

Giovanni Rodríguez Villegas

student•

Como los demás, no aparecen las características que se indican en la grabación.

Sin embargo, consideré que es redundante poner el nombre de "estado" y lo omití, simplemente creé el "Tipo" con la opacidad al 40% y ese es fue el que utilicé.

¿Estoy en lo correcto haber hecho eso o salté algún paso importante?

Valentina Puentes

student•

Una duda, es que no me aparece la opción de cambiar estado, alguno sabe ¿por que sucede esto?

Jocelyn Berta Moreno Vieyra

student•

Hola, existe por casualidad el archivo de "Variants Playground" en español?

Gracias y saludos

Juan Rosa Urías López

student•

HOLA veo las opciones son diferentes en la nueva actulizacion de figma y por ello no logro completar el ejercicio.

Luis Antonio Vargas Avila

student•

Para agregar propiedades tienes que seguir la nomenclatura

button/enabled=true/color=blue button/enabled=false/color=red

En el ejemplo anterior 'button' es el nombre del grupo de componentes enabled es la propiedad 1 color es la propiedad 2

Importante, cada componente tiene que tener la misma nomenclatura al momento de nombrarlos en el mismo nombre, porque si no tendrás conflicto en tus variantes.

Variants: complejos

Introducción y community

Hemos actualizado el curso de Figma Avanzado

Introducción y bienvenida

Figma community: conoce, comparte y remixea

Platzi Card Community

Proyecto Landing Page Multi-idioma

AutoLayout y Variants

¿Qué es y por qué es importante el AutoLayout?

AutoLayout: dirección, paddings, resizing y constraints

AutoLayout dentro de AutoLayout

Variants de 0 a 100

Variants: complejos

Design Systems

Introducción a los sistemas de diseño

Sistemas de diseño en Figma

Prototipado

Construcción de pantallas

¿Qué son los Interactive Components?

Interactive Components avanzados

Plugins

Mejores Plugins

Plugins: multi-lenguaje y diseño dinámico

Despedida

Despedida

Autoevaluación del Curso de Figma Avanzado