Aprenda a criar projetos para web de user interface e user experience.
O curso de UI/UX Design, User Interface e User Experience apresenta os componentes da experiência do usuário, arquitetura da informação, design universal, testes de usabilidade e desenvolvimento de projetos web de user interface e user experience.
Neste curso, você vai aprender a criar o seu projeto de UX/UI do zero, passando por todas as etapas de desenvolvimento e testes. Para um melhor aproveitamento do curso, recomendamos que você tenha noções de layout gráfico.
Durante o curso você vai aprender o Figma, o software mais utilizado em projetos de UX/UI design.
A grade do curso de UX/UI Design é formada por 4 módulos
1. UX: User Experience Design 48h
[AULA 1] UX Research
UX Research; Mercado de Pesquisa e Experiência de Usuários; Pesquisas Qualitativas: Pesquisa Primária; Entrevista, Grupo Focal, Teste em Laboratório; Pesquisas quantitativas: Survey, Mapa de Calor, Teste A/B ; Pesquisa Mista; Workshop Co-Criação; Consolidação de Pesquisa; Estudo de Cases; Ética; Acessibilidade e LGPD; Referências Bibliográficas. Escolha de Briefing para Desenvolvimento de Pesquisa.
[AULA 2] Acessibilidade e princípios do design universal
WCAg Web Content Accessibility Guidelines, Deficiências Permanentes; Deficiências Temporárias; Deficiências Situacionais; Deficiências Visuais, Baixa Visão, Daltonismo; Deficiências Auditivas; Deficiências Motoras; Deficiências Cognitivas; Captions; Recursos; Next Billion User – Novos Usuários; Estudo de Caso: Facebook; Design Universal: Uso Equitativo, Flexibilidade no Uso, Uso Simples e Intuitivo, Informação Perceptível, Tolerância ao Erro, Baixo Esforço, Tamanho e Espaço para o uso; A Acessibilidade Ajuda Todos os Usuários. Exercício: Análise de Sites e Apps.
[AULA 3] Planejamento da Pesquisa de UX Research
Definição dos Objetivos; Escolha do Método; Matriz CSD; Levantamento de Hipóteses; Perfis de Usuário; Tendências de Consumo; Movimentos Contemporâneos; Early Adopters; Generalizações de Gerações; Estudos de Caso; Delineamento de Personas; Escolha da Amostra (Quem Será Ouvido); Tamanho da Amostra; 80/20; Busca de Relevância Estatística; Oficina de Desenvolvimento de Pesquisa.
[AULA 4] Desenvolvimento da Pesquisa de UX Research
Desk Research; Estudo Aprofundado do Problema Escolhido na Aula Anterior, Apresentação do Conceito de Proto-personas, Definição de Personas, Criação de Cenários, Observação de Tendências de Comportamento; Desenvolvimento de Pesquisa, Levantamento de Problemas e Oportunidades; Estudo dos Problemas Levantado os Pain Points e Desenvolvimento de Soluções para chegar aos Insights Esperados.
[AULA 5] Execução da Pesquisa de UX Research
Escolha e Preparação das Ferramentas a serem Utilizadas na Pesquisa; Desenvolvimento do Roteiro da Entrevista; Teste de Usabilidade da Pesquisa; Recrutamento de Participantes. Oficina de Desenvolvimento de Pesquisa: Entrevistando os participantes.
[AULA 6] Consolidação da Jornada do Usuário
Consolidação da Pesquisa; Mesclar Pesquisas Quantitativas e Qualitativas em Busca de Resultados mais Assertivos; Mapeamento de Necessidades dos Usuários; Desejos e Medos dos Usuários; Desenvolvimento e Consolidação da Jornada do Usuário; Compartilhamento das Descobertas.
[AULA 7] UX Design
UX Design; Profissional de UX Design; Mercado de UX Design; Nomenclaturas Stakeholders; Estrutura e Etapas de Projetos de UX Design; Design Focado no Usuário: Fatores Cognitivos, Sociais e Emocionais; Empatia; Apresentação de Ferramentas Estimuladoras da Criatividade; Brainstorming em UX; Referências Bibliográficas. Apresentação do Projeto de UX, Oficina de Brainstorming.
[AULA 8] Metodologias de inovação
Apresentação de Metodologias; Design Thinking, Duplo Diamante, Lean UX, MVP, Oficina de Identificação e Resolução de Problemas Utilizando as Metodologias Apresentadas e Análise das Metodologias.
[AULA 9] Projeto de UX Design
Oficina: Utilizar a Definição das Personas para Desenvolvimento do Mapa de Empatia; Needs Statements: Identificação de Necessidades; Jornada do Usuário; Estudo Aprofundado de Persona Mapeando Comportamentos, Hábitos e Opiniões; Análise dos Dados e Levantamento de Oportunidades para chegar os Insights Esperados.
[AULA 10] Testes de usabilidade
Impacto da Usabilidade na Experiência do Usuário; Tarefa e Atividade; Conceitos de Usabilidade; Métricas; Testes e Ferramentas; Tecnologias de Teste; Pensamento em Voz Alta; Método Coaching; Método de Co-Descoberta; Shadowing; System Usability Scale; Pesquisa de Mesa; Registro de Uso Real; Estudo de Campo; Questionário; Protocolo de Questionamentos, Avaliação da Acessibilidade. Exercício: Simulação de Teste de Usabilidade em Site.
[AULA 11] Arquitetura da informação
Arquitetura da Informação; Conceitos: Contexto, Conteúdo, Usuários, Organização, Busca, Rotulagem, Navegação, Categorização, Hierarquia da Informação; o Layout e a Arquitetura da Informação; Acessibilidade na Arquitetura da Informação. Oficina: Desenvolvimento de Projeto de UX.
[AULA 12] Processo criativo
Análise do que foi Desenvolvido nas Aulas Anteriores para Gerar Ideias de Melhorias; Uso de Ferramentas Criativas como Brainstorming; Crazy 8; How Might we, Card Sorting, Ideação Baseada em Analogias e Associação, Matriz de Decisão, Quick Voting. Oficina de Solucionar Problemas e Análise das Ferramentas Criativas.
[AULA 13] Projeto de UX Design: fluxos de jornada
Desenvolvimento do Projeto de UX Design; Criação dos Fluxos de Jornada. Oficina: Desenvolvimento dos Fluxos de Jornada para o Projeto UX Design usando a Ferramenta Figjam do Figma.
[AULA 14] Modelo de negócio, Proposta de valor
Modelo de Negócio; Proposta de Valor; Apresentação de Cases de Modelo de Negócio e Proposta de Valor. Oficina de Criação de Modelo de Negócio e Proposta de Valor para Projeto de UX.
[AULA 15] Criar apresentação
Apresentação de Projetos de UX; Desenvolvimento a Apresentação do Projeto de UX.
[AULA 16] Apresentação e finalização
Finalização dos Projetos; Apresentação dos Projetos de UX e Considerações do Professor.
2. Figma 18h
[AULA 1] Introdução ao Figma
Introdução; Visão Geral; Interface; Artboard; Formas; Tipografia; Cores; Componentes; Repeat Grid; Criação de Objetos; Edição de Objetos; Recursos Externos; Figjam. Oficina no Utilizando as Ferramentas Apresentadas no Figma.
[AULA 2] Construção de wireframe
Configurando Pranchetas; UI Kits; Guias e Grids; Criação de Telas de Login, Tela Principal e Detalhes, Tela de Busca, Tela de Configuração do App; Criação de Popup. Oficina no Utilizando as Ferramentas Apresentadas no Figma.
[AULA 3] Microinterações
Objetivos de Microinterações, Tipos de Microinterações, Acessibilidade em Microinterações, Apresentação de Cases de Sucesso; Navegação na Home; Slideshow; Micro Interação em Componentes. Oficina no Utilizando as Ferramentas Apresentadas no Figma.
[AULA 4] Transições e animações avançadas
Princípios da Animação; Smart Animate; Splash e Login; Configurando Velocidades de Elementos; Filtros; Onboarding; Estratégias de Onboarding. Oficina no Utilizando as Ferramentas Apresentadas no Figma.
[AULA 5] Autolayout e componentes
Apresentação da Ferramenta Auto Layout e Componentes. Oficina no Utilizando as Ferramentas Apresentadas no Figma.
[AULA 6] Prototipagem no Figma
Compartilhando para revisão; Estruturação de Layout; Criando Protótipo; Criação de protótipos interativos; Visualizar no Dispositivo Móvel (device preview); Compartilhando para Desenvolvimento. Oficina no Utilizando as Ferramentas Apresentadas no Figma.
3. UI: User Interface Design 36h
[AULA 1] Interface do usuário
User Interface (UI) x User Experience (Ux); Interfaces Físicas e Interfaces Comunicacionais; Estudos de Cases Nacionais e Internacionais; Interatividade; Limitações do Usuário e Limitações Técnicas/Tecnológicas; Pesquisa em Design de Interface; Benchmarking; Organização de Fluxos para Navegação; Menu Protótipo; Conexão de Interfaces; Referências Bibliográficas. Apresentação do Projeto de User Interface a ser Desenvolvido ao longo das aulas; Escolha do Briefing.
[AULA 2] Arquitetura da informação em UI design
Estudo Aprofundado da Arquitetura da Informação; o Layout e a Arquitetura da Informação; Oficina de Pesquisa e Geração de Alternativas no Figma para o Projeto de UI.
[AULA 3] Mobile, app e site desktop (Mobile First)
Elementos: Cabeçalho, Rodapé, Texto, Imagens, Imagem de Fundo, Tabelas, Vídeos, Menus; Templates e CMS WordPress, Estrutura; Layout e Funções; Layout Responsivo; Layout Adaptativo. Desenvolvimento do Moodboard para o Projeto de User Interface e Estudo de Estrutura do Site Mobile.
[AULA 4] Composição, alinhamento e grid
Ordem de Leitura; Grids; A importância dos Espaços Vazios; Noções de Diagramação: Títulos, Subtítulos, Texto, Espaçamento, Fontes, Peso da Fonte, WebFonts, O que não fazer. Oficina.
[AULA 5] Grids para UI design
Grids; Estudos da Usabilidade de Grids em UI. Oficina de Pesquisa e Geração de Alternativas no Figma.
[AULA 6] Web colors e tipografia para UI design
Cores Hexadecimais e RGB; Composições para Web: Harmonia, Contraste, Cores Utilizadas por Segmento, Legibilidade; Criação de Paletas de Cores; Apresentação de Plugins Acessibilidade no Figma, Stark; Tipografia; Estudo de Tipografia para Web. Oficina do Figma: Explorar Paletas de Cores e Desenvolver Estudo Tipográfico no Layout do Projeto de User Interface.
[AULA 7] Iconografia e ilustração para UI
Ícones; Tipos de Ícones; Apresentação de Diferentes Propostas de Iconografia; Estudos da Usabilidade de Ícones em UI; Ilustração em Sites Web, Mobile e Apps; Cases de Sucesso; Desafios; Oportunidades; Estudos da Usabilidade da Ilustração em UI; Apresentação de Bibliotecas de Ilustração Pagas e Gratuitas; Edição de Ilustrações de Bibliotecas; Direitos Autorais de Bibliotecas. Oficina de Pesquisa e Geração de Alternativas no Figma.
[AULA 8] Usabilidade
Boas Práticas para Interfaces Digitais: Clareza, Consistência, Autonomia, Feedback, Tolerância; Guidelines Windows e IOs; Design Responsivo; Acessibilidade; As Heurísticas de Nielsen; Aplicação das Análises Heurísticas. Exercício: Discussão – Diferenças de Aplicação entre Diferentes Dispositivos – Atividade de Análise de Sites Apontando Erros e Acertos.
[AULA 9] Prototipagem e avaliação
Importância e Ferramentas da Prototipagem; Low Fidelity Prototyping. Oficina: Planejamento da Tarefa, Jornada do Usuário, Oficina de Desenvolvimento de Projeto de UI.
[AULA 10] Oficina: Projeto de UI Design
Continuação do Desenvolvimento de Layout no Figma para o Projeto de User Interface; Verificação e Adaptação para Responsividade.
[AULA 11] Oficina: Projeto de UI Design
Continuação do Desenvolvimento de Layout no Figma para o Projeto de User Interface; Verificação e Adaptação para Responsividade.
[AULA 12] Finalização e apresentação do projeto
Finalização do Projeto de UI, Apresentação e Considerações.
4. Mentoria Profissional 18h
[Aula 1] Mercado e Crescimento Profissional – Aula Coletiva
Papel e atuação do Designer; Construção da liderança e gestão; Modelo mental fixo e expandido; Disciplina, transparência, objetividade, colaboração e comunicação; Maturidade profissional. Apresentação de Tarefas Para os Encontros Particulares
[Encontro 1] Linkedin e Apresentação Profissional – 2 Encontros particulares de 45 minutos cada.
Como se Posicionar no Linkedin, Estudo sobre CVs, Análise da Página do Linkedin do Aluno, Análise da Apresentação do Aluno.
[Encontro 2] Portfolio – 2 Encontros particulares de 45 minutos cada.
Opções de Portfólio Online, Estudo Sobre Portfólios, Análise dos Projetos do Aluno, Postagem dos Projetos Desenvolvidos em Aula
[Encontro 3] Recrutadores e Entrevistas – 1 Encontros particulares de 45 minutos cada.
Dicas paras Ingressar e Evoluir no Mercados
O nosso antigo curso de Uix de 30h agora é um curso de formação UIX Design com 120h e formado por 4 módulos.
Bruno Cantarelli –
Eu gostei muito do curso o professor tem um domínio incrível do conteúdo e uma facilidade para ensinar muito grande. Tive um grande aprendizado no curso e com certeza irei realizar mais cursos na 4ED
Bruna Ferreira Schneider –
Curti muito fazer o curso de Uix e conhecer a 4ED. Fiz o curso em 2019, numa turma pequena mas com entrosamento muito legal com a professora Daniele. Foram aulas práticas e teóricas com bastante conhecimento na área, e também uma boa flexibilidade de programação das aulas.
Márcia Prass –
Fiz o curso em maio de 2022 com a Frances. Aproveitei muito as aulas, tive uma outra noção sobre o assunto e vi o quão rico ele é. Além disso, fazer este curso me abriu muitas portas. Recomendo MUITO!
carolinaojeda_ –
Fiz o curso em 2019 com a Frances que além de uma excelente profe, indicou vagas na área para a turma. Estudamos vários cases, onde aprendemos caminhos e elaboramos estratégias para aprimorar a experiência do cliente com relação ao produto/serviço oferecido, e o layout mais adequado. Teve um trabalho de conclusão final individual, bem importante para fixar os aprendizados.