Os 11 principais atalhos de teclado da Figma para Windows e Mac

A Figma vem ganhando força no espaço do design. O software de esboço domina principalmente o setor de design de UI / UX. Mas as mais recentes ofertas da Adobe (Adobe XD) e Figma com preços flexíveis, compartilhamento contínuo e disponibilidade entre plataformas estão mudando a equação para os designers de UI / UX existentes.

A disponibilidade da Figma na Web, Windows e macOS, juntamente com seu excelente plano Starter (3 projetos e 2 editores), torna a escolha ideal para projetar, protótipo e dominar as habilidades de design da interface do usuário. Recentemente, a empresa lançou o tão esperado suporte Plugins para ele. Se você é novo no espaço de design de UI / UX e está iniciando sua jornada com o Figma, talvez queira memorizar vários atalhos de teclado essenciais do Figma para Windows e Mac.

Nesta postagem, abordaremos onze melhores atalhos de teclado Figma que você pode usar em um PC e Mac com Windows. Vamos começar.

Visitar Figma

1. Recursos de zoom mestre

Você não pode usar o Figma ou qualquer software de design de interface do usuário / UX sem dominar os atalhos de teclado do Zoom. Esses serão os atalhos de teclado mais usados ​​durante o seu fluxo de trabalho.

Para Windows e Mac, você pode usar Shift + 1 para ajustar as camadas à tela. Shift + 2 para ampliar o quadro selecionado (meu atalho de teclado mais usado, pois permite visualizar rapidamente os detalhes do componente selecionado) e Shift + 0 para ampliar 100%.

2. Mostrar / ocultar réguas e mostrar / ocultar grades de layout

Geralmente, não uso réguas na Figma, mas se você planeja usá-las durante o design da interface do usuário, pode usar o atalho do teclado Shift + R no PC ou Mac para mostrar / ocultar réguas.

Eu uso grades de layout o tempo todo. Permite organizar os componentes, ícones com a mesma distância, organizar o texto e outros elementos. Use o atalho de teclado Control + G no Mac para mostrar / ocultar grades de layout.

3. Ferramenta Caneta, Mover e Texto

Figma oferece uma ferramenta Pen poderosa e personalizável. Você entenderá o que quero dizer depois de jogar por alguns minutos. Durante o fluxo de trabalho de design, você utilizará bastante essas três ferramentas.

Você sempre pode escolhê-los no menu superior ou usar as teclas P para Caneta, V para mover e T para ferramenta de texto no Windows e Mac.

4. Mover entre camadas e componentes

Esses dois atalhos de teclado são bastante úteis quando você está trabalhando em um projeto de design com muitas camadas e componentes. Você pode precisar se mover constantemente entre eles. Você pode usar a Opção + 1 para Mac ou Alt + 1 para Windows para ir para o painel de camadas. Em seguida, use a opção + 2 para Mac ou Alt + 2 para Windows para ir ao menu Componentes.

5. Abra o Seletor de cores

Essa função é útil quando você deseja extrair cores de uma imagem ou ícone ou de qualquer outro componente. Você pode usar o atalho de teclado 'I' no Mac ou Windows para abrir o seletor de cores. Passe o mouse sobre o seletor de cores sobre uma imagem ou ícone e copie o código de cores no menu do seletor de cores.

6. Copiar / colar estilo atual

Este é um economizador de tempo real. Deseja copiar rapidamente a cor / design atual de um componente para outro texto ou ícone? Você pode selecionar o elemento atual e usar Option + Command + C para Mac ou Ctrl + Shift + C para Windows para copiar seu estilo. Agora selecione o outro elemento e use as opções Option + Command + V para Mac ou Ctrl + Shift + V para Windows para colar o estilo.

7. Seleção de Grupo / Desagrupamento

Agrupar e desagrupar são uma das partes mais importantes de qualquer software de design. Depois de adicionar formas, ícones, texto, convém agrupá-los para movê-los ou modificá-los facilmente. Você pode selecionar os elementos e usar Command + G para Mac ou Ctrl + G para Windows para criar um grupo.

Para desagrupá-los, use as teclas Command + Shift + G para Mac ou Ctrl + Shift + G para Windows.

8. Alterne para Bloquear e Desbloquear

Quando você cria um design com muitas camadas e componentes, a tela do Figma pode ficar bastante ocupada para você. Nesses cenários, você não deseja mover nenhum ícone, texto ou componente acidentalmente. Nesses casos, você pode selecionar o elemento e usar Command + Shift + L para Mac ou Ctrl + Shift + L para Windows para bloqueá-los.

É representado por um pequeno ícone de cadeado no menu Camadas. Para desbloquear, use o mesmo atalho de teclado.

9. Criar componentes

Os componentes são o coração e a alma da experiência de Figma. Convém reutilizar os mesmos elementos em toda a interface do usuário do design. Alguns exemplos podem ser um menu de hambúrguer, menu da barra inferior, botões, etc., que você deseja reutilizar para outras telas também.

Você pode agrupar os ícones e o texto usando a ferramenta Agrupar e, em seguida, use as opções Option + Command + K no Mac ou Ctrl + Alt + K no Windows para criar um componente. Agora, acesse-os no menu Componentes (verificação nº 4).

10. Mostrar biblioteca da equipe

Você sabe que Figma também é denominado como o Google Docs da indústria do design? O software vem com opções de compartilhamento contínuas que permitem adicionar editores à equipe.

Para grandes projetos, cada membro da equipe recebe uma tarefa separada para o design. Ao criar o design em um grupo, você pode visitar a biblioteca Equipe, que consiste em componentes e ícones comuns entre os membros. Você pode abrir o menu usando Command + Option + O no Mac ou Ctrl + Alt + O no Windows para abrir o menu da biblioteca da equipe.

11. Design de Exportação

Depois de concluir o design, convém usar a opção de exportação para extrair ícones e imagens do design para poder enviá-los aos desenvolvedores para implementá-los. Você pode selecionar a camada e usar as teclas Command + Shift + E para Mac ou Control + Shift + E para Windows para exportar os detalhes.

Use o Figma como um profissional

O Figma é uma excelente ferramenta para designers de UI / UX. É gratuito para iniciantes, permite o compartilhamento e vem com vários atalhos de teclado para facilitar o fluxo de trabalho. Implemente esses atalhos de teclado no seu fluxo de trabalho e crie belos designs de interface do usuário como um profissional.