O que é Design de Interfaces
-
O que separa a teoria das interfaces mais lindas na prática (17:55)
-
Downloads do Curso de UI Design, Figma, Adobe XD, Sketch e Invision
-
O que você vai aprender nesse módulo (4:08)
-
Uma leve recapitulada do que vimos no Módulo Mustang
-
UI Design é um processo (3:30)
-
O processo que você vai aprender (2:44)
-
Exemplos de UI - Parte 1 (4:29)
-
Exemplos de UI - Parte 2 (3:47)
Atualização de Repertório
A profissão de UI Designer
Ferramentas de UI
UBER - Da ideia à alta fidelidade
UBER - Estratégia do projeto
UBER - Proposta de Solução
UBER - Wireframe
FundUI - Grids
UBER - Validação e Textos com cliente
UBER - Planejando o Styleguide
UBER - Escolhendo as cores
FundUI - Cores
-
Intrudução às Cores (3:40)
-
A escolha das Cores (1:03)
-
Princípios das Cores (2:03)
-
Dicas de Sites e Inspirações (3:59)
-
Cores RGB (3:18)
-
Cores HSB - Introdução (0:56)
-
Cores HSB - Saturação (1:56)
-
Cores HSB - Brilho (1:11)
-
Cores HSB - Matiz e Transparência (3:51)
-
Cores em Ferramentas de UI (2:52)
-
Métodos de Tonalidades (4:55)
-
Dicas para paleta de cores (2:58)
-
Contraste (6:22)
-
Círculo Cromático (2:11)
-
Círculo Cromático - Monocromático (1:44)
-
Círculo Cromático - Análogo (0:37)
-
Círculo Cromático - Complementar (0:42)
-
Círculo Cromático - Meio complementar (0:29)
-
Círculo Cromático - Triádico (0:25)
-
Círculo Cromático - Tetrádico (0:18)
-
Círculo Cromático - Colorshades (0:15)
-
Supercolorido, Gradiente, Preto e Branco, Pastel (1:29)
-
Acessibilidade (2:11)
FundUI - Significado das cores
UBER - Escolhendo a tipografia
FundUI - Tipografia
UBER - Criando os botões
-
Crie seu guia tipográfico
-
Criando seus botões (3:51)
-
Expandindo Guia de Estilos para Cores claras (2:44)
-
Transformando Botões em símbolos (1:49)
-
Criando o símbolo das cores (3:35)
-
Criando o símbolo dos formatos (shapes) (1:17)
-
Aplicando cores e formatos nos botões (0:26)
-
Criando o símbolo dos ícones (4:50)
-
Guia de Estilos de botões (4:03)
-
Criando o símbolo dos textos (1:14)
-
Encerramento da criação de botões (0:39)
FundUI - Botões
-
A importância dos Botões em UI (4:03)
-
Criando botões no Sketch, Figma, XD e Invision Studio (5:17)
-
Princípios de design para Botões (3:42)
-
Anatomia de um botão (8:37)
-
Bônus - Magic Buttons - Plugin Sketch (1:38)
-
Botões CTA (10:11)
-
Botões Primários (3:21)
-
Botões Secundários (1:59)
-
Botões para espaços pequenos (1:37)
-
Botões FAB (Material - Floating Action Buttons) (1:58)
-
Botões com ícones (3:32)
-
Botões coloridos (1:35)
-
Botões estilizados (1:58)
-
Botões reaproveitáveis em Frameworks UI (2:37)
-
Botões acessíveis (daltonismo e leitores de telas) (4:04)
-
Dicas e melhores práticas para botões (3:51)
-
Recapitulando sobre botões (1:21)
UBER - Criando formulários
FundUI - Formulários
-
Introdução a formulários (7:44)
-
5 razões para se preocupar com formulários (12:20)
-
Formulários em Ferramentas UI (6:17)
-
Princípios de Design para Formulários (5:48)
-
Anatomia dos formulários (5:00)
-
Tipos de Formulários (5:27)
-
Assistência (4:30)
-
Tipos de campos - Parte 1 (Autocomplete e Autofill) (8:09)
-
Tipos de campos - Parte 2 (8:31)
-
Otimização Data Driven (3:47)
-
Otimização Data Driven 2 (5:48)
FundUI - 10 regras para formulários
-
#1 - Ordenação (4:05)
-
#2 - Colunas (0:41)
-
#3 - Tamanho do formulário (1:48)
-
#4 - Tamanho dos campos (0:35)
-
#5 - Labels acima dos campos (1:57)
-
#6 - Formatação de campos (1:16)
-
#7 - Placeholders e Labels (0:55)
-
#8 - Reset (0:16)
-
#9 - Mensagens de erro (0:50)
-
#10 - Formulários são diálogos (1:41)
-
Otimização de Entrada de Dados (2:32)
-
Dicas de UI para Formulários (10:41)
-
Recapitulando sobre Formulários (5:59)
UBER - Consolidando guias de estilos
FundUI - Hierarquia Visual
FundUI - Padrões de escaneamento
UBER - Finalizando Alta Fidelidade
-
Imagens (7:55)
-
Posicionando Wireframe - Hero (6:39)
-
Posicionando Wireframe - Benefits (8:06)
-
Posicionando Wireframe - Maps (4:17)
-
Posicionando Wireframe - Drive (6:09)
-
Posicionando Wireframe - Testimonials (9:27)
-
Crítica ao Visual (5:48)
-
Ajustando Style Guide - Colors, Typo, Buttons, Text Styles (8:30)
-
Atualizando - Colors, Typo, Buttons, Text Styles (7:40)
-
Atualizando - Organismos e alinhamentos (13:34)
-
Comparação UBER (3:25)
-
Produto de alta fidelidade
UBER - HANDOFF - Passando a bola para o desenvolvimento
Bônus - Usabilidade - Bônus UX&DT
Bônus - Checklist de UX - Bônus UX&DT
