CursosEmpresasBlogLiveConfPrecios

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

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

Clase anteriorSiguiente clase

Contenido del curso

Introducción
  • 1
    ¿Para qué sirve Figma y por qué elegirlo?

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

    04:39
  • 2
    Interfaz en Figma

    Interfaz en Figma

    09:34
  • Introducción

Básicos
  • 3
    Configuración de guías y retículas

    Configuración de guías y retículas

    05:17
  • 4
    Creación de textos y estilos

    Creación de textos y estilos

    15:18
  • 5
    Figuras e imágenes en Figma

    Figuras e imágenes en Figma

    13:22
  • 6
    Efectos en Figma

    Efectos en Figma

    07:02
  • 7
    Redes de Vectores

    Redes de Vectores

    15:20
  • 8
    Colores en Figma

    Colores en Figma

    09:50
  • Básicos

Combo
  • 9
    Importar y exportar

    Importar y exportar

    08:14
  • 10
    Cómo crear guías de estilo

    Cómo crear guías de estilo

    07:33
  • 11
    Auto-Layout

    Auto-Layout

    12:39
  • 12
    Los 15 mejores atajos para trabajar en Figma

    Los 15 mejores atajos para trabajar en Figma

    11:20
  • 13
    Creación de componentes reutilizables: clase teórica

    Creación de componentes reutilizables: clase teórica

    08:29
  • 14
    Creación de componentes reutilizables: clase práctica

    Creación de componentes reutilizables: clase práctica

    11:37
  • 15

    Playground: Practica la creación de componentes reutilizables

    00:00
  • Combo

Prototipado
  • 16
    Prototipado simple: interacción de scroll

    Prototipado simple: interacción de scroll

    07:44
  • 17
    Prototipado simple: conexión de diferentes frames

    Prototipado simple: conexión de diferentes frames

    10:44
  • 18
    Prototipado avanzado: smart animate y componentes Interactivos

    Prototipado avanzado: smart animate y componentes Interactivos

    07:19
  • Prototipado

Co-Creando
  • 19
    Cómo agregar comentarios a los diseños

    Cómo agregar comentarios a los diseños

    05:53
  • 20
    Historial de versiones en Figma

    Historial de versiones en Figma

    05:48
  • 21
    Librerías de estilos y componentes

    Librerías de estilos y componentes

    05:21
  • Co-Creando

Superpoderes
  • 22
    FigJam

    FigJam

    06:40
  • 23
    Uso de plugins en Figma

    Uso de plugins en Figma

    14:02
  • 24
    Community: proyectos open-source y perfiles

    Community: proyectos open-source y perfiles

    05:36
  • Superpoderes

Cierre
  • 25
    Proyecto final del curso de Figma

    Proyecto final del curso de Figma

    02:01
    Jesús Ignacio García Fernández

    Jesús Ignacio García Fernández

    student•
    hace 3 años

    Figma

    2013 resuelve estos problemas:

    • acceso a los archivos correctos
    • versiones diferentes / actualización
    • comunicación entre involucrados
    • visibilidad sobre el proceso / complejidades

    Como producto

    • Editor en línea de vectores que siempre se mantiene actualizado
    • Accesible desde cualquier equipo con una pantalla e internet
    • Facilita diferentes procesos de co-creación con resultados visuales
      Erimer Alcantara Peña

      Erimer Alcantara Peña

      student•
      hace 2 años

      Excelente

      William Ruiz

      William Ruiz

      student•
      hace un año

      gracias por tu aporte jesus

    Jesús Ignacio García Fernández

    Jesús Ignacio García Fernández

    student•
    hace 3 años

    Esta es la herramienta que necesito, estaba enfocado en un hackatón en el código pero creo que en realidad hay que enfocarse en el prototipado. Gracias, ya estoy emocionado con el curso

      William Ruiz

      William Ruiz

      student•
      hace un año

      x2

    Jonathan Portugal Cuadros

    Jonathan Portugal Cuadros

    student•
    hace 3 años

    El diseñador es como la jirafa! Vive con la cabeza en la nubes pero con los pies en la tierra!

      Nestor Rios Garcia

      Nestor Rios Garcia

      student•
      hace 3 años

      Interesante frase.

      Diego Colín

      Diego Colín

      student•
      hace un año

      Como dijo el camello: Hay mucho de-cierto 🐫

    Crismar Silva

    Crismar Silva

    student•
    hace 3 años

    Otro curso de Santi, un gran profe. Estaba esperando este curso desde hace mucho tiempo, gracias Platzi

    ISAAC DANIEL ATAUCURI YNFANTE

    ISAAC DANIEL ATAUCURI YNFANTE

    student•
    hace 3 años

    • Curso de Figma con actualizaciones del año 2022. • Diseñar: Es un proceso ambiguo y complejo y que involucra a muchas personas. • Se usa mejor en equipo. • Problemas comunes al trabajar en equipo: o Acceso a los archivos correctos. o Versiones diferentes. o Comunicación entre involucrados. o Visibilidad del proceso • En el 2012 identificó estos problemas y en el 2013 Figma sacó su versión beta. • Figma como producto es: o Editor en línea de vectores que siempre se mantiene actualizado. o Accesible desde cualquier lado con pantalla e internet. o Facilita procesos de co-creación.

    o Su foco principal es el diseño de interfaces.

    • Crearemos un producto digital desde cero en el curso y será una aplicación de notas. • Podremos colaborar con un equipo no solo en lo concerniente a feedback sino también a colaboración. • Lograremos prototipar diferentes ideas sentando las bases de un sistema de diseño reutilizable.

      Cristhian Villar

      Cristhian Villar

      student•
      hace 3 años

      Gracias, tomando este curso con Platzi Day. Animado, tenia conocimiento previo de forma básica.

      William Ruiz

      William Ruiz

      student•
      hace un año

      gracias por tu aporte

    Carlos Razo

    Carlos Razo

    student•
    hace 3 años

    Excelente, un curso de actualización! 👌

    Me gustaría aportar un poco en la parte donde menciona que tendremos el criterio para decidir cuál es el mejor diseño. Y es que podríamos si decidir, cuál según nosotros es el mejor diseño, peeero esto no quiere decir que sea el que nuestros usuarios necesitan para resolver su necesidad, para ello es necesario hacer pruebas de usabilidad, entrevistas con usuarios, etc. Que seguro mas adelante en el curso lo comentará.

    En hora buena por este curso de actualización, muuy necesario.

      Manuel Lopez

      Manuel Lopez

      student•
      hace 3 años

      Gracias por este comentario. Es importante tener en primer lugar al usuario y sus necesidades.

    German Pinilla

    German Pinilla

    student•
    hace 3 años

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

    Figma te brinda todas las herramientas necesarias para la fase de diseño del proyecto, incluidas las herramientas vectoriales capaces de ilustrar completamente, así como aquellas para la creación de prototipos y la generación de código para el traspaso (hand-off).

    ++Figma funciona en línea++ Aunque Figma funciona en el navegador, también hay una versión de escritorio para Windows y Mac OS. Posiblemente se trate aplicaciones “empaque” que ejecutan un navegador dentro de ellas; pero ya sea ese el caso o no, Figma siempre se ejecuta en línea dentro de esas aplicaciones.

    ++Nota++: Si pierdes la conectividad, puedes seguir trabajando en cualquier documento que ya hayas abierto.

    Figma surge como respuestaa la creacion, diseño y todo el quipo que involucra trabajar colaborativamente. Hace algun tiempo no existia la forma de cocrear como se puede hacer hoy en dia. Diseñar es un proceso ambiguo y complejo que involucra en algunas ocasiones a muchas personas y como tdo lo bueno es un deporte que se juega mejor en equipo. Pero surgen problmas del trabajo en equipo.

    ++Problemas comunes al trabajar en equipo:++

    • Acceso al los archivos comunes
    • Versiones diferentes / actualización
    • Comunicacion entre los involucrados
    • Visibilidad sobre el proceso / complejidades

    Figma como producto:

    • Editor en linea de vectores que siempre se mantiene actualizado
    • Accesible desde cualquier equipo con una pantalla e internet.
    • Facilita diferentes procesos de co-creacion con resultados visuales

    El foco principal es puesto en el diseño de interfaces ++En resumen: qué es Figma++ Figma es una aplicación basada en navegador para diseñar UI y UX que cuenta con excelentes herramientas de diseño, creación de prototipos y generación de código. Actualmente es (posiblemente) la herramienta líder en la industria para diseñar interfaces y cuenta con características sólidas que respaldan a los equipos que trabajan en cada fase del proceso de diseño.

    ++Al final de este curso podras:++

    • Crear un producto digital desde cero.
    • Colaborar con un equipo en la co-creacion de tu sistema.
    • Prototipar diferentes ideas para escoger la mejor
    • Sentar las bases de un sistema de diseño reutilizable.
      William Ruiz

      William Ruiz

      student•
      hace un año

      gracias por tu aporte

    Oscar Rico Figueredo

    Oscar Rico Figueredo

    student•
    hace 3 años

    Como diseñador llevó tiempo "huyendole" de Figma pero siento que ya es mi momento de enfrentarme a nuevas herramientas.

      Marco Blanco

      Marco Blanco

      student•
      hace 3 años

      porque le huyes? no lo ves amigable

    MAURICIO AURELIO NICOLAS COLINA

    MAURICIO AURELIO NICOLAS COLINA

    student•
    hace 3 años

    Pinta que será un excelente curso como todos los que voy realizando en Platzi. Es importante, además del código en el desarrollo web, tener en cuenta la parte visual del diseño. Así que a darle rienda suelta a la creatividad y a saber utilizar esta herramienta. Gracias totales!!

      Iran Aguirre

      Iran Aguirre

      student•
      hace 3 años

      Estoy de acuerdo contigo. Hoy en dia con el mercado laboral cada ves mas competido es muy importante aprender en cuanto a UX/UI para poder ser mas rentables a la hora de buscar un nuevo trabajo como desarolladores.

      Hector Taboada

      Hector Taboada

      student•
      hace 3 años

      Justamente por eso estoy aprendiendo sobre UX/UI, ya que aprendí que lo que habla de "la calidad" de mi trabajo al final es su diseño, tus clientes potenciales nunca miran lo bien programado que está jajajaja

      Lo digo porque soy programador hace +5años y siempre vendí o porque soy el único que conocen o porque les gustó el diseño visual (que otro profesional hizo)

      Entonces pues a aprender diseño señores 💪🏻

    Alfonso Cervantes Alonso

    Alfonso Cervantes Alonso

    student•
    hace 3 años

    Actualmente el diseño UI es una de las responsabilidades que tengo en mi trabajo y el poder moverme mejor en Figma buscando siempre el cómo mejorar la práctica y definir un flujo de trabajo para responder en tiempo y forma con los equipos de desarrollo se vuelve una necesidad.

    Siempre es bueno repasar un flujo que te lleva desde las bases hasta conocer las herramientas open source para agilizar la construcción de pantallas.

    ¡Vamos pues! :)

    Fernanda López

    Fernanda López

    student•
    hace 2 años

    Se agradece un curso actualizado, no se me había ocurrido utilizar Figma para la creación de piezas visuales la verdad.

    Josue Israel Rojas Vilca

    Josue Israel Rojas Vilca

    student•
    hace 3 años

    Resumen de la clase Figma surge como una respuesta a problemas de diseño en el cual este un proceso ambiguo y complejo

    Pero como todo lo bueno esto se debe abordar siempre en equipo 👀

    Problemas comunes al trabajar en equipo

    • Acceso a los archivos correctos
    • Versiones diferentes / actualización
    • Comunicación entre involucrados
    • Visibilidad sobre el proceso / complejidades

    Ante esto en el 2013 se lanzo la versión beta de Figma como producto mediante las siguientes propuestas

    • Editor en línea de vectores que siempre se mantiene actualizado
    • Accesible desde cualquier equipo con una pantalla e internet
    • Facilita diferentes procesos de co-creación con resultados visuales

    💡 El foco principal de Figma esta en el diseño de interfaces 🎨

      William Ruiz

      William Ruiz

      student•
      hace un año

      gracias por tu aporte josue

    yesica tamara mattos

    yesica tamara mattos

    student•
    hace 3 años

    Estoy muy ansiosa de comenzar a utilizar figma, ya que soy nueva en diseño y va a ser mi primer herramienta.

      Fernanda López

      Fernanda López

      student•
      hace 2 años

      mucho éxito!

    Jose Cruz Estrella Ramirez

    Jose Cruz Estrella Ramirez

    student•
    hace 3 años

    Comencé un programa de Microsoft Latam con enfoque a Full Stack Developer, código como tal, pero siempre hay que tener nociones básicas sobre diseño y realizacion de interfaces antes de poder programar. Ahora a complementar mis conocimientos con este curso!

    Tallercv.com - ¡Mereces un mejor empleo!

    Tallercv.com - ¡Mereces un mejor empleo!

    student•
    hace 3 años

    Qué nota. Figma es tan intuitivo justamente porque se enfoca en resolver problemas que ya existían. I am essite.

    Loida Manzaneque Martiarena

    Loida Manzaneque Martiarena

    student•
    hace 2 años

    Pueden tener su cuenta Figma Pro de estudiantes gratis siguiendo los pasos de este enlace: https://platzi.com/tutoriales/1961-figma/9683-crea-tu-cuenta-educacional-con-figma/

      Luis Gonzalez

      Luis Gonzalez

      student•
      hace 2 años

      Gracias. Ya pude unirme sin ningún problema.

    Rodrigo Contreras Rubio

    Rodrigo Contreras Rubio

    student•
    hace 3 años

    let's start learning !! never stop learning !!

    Alma Delia Martinez Campech

    Alma Delia Martinez Campech

    student•
    hace 3 años

    Estoy tomando este curso porque trabajaba con Invision Studio,.. sin embargo dejó de existir la app de escritorio para prototipado, espero que Figma me sea fácil de usar y tengo muchas expectativas del curso, además de que estoy emocionada por aprender algo nuevo.

    Dario Falzone

    Dario Falzone

    student•
    hace 3 años

    Excelente introduccion!

    Federico Maidana

    Federico Maidana

    student•
    hace 2 años

    Buenas, no se donde lo vi, pero se que hay una forma de hacer que un elemento se repita al estirar a su contendor padre. Alguien sabe como se hace ?

    Estoy buscando por todo internet y no encuentro ninguna info

      Platzi

      Platzi

      student•
      hace 2 años

      Para hacer que un elemento se repita al estirar a su contenedor padre, puedes utilizar la propiedad CSS 'background-repeat: repeat'. Esto hará que la imagen de fondo se repita tanto horizontal como verticalmente para llenar el contenedor.

      Federico Maidana

      Federico Maidana

      student•
      hace 2 años

      Botzi, la duda es sobre figma ajajajaja

Escuelas

  • Desarrollo Web
    • Fundamentos del Desarrollo Web Profesional
    • Diseño y Desarrollo Frontend
    • Desarrollo Frontend con JavaScript
    • Desarrollo Frontend con Vue.js
    • Desarrollo Frontend con Angular
    • Desarrollo Frontend con React.js
    • Desarrollo Backend con Node.js
    • Desarrollo Backend con Python
    • Desarrollo Backend con Java
    • Desarrollo Backend con PHP
    • Desarrollo Backend con Ruby
    • Bases de Datos para Web
    • Seguridad Web & API
    • Testing Automatizado y QA para Web
    • Arquitecturas Web Modernas y Escalabilidad
    • DevOps y Cloud para Desarrolladores Web
  • English Academy
    • Inglés Básico A1
    • Inglés Básico A2
    • Inglés Intermedio B1
    • Inglés Intermedio Alto B2
    • Inglés Avanzado C1
    • Inglés para Propósitos Específicos
    • Inglés de Negocios
  • Marketing Digital
    • Fundamentos de Marketing Digital
    • Marketing de Contenidos y Redacción Persuasiva
    • SEO y Posicionamiento Web
    • Social Media Marketing y Community Management
    • Publicidad Digital y Paid Media
    • Analítica Digital y Optimización (CRO)
    • Estrategia de Marketing y Growth
    • Marketing de Marca y Comunicación Estratégica
    • Marketing para E-commerce
    • Marketing B2B
    • Inteligencia Artificial Aplicada al Marketing
    • Automatización del Marketing
    • Marca Personal y Marketing Freelance
    • Ventas y Experiencia del Cliente
    • Creación de Contenido para Redes Sociales
  • Inteligencia Artificial y Data Science
    • Fundamentos de Data Science y AI
    • Análisis y Visualización de Datos
    • Machine Learning y Deep Learning
    • Data Engineer
    • Inteligencia Artificial para la Productividad
    • Desarrollo de Aplicaciones con IA
    • AI Software Engineer
  • Ciberseguridad
    • Fundamentos de Ciberseguridad
    • Hacking Ético y Pentesting (Red Team)
    • Análisis de Malware e Ingeniería Forense
    • Seguridad Defensiva y Cumplimiento (Blue Team)
    • Ciberseguridad Estratégica
  • Liderazgo y Habilidades Blandas
    • Fundamentos de Habilidades Profesionales
    • Liderazgo y Gestión de Equipos
    • Comunicación Avanzada y Oratoria
    • Negociación y Resolución de Conflictos
    • Inteligencia Emocional y Autogestión
    • Productividad y Herramientas Digitales
    • Gestión de Proyectos y Metodologías Ágiles
    • Desarrollo de Carrera y Marca Personal
    • Diversidad, Inclusión y Entorno Laboral Saludable
    • Filosofía y Estrategia para Líderes
  • Diseño de Producto y UX
    • Fundamentos de Diseño UX/UI
    • Investigación de Usuarios (UX Research)
    • Arquitectura de Información y Usabilidad
    • Diseño de Interfaces y Prototipado (UI Design)
    • Sistemas de Diseño y DesignOps
    • Redacción UX (UX Writing)
    • Creatividad e Innovación en Diseño
    • Diseño Accesible e Inclusivo
    • Diseño Asistido por Inteligencia Artificial
    • Gestión de Producto y Liderazgo en Diseño
    • Diseño de Interacciones Emergentes (VUI/VR)
    • Desarrollo Web para Diseñadores
    • Diseño y Prototipado No-Code
  • Contenido Audiovisual
    • Fundamentos de Producción Audiovisual
    • Producción de Video para Plataformas Digitales
    • Producción de Audio y Podcast
    • Fotografía y Diseño Gráfico para Contenido Digital
    • Motion Graphics y Animación
    • Contenido Interactivo y Realidad Aumentada
    • Estrategia, Marketing y Monetización de Contenidos
  • Desarrollo Móvil
    • Fundamentos de Desarrollo Móvil
    • Desarrollo Nativo Android con Kotlin
    • Desarrollo Nativo iOS con Swift
    • Desarrollo Multiplataforma con React Native
    • Desarrollo Multiplataforma con Flutter
    • Arquitectura y Patrones de Diseño Móvil
    • Integración de APIs y Persistencia Móvil
    • Testing y Despliegue en Móvil
    • Diseño UX/UI para Móviles
  • Diseño Gráfico y Arte Digital
    • Fundamentos del Diseño Gráfico y Digital
    • Diseño de Identidad Visual y Branding
    • Ilustración Digital y Arte Conceptual
    • Diseño Editorial y de Empaques
    • Motion Graphics y Animación 3D
    • Diseño Gráfico Asistido por Inteligencia Artificial
    • Creatividad e Innovación en Diseño
  • Programación
    • Fundamentos de Programación e Ingeniería de Software
    • Herramientas de IA para el trabajo
    • Matemáticas para Programación
    • Programación con Python
    • Programación con JavaScript
    • Programación con TypeScript
    • Programación Orientada a Objetos con Java
    • Desarrollo con C# y .NET
    • Programación con PHP
    • Programación con Go y Rust
    • Programación Móvil con Swift y Kotlin
    • Programación con C y C++
    • Administración Básica de Servidores Linux
  • Negocios
    • Fundamentos de Negocios y Emprendimiento
    • Estrategia y Crecimiento Empresarial
    • Finanzas Personales y Corporativas
    • Inversión en Mercados Financieros
    • Ventas, CRM y Experiencia del Cliente
    • Operaciones, Logística y E-commerce
    • Gestión de Proyectos y Metodologías Ágiles
    • Aspectos Legales y Cumplimiento
    • Habilidades Directivas y Crecimiento Profesional
    • Diversidad e Inclusión en el Entorno Laboral
    • Herramientas Digitales y Automatización para Negocios
  • Blockchain y Web3
    • Fundamentos de Blockchain y Web3
    • Desarrollo de Smart Contracts y dApps
    • Finanzas Descentralizadas (DeFi)
    • NFTs y Economía de Creadores
    • Seguridad Blockchain
    • Ecosistemas Blockchain Alternativos (No-EVM)
    • Producto, Marketing y Legal en Web3
  • Recursos Humanos
    • Fundamentos y Cultura Organizacional en RRHH
    • Atracción y Selección de Talento
    • Cultura y Employee Experience
    • Gestión y Desarrollo de Talento
    • Desarrollo y Evaluación de Liderazgo
    • Diversidad, Equidad e Inclusión
    • AI y Automatización en Recursos Humanos
    • Tecnología y Automatización en RRHH
  • Finanzas e Inversiones
    • Fundamentos de Finanzas Personales y Corporativas
    • Análisis y Valoración Financiera
    • Inversión y Mercados de Capitales
    • Finanzas Descentralizadas (DeFi) y Criptoactivos
    • Finanzas y Estrategia para Startups
    • Inteligencia Artificial Aplicada a Finanzas
    • Domina Excel
    • Financial Analyst
    • Conseguir trabajo en Finanzas e Inversiones
  • Startups
    • Fundamentos y Validación de Ideas
    • Estrategia de Negocio y Product-Market Fit
    • Desarrollo de Producto y Operaciones Lean
    • Finanzas, Legal y Fundraising
    • Marketing, Ventas y Growth para Startups
    • Cultura, Talento y Liderazgo
    • Finanzas y Operaciones en Ecommerce
    • Startups Web3 y Blockchain
    • Startups con Impacto Social
    • Expansión y Ecosistema Startup
  • Cloud Computing y DevOps
    • Fundamentos de Cloud y DevOps
    • Administración de Servidores Linux
    • Contenerización y Orquestación
    • Infraestructura como Código (IaC) y CI/CD
    • Amazon Web Services
    • Microsoft Azure
    • Serverless y Observabilidad
    • Certificaciones Cloud (Preparación)
    • Plataforma Cloud GCP

Platzi y comunidad

  • Platzi Business
  • Live Classes
  • Lanzamientos
  • Executive Program
  • Trabaja con nosotros
  • Podcast

Recursos

  • Manual de Marca

Soporte

  • Preguntas Frecuentes
  • Contáctanos

Legal

  • Términos y Condiciones
  • Privacidad
  • Tyc promociones
Reconocimientos
Reconocimientos
Logo reconocimientoTop 40 Mejores EdTech del mundo · 2024
Logo reconocimientoPrimera Startup Latina admitida en YC · 2014
Logo reconocimientoPrimera Startup EdTech · 2018
Logo reconocimientoCEO Ganador Medalla por la Educación T4 & HP · 2024
Logo reconocimientoCEO Mejor Emprendedor del año · 2024
De LATAM conpara el mundo
YoutubeInstagramLinkedInTikTokFacebookX (Twitter)Threads