lunes, 26 de julio de 2021

110 Shortcuts esenciales de Figma para diseñadores

110 Shortcuts esenciales de Figma para diseñadores

Descubre los atajos de teclado básicos para diseñar más ágilmente en la aplicación de edición de gráficos

Figma es una de las aplicaciones de edición de gráficos más populares del mundo del diseño. Dos de las cosas que la hace tan conocidas son, probablemente, el hecho de que es de uso gratuito y su versatilidad.

Si aún no te es familiar, a continuación te resumimos sus características, y si ya usas Figma en tu proceso de diseño, te brindamos sus shortcuts más importantes.

¿Qué es exactamente Figma?

Figma es una aplicación de diseño de interfaz de usuario y edición de gráficos disponible en la web. Se puede utilizar para crear muchos tipos de trabajos de diseño como:

- Sitios web
- Interfaces de aplicaciones móviles
- Prototipos
- Publicaciones en redes sociales
- Diseños UX y mucho más

Figma, además, se diferencia de otras herramientas de edición de gráficos, principalmente, porque funciona directamente en tu navegador y no exige la compra de licencias ni la instalación de software. Además, también permite crear y almacenar 3 proyectos activos a la vez lo cual seduce a muchos profesionales.

Cualquiera que sea tu nivel en Figma, puedes utilizar estos atajos de teclado que te serán de gran ayuda para acelerar tu trabajo.

Atajos básicos

Nota 1: En Windows usa Ctrl, en Mac reemplazalo por Command
Nota 2: En Windows usa Alt. en Mac reemplazalo por Opción

- Mostrar / Ocultar interfaz de usuario → CTRL \
- Elegir color → ⌃ C
- Acciones rápidas → CTRL / o CTRL P

Herramientas

- Herramienta de movimiento → V
- Lapicera → PAG
- Herramienta Lápiz → ⇧ P
- Herramienta de texto → T
- Herramienta rectangular → R
- Herramienta elipse → O
- Herramienta de línea → L
- Herramienta flecha → ⇧ L
- Agregar comentario → C
- Elegir color → I
- Deslizar hoja → S

Vista

- Mostrar / Ocultar interfaz de usuario → CONTROL \
- Cursores multijugador → Alt CTRL \
- Gobernantes → ⇧ R
- Contornos → CTRL Y
- Vista previa de píxeles → ⌃ P
- Cuadrículas de diseño → ⌃ G
- Cuadrícula de píxeles → CTRL `
- Panel de capas abiertas → Alt 1
- Panel de activos abiertos → Alt 2
- Panel de diseño abierto → Alt 8
- Panel prototipo abierto → Alt 9
- Panel de inspección abierto →Alt 0

Zoom

- Acercarse → +
- Disminuir el zoom → -
- Zoom al 100% → ⇧ 0
- Zoom para encajar →⇧ 1
- Zoom a la selección → ⇧ 2
- Zoom al fotograma anterior →⇧ N

Texto

- Negrita → CTRL B
- Itálico → CTRL I
- Subrayar → CTRL U
- Crear vínculo → CTRL K
- Tachado → ⇧ CTRL X
- Conviértelo en una lista → ⇧ CTRL 7
- El texto se alinea a la izquierda → Alt CTRL L
- Centro de alineación de texto → Alt CTRL T
- El texto se alinea a la derecha →Alt CTRL R
- Alinear texto justificado → Alt CTRL J
- Ajustar el tamaño de la fuente → ⇧ CTRL <y ⇧ CTRL>
- Ajustar el peso de la fuente → Alt CTRL <y Alt CTRL>
- Ajustar el espaciado de letras → Alt <y Alt>
- Ajustar la altura de la línea → ⇧ Alt <y ⇧ Alt>

Forma

- Bolígrafo → PAG
- Lápiz → ⇧ P
- Bote de pintura → B
- Herramienta de doblado → CTRL
- Quitar relleno → Alt /
- Quitar trazo → /
- Intercambiar relleno y trazo →⇧ X
- Trazo de contorno → ⇧ CTRL O
- S.elección de aplanar → CTRL E
- Unirse a la selección → CTRL J
- Selección de unión suave → ⇧ CTRL J
- Eliminar y curar la selección → ⇧ Eliminar

Selección

- Seleccionar todo → CTRL A
- Selección inversa → ⇧ CTRL A
- No seleccionar ninguno → Esc
- Selección profunda → Haga clic en CTRL
- Seleccionar menú de capa → CTRL clic derecho

- Selecciones de grupo → CTRL G
- Desagrupar selección → ⇧ CTRL G
- Selección de fotogramas → Alt CTRL G
- Mostrar / Ocultar selección → ⇧ CTRL H
- Selección de bloqueo / desbloqueo → ⇧ CTRL L

Cursor

- Mida a la selección (mientras apunta) → Alt
- Selección duplicada (mientras se mueve) → Alt
- Selección profunda → Haga clic en CTRL
- Seleccionar menú de capa → CTRL Clic derecho
- Selección profunda dentro del rectángulo → CTRL Arrastrar
- Cambiar el tamaño desde el centro (mientras arrastra) → Alt
- Cambiar el tamaño proporcionalmente (mientras se arrastra) →
- Mover mientras cambia el tamaño (mientras arrastra) → Espacio
- Ignorar restricciones (solo fotogramas, mientras se arrastra) → v CTRL

Editar

- Cortar → CTRL X
- Pegar → CTRL V
- Pegar sobre la selección → ⇧ CTRL V
- Duplicar → CTRL D
- Cambiar el nombre de la selección → CTRL R
- Exportar → ⇧ CTRL E
- Copiar propiedades → Alt CTRL C
- Pegar propiedades → Alt CTRL V
- Copiar como PNG → ⇧ CTRL C

Transformar

- Flip horizontal → ⇧ H
- Voltear vertical → ⇧ V
- Usa una mascarilla → ⌃ CTRL M
- Editar forma o imagen →
- Colocar imagen → ⇧ CTRL K
- Delimitar imagen → Alt doble clic
- Establecer la opacidad en 10 → 1
- Establecer la opacidad en 50 → 5
- Establecer la opacidad en 100 → 0

Arreglar

- Adelantar → CONTROL ]
- Enviar atrás → CONTROL [
- Traer al frente → Alt CTRL [
- Enviar al fondo → Alt CTRL]
- Alinear a la izquierda → Alt A
- Alinear a la derecha → Alt D
- Alinear la parte superior → Alt W
- Alinear la parte inferior → Alt S
- Alinear centros → Alt H y Alt V
- Distribuir el espaciado → ⌃ Alt H y ⌃ Alt V
- Organizar → ⌃ Alt T
- Agregar diseño automático → ⇧ A
- Eliminar diseño automático → Alt ⇧ A

Componentes

- Mostrar activos → Alt 2
- Biblioteca del equipo → Alt CTRL O
- Crear componente → Alt CTRL K
- Separar intenso → Alt CTRL B
- Instancia de componente de intercambio → Alt Con estos shortcuts podrás acelerar tu flujo de trabajo y ganar efectividad.

¿Quieres aprender cómo hacer uso de las herramientas que ofrece Figma? Puedes hacerlo en el curso Diseño de aplicaciones: creación de prototipos para principiantes de Filippos Protogeridis.

También te puede interesar:

- ¿Qué es el diseño UX y UI?
- Dos y Don'ts del Diseño UX
- Las tendencias de UX que nos trae 2020

denise.tempone

No hay comentarios.:

Publicar un comentario