Lista de Exercícios – Figma, UI e UX Design
Conceitos de UI e UX
1. O que é UX Design?
Explique com suas palavras o que significa UX Design e qual sua
importância dentro de um aplicativo ou site.
é uma área focada em criar produtos ou serviços que façam o produto
intuitivo e visualmente fácil de se mexer
2. O que é UI Design?
Explique o conceito de UI Design e cite dois exemplos de elementos
visuais presentes em uma interface.
é aquilo que se vê, tudo que deixa o app bonito e organizado, com
imagens, botões, cores, praticamente tudo o que você na tela
3. Diferença entre UX e UI
Explique a diferença entre UX e UI utilizando um exemplo do dia a
dia.
ux é as funcionalidades da aplicação, o que cada botão
deve fazer
ou funcionar
Já o UI é a parte visual, as cores, imagens, organização,
tudo que
deixaria visualmente bonito
4. Experiência ruim
Cite um aplicativo ou site que você considera difícil de usar e explique
quais problemas de UX ele possui.
xampp, tem uma interface muito antiga e poluida
5. Experiência positiva
Cite um aplicativo ou site que você considera fácil de usar e explique
o que torna a experiência boa para o usuário.
spotify, facil de usar e bem organizado
6. Hierarquia visual
Observe um aplicativo de sua escolha e identifique:
• O que chama mais atenção primeiro;
• Como as cores, tamanhos e posições ajudam o usuário.
spotify, as cores mostram onde e como aquilo funciona, sendo verde
a principal cor dele,
ele mostra a maior parte dos botões, funcionalidades e o que esta
acontecendo
sendo representado pela cor verde
7. Psicologia das cores
Explique como as cores podem influenciar o usuário em uma interface
digital.
as cores além de ajudar o usuário visualmente, elas podem ajudar na
forma de como o usuário enxerga o aplicativo
8. Consistência visual
Por que é importante manter o mesmo padrão de cores, botões e
fontes em uma aplicação?
Além da organização, ele fica esteticamente bonito e não perdendo a
essência da aplicação
9. Acessibilidade
Explique o que é acessibilidade digital e cite duas práticas
importantes em uma interface.
Botões que dizem diretamente o que vai fazer ou como fazer e leitura
áudio visual para pessoas cegas ou analfabetas
10. Affordance
Explique o conceito de affordance e dê um exemplo dentro de um
aplicativo ou site.
Affordance é aquilo que deixa o aplicativo intuitivo, um bom exemplo
é o icone do aplicativo ou o visual do site
Figma
11. Conhecendo o Figma
Explique para que serve o Figma e quais tipos de projetos podem ser
criados nele.
Figma é um site para prototipagem de projetos como se fosse um
“canva” de site ou apps, você pode usar ele para fazer protótipos de
site ou aplicativos
12. Ferramentas do Figma
Pesquise e explique a função das ferramentas:
• Frame; ele é a estrutura onde você começa a fazer seu projeto,
como uma prancheta ou uma div
• Shape; objetos para serem aplicados na aplicação, como figuras
geométricas ou formas de botão entre outros
• Texto; é uma escrita
• Pen Tool; um recurso para editar ou fazer desenhos vetoriais
• Prototype. É o protótipo
13. Frames
O que são Frames no Figma e por que eles são importantes na criação
de interfaces?
Eles são importantes para separar e diferenciar as abas da aplicação
14. Componentes
Explique o que são componentes no Figma e quais vantagens eles
oferecem.
Componentes são aquilo que compõem a aplicação
15. Protótipos
O que é um protótipo navegável? Explique sua importância antes do
desenvolvimento do sistema.
É um protótipo que você consegue mexer e interagir, vendo como
ficará o projeto final
16. Wireframe
Explique o que é um wireframe e qual sua função durante o
planejamento de uma aplicação.
esboço estrutural básico de um site ou aplicativo, semelhante a uma
planta baixa. Ele foca na disposição dos elementos, hierarquia de
informações e experiência do usuário
17. Design responsivo
Explique o que significa uma interface responsiva e como o Figma
pode ajudar no planejamento desse tipo de design.
é aquela que se adapta de forma fluida a diferentes tamanhos de tela
e resoluções, garantindo uma experiência de uso ideal tanto em um
computador quanto em tablets e smartphones
18. Compartilhamento no Figma
Explique como funciona o compartilhamento de projetos no Figma e
por que essa função é importante para equipes de desenvolvimento
e design.
É importante para que duas ou mais pessoas possam estar
trabalhando no mesmo projeto para que seja feito mais rapido
19. Auto Layout no Figma
Explique o que é o recurso Auto Layout no Figma e quais vantagens
ele oferece durante a criação de interfaces.
É um recurso que te permite criar uma interface responsiva e
adaptáveis
20. Análise final
Responda:
• O que foi mais fácil durante a utilização do Figma?
Criar um projeto e a interface
• O que foi mais difícil?
As configurações das aplicações (como botões e as fontes)
• Qual a importância do UX e UI no desenvolvimento de sistemas?
Ux é para o as funcionalidades e ui é para que fique bonito
visualmente
Trabalhos copiados ou feitos totalmente por Inteligência
Artificial terão a nota zerada.