• Saltar a la navegación principal
  • Saltar al contenido principal
  • Saltar al pie de página

Juanpol

Diseño UX y UI / Creación de productos digitales

  • Tutoriales de Figma
  • Blog
  • Newsletter
  • 🔴 YouTube

Auto Layout con atajos de teclado

Aquí te voy a explicar de la manera más detallada posible cómo crear un Auto Layout con atajos de teclado en Figma.

auto layout atajos teclado
La combinación de teclas para crear un Auto Layout / Icono: Freepik

En el artículo donde repasé todas las características del Auto Layout te comenté que podemos crearlo de 4 formas posibles, una de ellas es utilizando la combinación de teclas Shift + A.

Si te interesa saber cuáles son los otros métodos para crearlo visita por favor el artículo Auto Layout de Figma.

Para complementar el tutorial en vídeo voy a transcribir su contenido para que puedas usarlo de guía si deseas hacer prácticas.

Crear un Auto Layout con atajos de teclado

En este tutorial vamos a crear un Auto Layout utilizando keyboard shortcuts.

El vídeo estará disponible en breve.

En el Canvas tenemos dos objetos, un icono de herramientas y una cadena de texto, con estos elementos vamos a crear el Auto Layout.

Lo primero que haremos será seleccionarlos con el ratón. Fíjate en la pestaña Layers del sidebar izquierdo cómo se ven ambos objetos seleccionados.

Ahora vamos a crear el Auto Layout a partir de nuestra selección. Para ello simplemente pulsaremos dos teclas, Shift + A o Mayúsculas + A.

Presta atención a los siguientes detalles:

  • En principio podemos decir que los dos objetos están agrupados y es verdad, pero en realidad están dentro del Auto Layout que acabamos de crear.
  • Fíjate cómo ha cambiado la alineación de los objetos, como ves no es la misma que tenían antes en el Canvas. Lo que ocurre es que Figma le ha dado por defecto una alineación cuando aplicó Automagical, justo después de utilizar la combinación de teclas.
  • Si volvemos a la pestaña Layers vemos ahora un Frame con propiedades de Auto Layout, si te fijas el icono es el de un Auto Layout y no el de un Frame.
  • Si desplegamos el ítem podemos ver en su interior el icono de las herramientas y el texto que lo acompaña.
  • En otros tutoriales ya veremos cómo cambiar la alineación de los objetos que están dentro de un Auto Layout.


Ya hemos creado un Auto Layout utilizando una combinación de teclas, si tienes alguna duda por favor deja un comentario.

Nada más por ahora, te espero en el siguiente tutorial.

Muchas gracias.

Aprende a usar Figma, Sketch y Webflow

Suscríbete gratis para recibir notificaciones cuando publique nuevos contenidos.

Revisa tu bandeja de entrada o la carpeta de spam para confirmar tu suscripción.

Información de privacidad

En este sitio web te solicito algunos datos para enviarte correos electrónicos con las publicaciones que hago. Finalidad de los datos: Enviar correos electrónicos con las novedades publicadas en el blog. Legitimación: Aceptación expresa de la política de privacidad. Almacenamiento de los datos: Base de datos alojada en Siteground España. Duración: Hasta que lo solicites. Derechos: En cualquier momento puedes limitar, recuperar y borrar tu información.

juanpol

Acerca de Juanpol

Product Designer, Diseñador UX/UI y creador de contenido con 29 años de experiencia. Trabaja en Freepik Company.

Interacciones con los lectores

Deja una respuesta Cancelar la respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *


En este sitio web te solicito algunos datos para poder moderar y responder comentarios de usuarios. Responsable de los datos: Juan Pablo Olmo / Finalidad de los datos: Gestionar los comentarios y evitar el spam. / Legitimación: Aceptación expresa de la política de privacidad. / Almacenamiento de los datos: Base de datos alojada en Siteground España. / Duración: Hasta que lo solicites. / Derechos: En cualquier momento puedes limitar, recuperar y borrar tu información.

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.

Footer

Te puede interesar

  • Componentes interactivos de Figma
  • Los mejores plugins de Figma en 2023
  • Cómo crear un scroll en Figma
  • ¿Qué es Figma y para qué sirve?

Información

  • Juanpol
  • Contacto

Juanpol

Juanpol

Diseño UX y UI / Creación de productos digitales

  • info@juanpol.com
  • LinkedIn
  • YouTube
  • Telegram
  • Twitter

  • Privacidad

Utilizamos cookies propias y de terceros para fines analíticos y para mostrarte publicidad personalizada o a partir de tus hábitos de navegación. Puedes informarte más sobre ellas en los ajustes

Resumen de privacidad

Utilizamos cookies propias y de terceros para fines analíticos y para mostrarte publicidad personalizada o a partir de tus hábitos de navegación. Puedes cambiar la configuración u obtener más información consultando la política de cookies.

Cookies de terceros

Esta web utiliza herramientas de estadística para recopilar información anónima tal como el número de visitantes del sitio, o las páginas más populares.

Dejar esta cookie activa nos permite mejorar nuestra web.

¡Por favor, activa primero las cookies estrictamente necesarias para que podamos guardar tus preferencias!

Política de cookies

Más información sobre nuestra política de cookies.