Figma es una poderosa herramienta de diseño y es la primera opción de la mayoría de los diseñadores de UX/UI como programa de diseño. Puedes crear mucho dentro de Figma, y es un programa fácil de aprender.
Como diseñadores, a menudo buscamos ahorrar tiempo, por lo que dedicamos nuestras preciosas horas a crear un buen trabajo en lugar de navegar por los menús. Recopilamos una lista de atajos útiles de Figma que agilizarán su flujo de trabajo.
Este simple atajo de una tecla es una forma rápida de escalar sus artículos. Golpea el k y luego seleccione el objeto que necesita cambiar de tamaño. Todo lo que necesita hacer es hacer clic y arrastrar un punto de anclaje y su objeto permanece en escala mientras cambia el tamaño a lo que necesite que sea.
La herramienta Marco es una herramienta muy utilizada en Figma cuando se crean múltiples tableros de marcos para diseños de prototipos. Golpear
F en su teclado abre la herramienta con un solo toque, lo que le permite dibujar o cambiar el tamaño de su marco rápidamente.Puede dibujar el marco directamente haciendo clic y arrastrando el cursor, o una vez seleccionada la herramienta Marco, puede escribir los tamaños deseados en los cuadros de dimensiones en el menú del marco a la derecha.
3. Cambiar entre los modos de diseño y prototipo
El Cambio + mi El acceso directo le permite cambiar entre el modo Diseño y el modo Prototipo. El mismo atajo funciona independientemente del modo desde el que comience y al que cambie. Vea nuestro guía para principiantes de Figma para aprender las diferencias entre estos modos.
Alternativamente, existen atajos más específicos para este propósito. alternativa (ventanas) / Opción (Mac) + 8 se puede usar para cambiar del modo Prototipo al modo Diseño, mientras que alternativa (ventanas) / Opción (Mac) + 9 cambia del modo Diseño al modo Prototipo. Obviamente, Cambio + mi es más fácil, pero es bueno tener opciones.
4. Seleccione el elemento más interno con un clic (selección profunda)
Al diseñar en varias capas o con imágenes incrustadas, puede ser difícil seleccionar un elemento rápidamente. Para ahorrar tiempo, haga clic lo que parece una docena de veces para seleccionar la capa más inferior, use este atajo en su lugar.
En una Mac, mantén presionado Comando + Hacer clic el elemento, y en Windows, Control + Hacer clic. Una simple tecla ahorra minutos de clics sin sentido para seleccionar un elemento de la capa inferior.
5. Salir un nivel después de seleccionar el elemento más interno
Una vez que haya logrado seleccionar el elemento más interno de su diseño, es posible que se dé cuenta de que desea seleccionar un elemento un nivel más cercano, fácil. Una vez que haya encontrado el elemento más interno, pulse Cambio + Ingresar para retroceder un nivel. Puedes hacer esto para todos los niveles.
6. Contraer todas las capas
Al diseñar en Figma, su panel de capas comenzará a expandirse y potencialmente se verá un poco desordenado, especialmente cuando convertir HTML a un diseño de Figma. Para colapsar sus capas, simplemente presione alternativa + L (ventanas) o Opción + L (Mac).
Si tiene un elemento seleccionado mientras usa este atajo, la capa con ese elemento permanecerá abierta. Seleccione cualquier lugar fuera de la mesa de trabajo para anular la selección de todos los elementos y use el acceso directo para colapsar todas las capas.
7. Mostrar u ocultar cuadrículas de diseño
El uso de cuadrículas de diseño es la mejor manera de asegurarse de que su diseño alcance ciertas proporciones y se pueda escalar correctamente para varios dispositivos. Si bien son útiles, no siempre desea que se muestren las cuadrículas.
Activar y desactivar cuadrículas de diseño es diferente en una Mac que en Windows. En una Mac, presione Control + GRAMO para activarlo o desactivarlo. Si está usando Windows, es un atajo de tres teclas; Control + Cambio + 4. Son diferentes, pero hacen lo mismo.
8. Coloque varias fotos a la vez
Si ha diseñado un diseño con formas de marcador de posición listas para sus imágenes, puede ser frustrante insertar las imágenes una por una. Este acceso directo le permite colocar varias fotos y simplemente seleccionar el marcador de posición, o cualquier lugar de su mesa de trabajo, para colocar cada foto individual.
Para usuarios de Mac, pulse Comando + Cambio + k para abrir la ventana de diálogo para encontrar sus imágenes. En Windows, es Control + Cambio + k para que encuentres y coloques varias fotos en tu diseño de Figma. Si usted crear una plantilla maestra en Figma, este es un gran atajo para usar.
9. Copie cualquier imagen como PNG
Al usar imágenes en su diseño de Figma, es posible que tenga una variedad de formatos de archivo, pero tal vez su cliente requiera PNG. Puede copiar cualquier imagen como PNG, independientemente de su formato de origen.
Seleccione su imagen elegida y pulse Comando + Cambio + C en Mac y Control + Cambio + C en Windows para copiarlo como PNG. Puede usar fácilmente este atajo para garantizar un formato de imagen de alto estándar, especialmente si está Crear presentaciones con Figma.
10. Colirio de un color desde cualquier lugar
Hacer caer la vista de un color es una característica útil cuando se toma un color de una parte de su diseño a otra. Este atajo de teclado rápido le permite levantar el cuentagotas en un segundo y ver un color desde cualquier lugar de su mesa de trabajo.
En Mac, presione Control + C, y en Windows es la tecla de letra I. Una vez que haya presionado los atajos de teclado, mueva el objetivo del cuentagotas sobre el color que desea usar y haga clic una vez para ver el color.
11. Abra la pestaña Recursos
La pestaña Recursos alberga los menús Componentes, Complementos y Widgets. Si bien no hay accesos directos para abrir esos menús individualmente, el acceso directo de Recursos aún ahorra algo de tiempo: Cambio + I. Puede use complementos para crear y agregar maquetas a sus diseños de Figma.
Ahorre tiempo con los atajos de Figma
Los diseñadores suelen utilizar atajos en su trabajo para ahorrar tiempo y energía, y trabajar en Figma no es diferente. Estos atajos de Figma solo arañan la superficie de los atajos que puede usar en el programa.
Estos atajos no son obvios ni fáciles de encontrar, así que lleve sus nuevos aprendizajes a Figma y deléitese con la información que muchos diseñadores tardan meses o años en descubrir.
