CursosEmpresasBlogLiveConfPrecios

Creación de textos y estilos

Clase 4 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 min
  • 2
    Interfaz en Figma

    Interfaz en Figma

    09:34 min
  • Introducción

Básicos

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

    Configuración de guías y retículas

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

    Creación de textos y estilos

    Viendo ahora
  • 5
    Figuras e imágenes en Figma

    Figuras e imágenes en Figma

    13:22 min
  • 6
    Efectos en Figma

    Efectos en Figma

    07:02 min
  • 7
    Redes de Vectores

    Redes de Vectores

    15:20 min
  • 8
    Colores en Figma

    Colores en Figma

    09:50 min
  • Básicos

Combo

  • 9
    Importar y exportar

    Importar y exportar

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

    Cómo crear guías de estilo

    07:33 min
  • 11
    Auto-Layout

    Auto-Layout

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

    Los 15 mejores atajos para trabajar en Figma

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

    Creación de componentes reutilizables: clase teórica

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

    Creación de componentes reutilizables: clase práctica

    11:37 min
  • 15

    Playground: Practica la creación de componentes reutilizables

  • Combo

Prototipado

  • 16
    Prototipado simple: interacción de scroll

    Prototipado simple: interacción de scroll

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

    Prototipado simple: conexión de diferentes frames

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

    Prototipado avanzado: smart animate y componentes Interactivos

    07:19 min
  • Prototipado

Co-Creando

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

    Cómo agregar comentarios a los diseños

    05:53 min
  • 20
    Historial de versiones en Figma

    Historial de versiones en Figma

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

    Librerías de estilos y componentes

    05:21 min
  • Co-Creando

Superpoderes

  • 22
    FigJam

    FigJam

    06:40 min
  • 23
    Uso de plugins en Figma

    Uso de plugins en Figma

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

    Community: proyectos open-source y perfiles

    05:36 min
  • Superpoderes

Cierre

  • 25
    Proyecto final del curso de Figma

    Proyecto final del curso de Figma

    02:01 min
  • Tomar el examen del curso
    • Shakira Derteano

      Shakira Derteano

      student•
      hace 3 años

      Para previsualizar en Windows es con: (Shif + G)

        JOSE ENRIQUE GARCIA CRUZ

        JOSE ENRIQUE GARCIA CRUZ

        student•
        hace 3 años

        Muchas gracias, es correcto.

        Layout grids: ⌃ G

        DARWIN JUAN CARLOS CATUNTA GARCIA

        DARWIN JUAN CARLOS CATUNTA GARCIA

        student•
        hace 3 años

        Muchas gracias 😃

      Rodrigo Contreras Rubio

      Rodrigo Contreras Rubio

      student•
      hace 3 años

      ++apuntes de comandos básicos de Figma++

      • F: para entrar a la herramienta Frame
      • V: para entrar a la herramienta Move
      • T: para entrar a la herramienta Text
      • ctrl ó cmd + B: Bold ó Negrita
      • ctrl ó cmd + I: Italic ó cursiva
      • ctrl ó cmd + U: Underline ó subrayado
      • scroll: mover hacia arriba o abajo
      • shift + scroll: mover a izquierda o derecha
      • ctrl ó cmd + scroll: acercar o alejar
        Natalia Prada Gaitán

        Natalia Prada Gaitán

        student•
        hace 3 años

        Gracias

        Rafael Simón Acendra Castillo

        Rafael Simón Acendra Castillo

        student•
        hace 3 años

        Wao gracias!

      Hugo Caceres

      Hugo Caceres

      student•
      hace 3 años

      Envio mi trabajo

      Captura de pantalla 2022-10-12 110651.png

        Karimar Victoria Bracho

        Karimar Victoria Bracho

        student•
        hace 3 años

        <3

        William Ruiz

        William Ruiz

        student•
        hace un año

        gracias por tu aporte hugo

      ISAAC DANIEL ATAUCURI YNFANTE

      ISAAC DANIEL ATAUCURI YNFANTE

      student•
      hace 3 años

      • Texto(t): o Bloque fundamental en cualquier interfaz. o Propiedades: Fuente-Espaciado-Alineación. o Comandos:  Ctrl + b: negra  Ctrl+ i: italizado  Ctrl + u: subrayar  Shift+g: previsualizar. o Estilo de texto:  Propiedad global que puede ser reutilizable a lo largo de archivos y proyectos. • Proyecto: o Creamos el texto de contenido y creamos el estilo texto 00. o Y para el título creamos el estilo de título 00. o El título se ve mejor en 30 y el texto NUNCA PUEDE SER MENOR A 14. o Trabaja con el tamaño de cajas de texto múltiplos de 8 porque los px van de 8 en 8.

      Julver Ticona Vargas

      Julver Ticona Vargas

      student•
      hace 3 años

      Para los Keyboard Shortcuts presionar el boton de la esquina inferior derecha con el simbolo (?) y darle a la opcion "Keyboard Shortcuts"

      Captura2.PNG

        David Emmanue Cano Cabrera

        David Emmanue Cano Cabrera

        student•
        hace 2 años

        Esta genial, pues no solo te muestra shortcuts ( que por cierto se puede abrir directamente con Ctrl + Shift + ? ) sino que también se muestran resaltados aquellos que ya han sido utilizados. Expectacular para llevar registro de aquellos que ya hemos aprendido. 😉

        Fanny Barraza

        Fanny Barraza

        student•
        hace 2 años

        GRacias!! Muestra hasta los que se están usando en el momento :D

      Lucemar Quintero Laguado

      Lucemar Quintero Laguado

      student•
      hace 3 años
      Mi primera nota.png
        Miriam Quispe

        Miriam Quispe

        student•
        hace 3 años

        ¡Genial!. Muy bien aplicado la presente clase.

      German Pinilla

      German Pinilla

      student•
      hace 3 años

      ++Creación de textos y estilos++

      Bloque fundamental de cualquier interfaz es el texto

      Un objeto de texto tiene diferentes propiedades

      • Texto
        • Fuente
        • Espaciado
        • Alineacion
      • Color

      ++Atajos para la creacion y de edicion de texto++ ctrl ó cmd + B: Bold ó Negrita ctrl ó cmd + I: Italic ó cursiva ctrl ó cmd + U: Underline ó subrayado

      ++Que es un estilo?++ Son propiedades globales de los elementos que pueden ser reutilizables a lo largo de varios archivos o proyectos.

      Cristhian Villar

      Cristhian Villar

      student•
      hace 3 años

      Team, Recuerden que para deshacer una accion el gran CONTROL + Z cuando se equivoquen y volver al paso anterior..

      CONTROL + Y para volver a lo que se deshizo.

        Eduardo Zegers

        Eduardo Zegers

        student•
        hace 3 años

        Me gustó lo de Team :D

      Kevin Armando Luciano García

      Kevin Armando Luciano García

      student•
      hace 3 años

      Si no tienes idea de que texto de relleno agregar en tu ejercicios, puedes usar los famosos "lorem ipsum" En esta página https://www.lipsum.com/ puedes generar párrafos, palabras, listas, etc. Espero te sea de ayuda. 😎

        Roxana Carvallo

        Roxana Carvallo

        student•
        hace 3 años

        Sii, también recomiendo mucho este plugin es súper útil https://www.figma.com/community/plugin/736000994034548392/Lorem-ipsum

        Schormeiker Elieser Lugo Garcia

        Schormeiker Elieser Lugo Garcia

        student•
        hace 3 años

        genial muchas gracias por el dato :D

      Cristhian Villar

      Cristhian Villar

      student•
      hace 3 años

      Asi vamos… Datico, para poner imagenes en este chat de Platzi, toca guardar la imagen en tu PC como jpg y arrastras la imagen a este cuadrito…

      Mi Primera Nota.jpg
      Jeisson Espinosa

      Jeisson Espinosa

      student•
      hace 3 años

      Información resumida de esta clase #EstudiantesDePlatzi

      • El texto es el bloque principal sobre la interfaz

      • El objeto texto tiene 2 propiedades que son el texto como tal y el color

      • Dentro de la propiedad texto podemos modificar la fuente, espaciados, alineación, entre otros más

      • Existen comandos rápidos para mayor velocidad

      • Figma me permite crear estilos que puedo reutilizar a lo largo de mi proyecto

      • El objeto texto puede ser muy editable al manipular todas las propiedades que nos deja Figma

      • Con la tecla Alt puedo observar las medidas de los espaciados que van quedando

      • Parece que es recomendable trabajar sobre múltiplos de lo que definimos nuestra grilla

      • Puedo utilizar valores en porcentaje para definir las propiedades

      • Lo recomendable es crear estilos para usarlos de manera más rápida en un futuro

      • Ctrl + B = Negrilla, Ctrl + U = Subrayado, Ctrl + i = Italizado

      Esmeralda Sánchez Torres

      Esmeralda Sánchez Torres

      student•
      hace 3 años
      Captura de pantalla 2023-04-17 132252.png
      Gabriel Ignacio Tapia

      Gabriel Ignacio Tapia

      student•
      hace 3 años

      Les dejo mi avance y de paso la pueden hacer :D

      Aplicación de notas.png
      Jonathan Restan Chamorro

      Jonathan Restan Chamorro

      student•
      hace 3 años

      les pasa que el + al omento de agregar el texto como estilo, les aparece deshabilitado?

        Kevin Armando Luciano García

        Kevin Armando Luciano García

        student•
        hace 3 años

        ¡Hola! Fíjate que no me pasa, lo estoy probando desde macOS y todo marcha bien.

        Uriel Barranco Robles

        Uriel Barranco Robles

        student•
        hace 3 años

        Hola, me sucedió lo mismo, por alguna razón no se habilitaron los estilos en el grupo que se crea en Figma, la forma en la que lo solucioné fue:

        1.- Eliminar el team. 2.- Crear un nuevo team.

        Espero te sirva, saludos.

      Maria Cristina Del Pilar De la Barra Portocarrero

      Maria Cristina Del Pilar De la Barra Portocarrero

      student•
      hace 3 años
      Selección_047.png
        Eddie Mora

        Eddie Mora

        student•
        hace 2 años

        Me encanta tu nombre !

      David Cáceres

      David Cáceres

      student•
      hace 3 años

      ¿Como va todo chicos?

      2022-10-09.png

      Utilice un texto desde wikipedia para probar los diferentes estilos de texto.

      Saludos.

        Cindy Milena Fontalvo Jiménez

        Cindy Milena Fontalvo Jiménez

        student•
        hace 2 años

        Que genial, interesante David.

      Lara Albornoz

      Lara Albornoz

      student•
      hace 3 años

      Mi primer aporte 🥰🥰

      gatitos.png

      Liliana Marcela Herrera Morales

      Liliana Marcela Herrera Morales

      student•
      hace 3 años

      ![](

      MI PRIMERA NOTA.png

      CLAUDIA TATIANA LADINO MORENO

      CLAUDIA TATIANA LADINO MORENO

      student•
      hace 3 años
      Imagen4.png
      Jimena Haran

      Jimena Haran

      student•
      hace 3 años

      Mi aporte :

      notas.jpg

    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