Figma - Básico

Page 1

Uma ferramenta de UI online e gratuita, feita para criar, colaborar, prototipar e inspecionar.

Por Alice Willecke & Igor Mendes


O que é Para que serve Motivos para investir

clique em uma opção ao lado para acessar

Página Inicial Design File Fig Jam File


A solução surgiu no final de 2015

O Figma é uma ferramenta de design para interfaces, que oferece a possibilidade de trabalho colaborativo, ou seja, diversos membros de uma equipe podem explorar e atuar em um mesmo projeto. Ele funciona 100% online, como uma aplicação web.

Com isso, não é preciso baixar o programa ou aplicar atualizações constantes. Todos os projetos são salvos automaticamente na nuvem e, através de um link, como mostrado na figura abaixo, cada trabalho pode ser compartilhado

de maneira simples e fluida.

e foi conquistando seu lugar rapidamente no mercado, pelo fato de ser a pioneira na

colaboração em tempo real. Seu uso é simples e intuitivo, oferecendo diversas ferramentas, como formas, imagens, bibliotecas, prototipagem,

feedback dos usuários, componentes, entre muitas outras!

Voltar ao Menu


Além de ser um ótimo software de prototipagem para interfaces, o Figma também pode ser usado para criação de formatos para publicações nas redes sociais e como uma ferramenta de feedback, haja vista que diversas pessoas podem interagir em um mesmo projeto simultaneamente, de maneira

colaborativa. A área de UX tem foco em entender a necessidade do usuário, criando uma solução que atenda suas dores. Sendo assim, ferramentas como o Figma, que facilitam diversas etapas desse processo, são ótimos meios para se construir boas experiências.

Voltar ao Menu


Trabalho colaborativo e fácil compartilhamento

O Figma possui um sistema que permite o

Além da possibilidade de vários membros de

gerenciamento de projetos, de times e

uma equipe poderem trabalhar juntos em

permissões de acesso para um trabalho.

um mesmo projeto simultaneamente, você

Você pode categorizar os seus trabalhos

não precisa baixar, exportar em PDF ou

entre pessoais ou de times e determinar

outros formatos para poder compartilhar

quem pode administrar, editar ou visualizar

um trabalho com seu cliente, por exemplo.

qualquer documento.

Basta apenas gerar um link, como no Google

Gestão dos projetos

Vector networks O Figma possui uma ferramenta própria para vetorização, que é completamente diferente de seus concorrentes, como o

Illustrator. Os vetores não possuem uma direção e os pontos de um podem se conectar com mais de uma linha ao mesmo tempo.

Docs, e acessar pelo próprio navegador.

Voltar ao Menu


Artboards simultâneas Cada projeto permite a criação de diversas artboards simultâneas. Os seus concorrentes, como o Photoshop, também permitem essa mesma funcionalidade, mas se juntarmos as facilidades e a fluidez do software, esse motivo acaba valendo muito a pena!

Qualquer navegador e sem ocupar espaço! O Figma foi criado para rodar em navegadores e é 100% online, ou seja, o programa, e muito menos os arquivos, não irá ocupar espaço em seu computador e pode rodar em qualquer sistema operacional. E um plus: o plano inicial é grátis para até duas pessoas simultâneas.

Voltar ao Menu


Voltar ao Menu


Você pode se cadastrar preenchendo os seus dados ou com o seu e-mail, gratuitamente.

Voltar ao Menu


Voltar ao Menu


Acessar seu perfil / Comunidade

Pesquisar

Notificações

• • • • •

Informações do Perfil Plugins Configurações Adicionar conta Sair

Voltar ao Menu


Projetos recentemente criados/ajustados Todos os projeto e esboços criados Projetos de outros profissionais Compra de novas funcionalidades

Criação de pastas e times para organizar e fazer a gestão dos projetos

Voltar ao Menu


Visualização de projetos recentes

Voltar ao Menu


Criar novo design, protótipo e importar projetos desenvolvidos por outras ferramentas Ferramentas para UI: desenvolver páginas de web e aplicativos, para mobile ou desktop. Quadro branco, diagramação e colaboração Quadro interativo: para desenhar, vetorizar, criar textos, post-its, etc.

Modelos disponíveis

Voltar ao Menu


Abas de arquivos

Menu principal: Ações rápidas, importação e exportação de arquivos, inserção de textos e objetos, plug-ins, preferências, e etc. Camadas e objetos (v): Aqui aparecerá a listagem de todas as páginas e elementos do layout para que possa selecioná-los.

Prancheta (f) e Fatiar (s) : A prancheta é o “quadro branco” onde você irá criar a sua arte. Aqui, você poderá definir o tamanho, ou escolher o tamanho de algum dispositivo (Iphone, Ipad, Desktop...), que aparece no lado direito. Já a opção “fatiar”, é uma faca onde você irá definir como serão feitas as fatias do seu layout para salvá-los de forma isolada, caso necessário. Elementos: Selecionar e inserir formas, e importar imagens do seu computador. Caneta (p): Criar vetores personalizados. Texto (t): Criar textos. Mão (h): Para deslizar pela tela. Comentário (c): Adicionar comentários e Feedbacks do projeto.

Voltar ao Menu


Layers (Camadas): Todos as pranchetas e elementos ficam organizados por camadas neste menu. Aqui você pode mover os elementos (é só arrastar), ou renomear (é só clicar duas vezes e escrever). Assets: padronizar componentes, icones, etc. Tudo que você salvar como componente vai ficar disponível para uso nessa aba. Página: Criar e navegar entre as páginas.

Voltar ao Menu


Prancheta

Voltar ao Menu


Visualizar Share: Compartilhar com time para colaborar com o projeto ou apenas para visualização.

Design: Todas as informações dos elementos (cores, dimensões...), além de inserir efeitos e ajustar cor, brilho, contraste e etc. Prototype: Funções para prototipagem. Ações de botões, templates de dispositivos para demonstração e exportação dos layouts. Inspect: Inspecionar o projeto, avaliando as dimensões, cores e códigos.

Voltar ao Menu


Templates Disponíveis

Voltar ao Menu


Menu principal: Ações rápidas, importação e exportação de arquivos, inserção de textos e objetos, plug-ins, preferências, e etc.

Colaboração: Inserir emojis, carimbos, abrir chat e cronometrar.

Voltar ao Menu


Voltar ao Menu


Ferramentas para inserir no projeto:

Voltar ao Menu


Clique no box para acessar

Voltar ao Menu



Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.