---
title: "Guia completo de UX/UI Design do Zero ao Avançado"
date: 2025-04-10
description: "Além de software, trabalho com design desde 2014. Sempre é bom ter um guia de tópicos pra guiar os..."
tags: ["design","ux","ui","career"]
lang: pt-BR
source: https://www.lincoli.me/pt/articles/guia-completo-de-ux-ui-design/
author: "Lincoli Xavier"
---

Além de software, trabalho com design desde 2014. Sempre é bom ter um guia de tópicos pra guiar os estudos.

Aqui juntei lições, dicas práticas, referências (livros, vídeos, artigos), e sugestões de exercícios em cada etapa. A ideia é te dar uma jornada sólida, teórica e prática, para se tornar um(a) designer de produtos digitais com domínio em UX e UI.

---

# 🧠 Módulo 0 – Introdução ao UX/UI Design

## 🎯 Objetivos:
- Entender o que é UX e UI.
- Diferenciar papéis no design digital.
- Conhecer a importância do design centrado no usuário.

## 🧩 Lições:
1. **O que é UX Design?**
2. **O que é UI Design?**
3. **Design Thinking, Agile e Lean UX**
4. **Diferença entre UX Designer, UI Designer, Product Designer e Service Designer**
5. **Hard skills e soft skills necessárias**

## 📚 Referências:
- 📘 [*The Design of Everyday Things*](https://amzn.to/44i4nOE) – Don Norman
- 📺 [Nielsen Norman Group – What is UX?](https://www.nngroup.com/videos/ux-definition/)
- 📘 [*Don't Make Me Think*](https://amzn.to/42mH1F1) – Steve Krug

## 🛠️ Exercícios:
- Escreva sua definição pessoal de UX e UI.
- Liste 5 produtos digitais que você usa e analise a experiência do usuário.

---

# 🔬 Módulo 1 – Fundamentos de Psicologia e Design Cognitivo

## 🎯 Objetivos:
- Entender como as pessoas pensam, sentem e se comportam diante de interfaces.
- Usar princípios de psicologia para criar experiências melhores.

## 🧩 Lições:
1. **Gestalt e percepção visual**
2. **Memória e carga cognitiva**
3. **Mapas mentais e modelos mentais**
4. **Fatores humanos e usabilidade**

## 📚 Referências:
- 📘 [*100 Things Every Designer Needs to Know About People*](https://amzn.to/3Genzml) – Susan Weinschenk
- 📘 *Laws of UX* – Jon Yablonski (também em [laws-of-ux.com](https://lawsofux.com/))
- 📺 [Principles of Gestalt Psychology – NNGroup](https://www.nngroup.com/articles/principles-visual-design/)

## 🛠️ Exercícios:
- Recrie a interface de um app usando pelo menos 3 leis de Gestalt.
- Crie um mapa mental para um fluxo de compra em um e-commerce.

---

# 🧱 Módulo 2 – Pesquisa em UX (UX Research)

## 🎯 Objetivos:
- Aprender a coletar dados reais para informar decisões de design.
- Validar ideias com usuários.

## 🧩 Lições:
1. **Tipos de pesquisa: qualitativa vs quantitativa**
2. **Entrevistas com usuários**
3. **Personas e proto-personas**
4. **Mapas de empatia**
5. **Jornadas do usuário (User Journey Maps)**
6. **Testes de usabilidade**

## 📚 Referências:
- 📘 [*UX Research*](https://amzn.to/425p1QF) – Brad Nunnally e David Farkas
- 📘 [*Validating Product Ideas*](https://amzn.to/3RbrXFa) – Tomer Sharon
- 📺 [UX Research Methods – NNGroup](https://www.nngroup.com/topic/user-research-methods/)

## 🛠️ Exercícios:
- Conduza uma entrevista com pelo menos 3 pessoas sobre um produto digital.
- Crie uma persona baseada nas entrevistas.

---

# 🧭 Módulo 3 – Arquitetura da Informação & UX Writing

## 🎯 Objetivos:
- Organizar informações de forma lógica.
- Criar textos que guiam e ajudam o usuário.

## 🧩 Lições:
1. **Sitemaps e hierarquia de conteúdo**
2. **Card sorting**
3. **Wireframes e fluxos de navegação**
4. **Microcopy, UX writing e conteúdo orientado à ação**

## 📚 Referências:
- 📘 [*Information Architecture for the Web and Beyond*](https://amzn.to/4jk7iL2) – Louis Rosenfeld
- 📘 [*Strategic Writing for UX*](https://amzn.to/3E2oZQx) – Torrey Podmajersky
- 📺 [UX Writing – UX Collective](https://uxdesign.cc/tagged/ux-writing)

## 🛠️ Exercícios:
- Faça um card sorting com amigos usando o método aberto.
- Redija os microtextos para uma tela de login e cadastro.

---

# 🎨 Módulo 4 – UI Design e Design Visual

## 🎯 Objetivos:
- Aprender os princípios do design visual aplicados à UI.
- Criar interfaces esteticamente agradáveis e funcionais.

## 🧩 Lições:
1. **Princípios de Design Visual: alinhamento, contraste, proximidade, repetição**
2. **Teoria das cores e acessibilidade**
3. **Tipografia na interface**
4. **Design Tokens e Design Systems**
5. **Criação de mockups e protótipos com Figma/Sketch**

## 📚 Referências:
- 📘 [*Design Systems*](https://www.smashingmagazine.com/printed-books/design-systems/) – Alla Kholmatova
- 📺 [Figma Crash Course – FreeCodeCamp](https://www.youtube.com/watch?v=FTFaQWZBqQ8)

## 🛠️ Exercícios:
- Recrie a UI de um app famoso no Figma.
- Monte um mini design system com cores, botões e tipografia.

---

# 🧪 Módulo 5 – Prototipação e Testes de Usabilidade

## 🎯 Objetivos:
- Criar protótipos navegáveis.
- Testar hipóteses com usuários reais.

## 🧩 Lições:
1. **Prototipação: baixa vs alta fidelidade**
2. **Ferramentas: Figma, Framer, ProtoPie**
3. **Planejamento de testes**
4. **Testes moderados e não moderados**
5. **Heurísticas de Nielsen**

## 📚 Referências:
- 📘 [*Rocket Surgery Made Easy*](https://amzn.to/3RFSudM) – Steve Krug
- 📘 [*Handbook of Usability Testing*](https://amzn.to/3YqxPOJ) – Jeffrey Rubin
- 📺 [Heuristic Evaluation – NNGroup](https://www.nngroup.com/articles/heuristic-evaluation/)

## 🛠️ Exercícios:
- Prototipe um app simples no Figma.
- Realize um teste com 2 usuários e anote os problemas.

---

# ⚙️ Módulo 6 – Ferramentas e Fluxo de Trabalho Profissional

## 🎯 Objetivos:
- Aprender o fluxo completo de trabalho do designer.
- Colaborar com times de produto e desenvolvimento.

## 🧩 Lições:
1. **DesignOps e handoff para devs**
2. **Anotações e documentação**
3. **Integração com ferramentas (Zeplin, Storybook, JIRA)**
4. **Design versionado: Figma, Git e bibliotecas compartilhadas**
5. **Trabalhando em times ágeis (Scrum, Kanban)**

## 📚 Referências:
- 📘 [*DesignOps Handbook*](https://stephaniekabi.com/designops-handbook-summary/) – InVision
- 📺 [Figma + Dev Handoff](https://www.figma.com/community/file/864753203644502361)

## 🛠️ Exercícios:
- Crie um arquivo Figma com documentação clara para devs.
- Simule um ciclo de sprint com user stories e wireframes.

---

# 🚀 Módulo 7 – Projeto Final + Portfólio

## 🎯 Objetivos:
- Consolidar todo o aprendizado com um projeto real.
- Construir um portfólio matador.

## 🧩 Lições:
1. **Escolha do problema e validação**
2. **Pesquisa, personas e jornadas**
3. **Wireframes, UI, protótipos e testes**
4. **Apresentação do case**
5. **Como montar um bom portfólio de UX/UI**

## 📚 Referências:
- 📘 *Case Study Manual* – UX Collective
- 📺 [Como criar um portfólio de UX – Canal UXNOW](https://www.youtube.com/@uxnow)

## 🛠️ Exercícios:
- Escolha um problema real (ex: app para mães, pet shop, delivery local).
- Siga todas as etapas e monte seu primeiro case no Notion, Behance ou site pessoal.

---

# 🧭 Dicas Finais para a Jornada

- ✅ Sempre valide com usuários. A intuição vem depois da experiência.
- 🧪 Teste o tempo todo. Tudo é hipótese até o usuário interagir.
- 📚 Leia muito, mas pratique mais ainda.
- 🎯 Design não é arte: é resolver problemas com empatia e clareza.
- 🤝 Participe de comunidades (UX Collective, ADPList, Discords de design).
- 🛠️ Nunca pare de aprender: o mundo do design muda o tempo todo.

---

[Repositório](https://github.com/lincolixavier/guia-final-ux-ui/) que vou atualizar sempre que possível com novos materiais.

Aproveite e bons estudos.