Tutorial Completo de FIGMA - Ferramenta GRÁTIS para Design de Interfaces

Quer se tornar UX Designer em 3 meses? Eu preparei uma palestra online gratuita te ensinando como:
https://ux.gabrielsilvestri.com.br/aula

Timestamps:
(0:10) Como funciona o Figma
(2:40) Camadas e objetos
(3:10) Páginas
(4:10) Estilos
(6:30) Exportar arquivos e objetos (assets)
(8:30) Compartilhamento de arquivos em tempo real
(9:55) Integrações
(10:10) Ferramenta MOVE (Atalho: V)
(11:20) Ferramenta SCALE (Atalho: K)
(12:35) Ferramenta FRAME (Atalho: F)
(17:00) Constraints
(19:50) Grids (Tamanho ideal de tela + grids ideais)
(21:45) Figma MIRROR (App para iOS e Android)
(22:20) Ferramenta de formas geométricas
(23:45) Movimentação
(24:55) Componentes (Atalho: Ctrl+Alt+K)
(25:55) Máscaras (Atalho: Ctrl+Alt+M)
(26:40) Operações Booleanas
(27:35) Pen Tool (Atalho: P)
(27:45) Ferramenta Texto (Atalho: T)
(28:45) Copiar e colar efeitos e cores
(30:35) Alinhamentos (Tidy Up)
(33:00) Cropar imagens
(33:45) Icones
(35:00) Criando uma interface completa na prática
(41:20) Ver medidas em pixels segurando o ALT
(51:30) Criando um protótipo interativo

---

Neste vídeo você aprenderá TUDO que você precisa saber para começar a criar suas primeiras interfaces utilizando o Figma.

Vou te ensinar do básico ao avançado sobre como utilizar essa ferramenta que é 100% grátis e online :)

Esse vídeo foi feito para qualquer pessoa que deseja aprender sobre essa ferramenta, não é necessário ter conhecimentos pra aplicar os conteúdos desse guia

Nos comentários eu coloquei atalhos para que você possa voltar nesse vídeo e assistir somente as partes que você precisa aprender.

Confuso no inicio do vídeo? Aqui estão atalhos das ferramentas que eu usei (teclas do teclado, só pressionar):

R - Ferramenta de retângulo. Clicar com o botão esquerdo e arrastar pra criar uma forma.
F - Ferramenta de FRAME (é as "folhas de papel" em branco pra você criar interfaces). Mesma coisa do retângulo, só clicar e arrastar.
T - Ferramenta de TEXTO. Você pode usar de duas maneiras, 1) Clicar e arrastar pra criar uma área do texto ou 2) Só dar um clique pra inserir o texto.
V - Ferramenta de seleção. É a ferramenta que você usa para selecionar objetos :)
K - Ferramenta de ESCALA. Use essa ferramenta para aumentar e diminuir o tamanho de qualquer coisa, principalmente para TEXTOS.
H - Ferramenta HAND/PAN. Serve para se movimentar no arquivo.
L - Ferramenta de linha
SHIFT+L - Ferramenta de seta (você precisa ajustar os valores dela no painel da direita)

Outros atalhos úteis:

Segurar alt e movimentar o mouse vai te mostrar as medidas dos objetos no seu arquivo.
CTRL+D vai duplicar o último objeto clonado ou só simplesmente clonar ele em cima dele mesmo.
Segurar barra de espaço habilita o PAN (ferramenta hand) para você se movimentar no arquivo.
Segurar CTRL+Rodinha do mouse vai dar zoom na tela.
CTRL+G serve para agrupar elementos (é útil pra criar botões, etc)
CTRL+SHIFT+G desagrupa o grupo.
CTRL+SHIFT+L bloqueia ou desbloqueia um objeto ou grupo
N - Navega entre frames
SHIFT+R - Habilita réguas no arquivo
CTRL+Y - mostra só outline do projeto

Curtiu o vídeo? Inscreva-se no meu canal e me acompanhe nas redes sociais (links aqui na descrição)

Descubra como se tornar UX/UI Designer através do método UIPB e consiga um emprego com salários de R$ 1.800,00 à R$ 4.500,00 mesmo que você esteja começando do ZERO:
🔶 https://ux.gabrielsilvestri.com.br/cu...

🐱 CONTEÚDOS DIÁRIOS SOBRE DESIGN DE INTERFACES NO MEU INSTAGRAM:
🔶   / silvestri_gabriel  

🐱 [EBOOK GRÁTIS]
7 Passos para você se tornar UX/UI Designer e ganhar um salário de R$ 4.500,00 já nos próximos 3 meses:
🔶 https://gabrielsilvestri.com.br/ebook...

🐱 Artigos sobre Design, UX e UI no meu blog:

🔶 https://gabrielsilvestri.com.br​
🐱 Me acompanhe por aí:
• Blog » https://gabrielsilvestri.com.br​
• Instagram »   / silvestri_gabriel​  
• Canal YT »    / gabrielsilvestri  

__⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀

DesignGrafico​ #Design​ #uxui​ #ux​ #ui​ #uiuxdesign​ #uxdesign​ #uidesign​ #designdeinterfaces