Efectos en Figma

Clase 6 de 25 • Curso Básico de Figma - 2022

Clase anteriorSiguiente clase

Esteban Bustamante

student•

Para agregar el frame (Alt + Ctrl + G)

Jaston Laurente

student•

Cmd + Option + G :)

David Morales

student•

gracias buen hombre

Kevin Contreras

student•

Andres Felipe Cely Bravo

student•

![](

German Pinilla

student•

++Efectos en figma++

Cuando nos hablamos de los efectos dentro de las capas de figma, hacemos referencia a la visibilidad de las capas y los objetos que ya tenemos. Algunos efectos muy comunes son las sombras y el desenfoque, y hay maneras muy creativas de crear y combinar estos efectos para lograr interacciones mucho mas interesantes.

++Creando Efecto++

Selecciona elemento
Panel de propiedades
- Efects
  - Inner Shadow
  - Drop Shadow
  - Layer Blur
  - Backgroud Blur

Crearemos una imagen tipo polaroid, para lo cual debemos tener:

Un rectangulo con relleno blanco
Otro rectangulo con la imagen
Una sombra aplicada
Todo lo anterior sobre el frame de la nota que ya hemos avanzado en las clases pasadas

Asi va mi frame:

Sonia Ines Ruiz

student•

Jader Moncayo

student•

Añadiendo funciones

JAIRO SALAZAR CASTAÑO

student•

Excelente!

Carlos Andres Barreto Lozano

student•

Para los hemos trabajado com Adobe, esta herramienta me parece un complemento genial y muy practica.

andrea jaramillo

student•

COMPLETAMENTE deacuerdo colega

Lucemar Quintero Laguado

student•

Gary de León

student•

¿Por qué crear un frame para agrupar los dos objetos, en lugar de solo agruparlos (cmd + G)?

Leandro Cordero Davila

student•

Para lo que lo usó, daba igual si era grupo o frame. Pero en otras ocasiones para escoger entre uno u otro depende de para qué quieras agrupar los objetos. En Grupo, los bordes dependen de los objetos dentro y, si los manipulas, todo dentro se escala. En Frame, los bordes dependen del frame y los objetos dentro se acomodan respecto al tamaño del frame, también puede tener grid propia y otras características más que no se puede solo agrupando.

ISAAC DANIEL ATAUCURI YNFANTE

student•

MI AVANCE HASTA AHORA, WUUH!!!
Por cierto el comando para agregar el frame es: ctrl+alt+g.

Monica Ortiz Alvarez

student•

Dejo mi aporte hasta ahora!

Daiana Gimenez

student•

Hrach Kaderyan Midence

student•

Para transformar la foto desde Windows es arrastrando desde el borde de la misma y presionando la tecla Alt

Mike Ramirez Villamil

student•

Gracias, casi no lo logro

Ana Isabel Cortes Baron

student•

Saludos! 🤗✌🏼 Asi va mi frame:

Eddie Mora

student•

Al talento solo le bastan algunas herramientas para crear algo bello.

Sebastián Caraballo Marzola

student•

![](

Jeisson Espinosa

student•

Información resumida de esta clase #EstudiantesDePlatzi

Los efectos son las propiedades que afectan a la visibilidad de nuestros objetos
Dentro de los efectos podemos encontrar las sombras y le desenfoque
Para crear un grupo puedo usar Ctrl + g, con esto uno todos los objetos seleccionados en un mismo, los agrupo
Es recomendable en vez de agrupar, crear un Frame nuevo con Ctrl + Alt + G

Brenda Sutara

student•

Comparto mi avance

Aideé Granados

student•

Daniel Hidalgo

student•

--> Figma Cheat Sheet <--

Ricardo Pavón

student•

Que bueno es el profesor, explica tan bien que hasta alguien como yo entiende xd

Eduardo Zegers

student•

Alguien como tu llegará lejos

Eddie Mora

student•

A mi me parece excelente !

Jimena Haran

student•

No logré agregar como frame, los comandos no me sirven y los de los comentarios tampoco, así que los agrupé (busqué algún tutorial pero tampoco encontré)

Kevin Arizaga

student•

selecciona las capas y da click derecho y selecciona "group selection"

Abigail Nahomi Chávez Lozano

student•

Quizá es porque en tu computadora, el atajo ctrl + alt + g está configurado para otra cosa y figma lo puede usar, eso me pasaba a mí. Configura eso o con click derecho seleccionando 'frame selecction' y si te dejá un rectángulo fuera, solo arrástralo dentro del frame en el panel izquierdo

Efectos en Figma

Introducción

¿Para qué sirve Figma y por qué elegirlo?

Interfaz en Figma

Básicos

Configuración de guías y retículas

Creación de textos y estilos

Figuras e imágenes en Figma

Efectos en Figma

Redes de Vectores

Colores en Figma

Combo

Importar y exportar

Cómo crear guías de estilo

Auto-Layout

Los 15 mejores atajos para trabajar en Figma

Creación de componentes reutilizables: clase teórica

Creación de componentes reutilizables: clase práctica

Playground: Practica la creación de componentes reutilizables

Prototipado

Prototipado simple: interacción de scroll

Prototipado simple: conexión de diferentes frames

Prototipado avanzado: smart animate y componentes Interactivos

Co-Creando

Cómo agregar comentarios a los diseños

Historial de versiones en Figma

Librerías de estilos y componentes

Superpoderes

FigJam

Uso de plugins en Figma

Community: proyectos open-source y perfiles

Cierre

Proyecto final del curso de Figma