Especialização do projeto UX/UI: da pesquisa à acessibilidade

Nesta lição, compartilharei com vocês as origens da UX. Falaremos sobre o Feng Shui em 4000 a.C., Walt Disney e seu desejo de criar experiências mágicas perfeitas, e Don Norman, o homem que cunhou o termo "experiência do usuário". Também compartilharei com vocês para onde acredito que o setor está caminhando.

Uma Breve História do UX

Princípios de acessibilidade e heurísticas

Nesta lição, você receberá uma introdução ao mundo do design inclusivo e aprenderá como tornar seus produtos e serviços mais acessíveis. Também apresentarei outras práticas recomendadas, também conhecidas como heurísticas, quando se trata de projetar interfaces de usuário.

Introdução ao processo UX

Nesta lição, você será apresentado ao processo de design de UX. Apresentarei as duas representações mais comuns: o modelo do diamante duplo e o design thinking. O processo de design de UX consiste em 5 etapas principais: Empatia, Definição, Ideação, Protótipo e Teste.

Introdução à pesquisa UX

Nesta lição, vou te ensinar sobre o valor da pesquisa de UX e o que pode dar errado se você não a implementar. Você também aprenderá a diferença entre métodos "Atitudinais vs. Comportamentais" e "Qualitativos vs. Quantitativos".

Pesquisa de mesa, Benchmark, Entrevistas

Nesta lição, vamos nos concentrar nos três métodos principais que qualquer designer de UX, pesquisador ou não, deve conhecer: pesquisa documental, benchmarking e entrevistas. Você aprenderá quando usar esses métodos e as melhores práticas para cada um.

Detectando e definindo o problema

Uma das principais habilidades de um designer de UX é a capacidade de identificar problemas. Nesta lição, você aprenderá a usar suas descobertas e técnicas como mapeamento de afinidades para ajudar a definir melhor o problema que está tentando resolver.

Persona Creation

Personas são uma ferramenta comumente usada em UX. Nesta lição, você aprenderá por que elas são importantes, as características de uma boa persona, como criá-la e quando elas são usadas no processo de design de UX.

12m

Mapeamento de Viagem

Depois de ter uma persona (ou personas), é recomendável criar um mapa da jornada. Nesta lição, você aprenderá os principais componentes de um, os diferentes tipos existentes e por que você deve usá-los.

Nesta lição, você aprenderá diferentes técnicas de ideação – brainstorming, bodystorming e mapas mentais, para citar algumas – para ajudá-lo a encontrar possíveis soluções para os problemas detectados na sua pesquisa de usuários.

Técnicas de Ideação

Arquitetura de informação

Ao criar um aplicativo ou site, é importante que ele tenha uma interface de usuário limpa e bem projetada. Nesta lição, você aprenderá sobre arquitetura da informação e como organizar seu conteúdo de forma eficaz.

Valor da prototipagem

Depois de ter várias ideias, é hora de torná-las tangíveis. Nesta lição, você aprenderá sobre o quê, o porquê e o quando da prototipagem.

Tipos de protótipos e ferramentas de prototipagem

Nesta lição, você aprenderá sobre os diferentes tipos de protótipos existentes. Também compartilharei algumas ferramentas que podem ser usadas para criar esses protótipos.

Teste de Usuário

Após a criação do seu protótipo, é hora de outras pessoas testá-lo. Nesta lição, você aprenderá como se preparar e conduzir testes de usuário eficazes. Também compartilharei algumas práticas recomendadas para documentar e priorizar suas descobertas.

Trabalhando com desenvolvedores

Mesmo que você não queira se tornar um desenvolvedor, terá que trabalhar em estreita colaboração com eles. Nesta lição, você aprenderá como garantir uma transição tranquila entre design e desenvolvimento.

Apresentação para as partes interessadas / clientes

Nesta lição, você aprenderá como mensurar a UX e como apresentar suas descobertas de maneiras criativas para stakeholders/clientes. Também compartilharei algumas dicas sobre como disseminar o UX Design dentro da empresa.

10m

Estudos de caso

Nesta lição, você aprenderá a criar um estudo de caso, sendo capaz de documentar seu processo de design de UX do início ao fim.

Apresentando seu trabalho

Nesta lição, você aprenderá sobre diferentes plataformas onde pode divulgar seu trabalho e como criar um portfólio. Ao discutir como criar um portfólio, também abordaremos as vantagens e desvantagens de formatos específicos.

Entrevistas de emprego UX

Nesta lição, compartilharei algumas dicas sobre entrevistas para cargos de UX e os tipos de exercícios de design que você encontrará.

Módulo 3

Descubra como criar experiências digitais significativas com Patricia Reiners, que traz sua expertise adquirida com o Google e a Adobe. Aqui, ela desvenda o papel essencial da pesquisa de UX e mostra como criar um plano de pesquisa personalizado. Você obterá ferramentas para entender melhor as necessidades do usuário e projetar soluções que realmente causem impacto.

13 aulas (1h 47m)

O que é UX Research?

Nesta lição, aprenderemos o que é UX Research e quando integrá-la.

Quais são as metodologias mais comuns

Escolher o método certo para suas perguntas ajuda você a obter os insights certos. Por isso, nesta lição, veremos a diferença entre pesquisa avaliativa e generativa e quando usar cada uma.

Pesquisa Quantitativa do Usuário

A pesquisa quantitativa de usuários se concentra na quantidade. É preciso uma grande quantidade de dados para obter insights reais. Esses insights respondem ao "o quê". Ela mostra quais dispositivos os usuários estão usando, mas não por que eles estão usando um dispositivo específico. Nesta lição, examinaremos diferentes métodos quantitativos

Pesquisa Qualitativa do Usuário

A pesquisa qualitativa com usuários é sobre qualidade. Com esses métodos, você será capaz de descobrir o seu "porquê". Nesta lição, abordaremos diferentes métodos qualitativos.

Planejando sua pesquisa

Criar um plano de pesquisa estrutura seu pensamento em torno da atividade de pesquisa.

Escrevendo o Plano de Pesquisa

Nesta lição, vamos escrever um plano de pesquisa para um projeto de pesquisa. Analisaremos tudo passo a passo.

Como escolher os participantes

A escolha dos participantes é importante, independentemente do método escolhido. Nesta lição, veremos como fazer isso.

Como escrever um guia de discussão

Ao conduzir estudos de campo, pesquisas contextuais, entrevistas individuais ou qualquer tipo de entrevista, você precisa de um guia de discussão. Nesta lição, elaboraremos perguntas para formulá-las adequadamente.

Como preparar a sessão

Seu objetivo na entrevista é aprender o máximo possível sobre como seus usuários pensam e se comportam. Nesta lição, aprenderemos como formular perguntas e os materiais necessários para nossa entrevista.

Como é uma sessão qualitativa?

Nesta lição, falaremos sobre a estrutura de uma entrevista: a introdução, a parte principal (as perguntas) e a conclusão.

Visualize sua pesquisa qualitativa de usuário

Nesta lição, sintetizaremos os insights e os apresentaremos visualmente para as partes interessadas e membros da equipe.

Mapa de jornada do usuário e personagens 1

Nesta lição, aprenderemos como criar artefatos para serem compartilhados com todos os membros da sua equipe e partes interessadas: personas e mapas da jornada do usuário.

Mapa da jornada do usuário e personagens 2

Encerramos esta lição sobre mapas de jornada do usuário e personas.

13m

Módulo 4

Descubra como o design visual pode se tornar uma ferramenta de narrativa com Pablo Stanley como seu guia. Neste módulo, ele compartilha os princípios-chave por trás de composições impactantes e como usar o Figma para dar vida às suas ideias. Seja você iniciante em design ou queira aprimorar suas habilidades, você encontrará insights práticos para aprimorar seu trabalho criativo. Pronto para mergulhar?

18 aulas (2h 35m)

Princípios de Composição e Design Visual

Agora vamos analisar os elementos que compõem uma boa composição.

Princípios Gestalt Usados em Design

Veremos como os princípios da Gestalt influenciam a maneira como interpretamos informações visuais.

Hierarquia Visual

Determinar quais partes de uma composição são mais relevantes do que outras é fundamental para focar a atenção do observador. Aqui, veremos como estabelecer uma hierarquia em nosso design.

Recursos na IU

Nesta lição, falarei sobre o termo "affordances" e como implementá-los em nossas interfaces.

Introdução aos elementos visuais e compreensão do resumo

Um briefing criativo é um documento unificador que identifica os benefícios essenciais de uma campanha ou produto. Ele conta a história e explica por que ela é crucial para o público, servindo como um guia para a criação.

Composição Básica na Figma

Nesta lição, faremos alguns exercícios no Figma, entendendo como usar alguns recursos para aplicar o que aprendemos. Saber como usar essas ferramentas e aplicar essas habilidades ajudará você a alcançar o próximo nível de habilidades de design no Figma.

A tipografia é um dos elementos mais poderosos do design. Ela eleva o conteúdo e reflete o tom e as necessidades de um projeto. Seu propósito não é apenas estético, mas também funcional e técnico.

Tipografia

Criação de uma paleta de cores

As cores têm significado. Elas comunicam um tom e uma emoção, o que as torna uma ferramenta de design poderosa. Mas você tem possibilidades praticamente infinitas para trabalhar — quando você começa a combinar cores para formar uma paleta, suas opções são infinitas. Então, por onde começar? Nesta lição, aprenderemos um pouco sobre como combinar cores.

Gráficos e ícones

Imagens permitem que você faça mais com menos. Dizem que uma imagem vale mais que mil palavras. É por isso que imagens e gráficos são ferramentas visuais poderosas que podem ajudar a transmitir uma mensagem e estabelecer a identidade visual de um produto. Você pode usar fotos, ilustrações e ícones. Vamos aprender quando usar cada um.

Nesta lição, abriremos o Figma e testaremos diferentes estilos visuais, veremos como aplicá-los e por que funcionam. Um por um.

Estilos Visuais

19m

Desenhando um Wireframe

Esboçar um wireframe nos permite identificar rapidamente problemas de usabilidade logo no início do processo de design. Também convida diferentes partes interessadas a darem suas contribuições e ideias. E nos dá uma ideia de como o projeto final pode ficar.

Definindo seu guia de estilo visual 1

Antes de colocar nossos esboços em alta fidelidade, vamos definir o estilo de alguns elementos essenciais. Ter esse sistema básico nos permitirá avançar mais rapidamente na montagem do layout e das composições no mockup de alta fidelidade.

Definindo seu guia de estilo visual 2

Nesta segunda parte da lição, vamos nos concentrar no estilo das ilustrações que aparecerão no seu projeto.

Construindo um mock-up de alta fidelidade 1

Agora vamos usar nosso guia de estilo e o wireframe de esboço para montar uma versão de alta fidelidade da nossa página no Figma.

15m

Construindo um mock-up de alta fidelidade 2

Aqui continuarei moldando e finalizando meu mock-up de alta fidelidade, sempre mantendo sua aparência vibrante e dinâmica.

Botões de interação

Aprenderemos como adicionar interações simples de componentes para fazer nossos botões ou qualquer outro componente serem animados com diferentes gatilhos.

Vinculando a páginas e modais

É essencial criar links entre diferentes páginas e outros estados do nosso protótipo para que o resultado seja mais natural. Nesta lição, aprenderemos como criar um link para uma nova página e abrir um modal.

Compartilhando seu protótipo

Agora que temos tudo junto, vamos compartilhar com o mundo!

Módulo 5

Com Chiara Aliotta como guia, mergulhe no poder do storytelling como ferramenta para criar designs emocionais e centrados no usuário. Explore como elementos narrativos — como público, propósito e personagem — podem moldar experiências digitais imersivas. Você aprenderá a transformar briefings de UX em histórias envolventes que conectam, engajam e deixam uma impressão duradoura.

11 aulas (2h 22m)

Storytelling para UX e UI Design

Como em toda jornada, acredito que é essencial entender para onde você está indo. Nesta lição, apresento o curso, como ele é estruturado e o que aprenderemos juntos. Também falarei sobre a diferença entre design de experiência do usuário (UX) e design de interface do usuário (UI).

Elementos da narrativa: público, propósito, personagens e contexto

Mesmo antes de escrevê-la, os primeiros elementos para definir uma história são seu público, motivação/propósito, contexto e a compreensão de que uma história precisa ter um ritmo.

17m

Elementos da narrativa: a estrutura

De Aristóteles até os dias atuais, a estrutura de uma história não mudou muito. Vamos descobrir como a narrativa é criada e como você pode aplicar os mesmos princípios ao design de UX.

O poder de contar histórias: emoções

As emoções desempenham um papel fundamental em nosso comportamento. Boas histórias evocam emoções e conseguem se conectar com seu público. Nesta lição, você explorará como dominar o poder da narrativa, usando as emoções para atingir seus objetivos.

Encontrando os Elementos da História 1

Dada uma marca fictícia, usarei atos, sequências e cenas para mapear a experiência e me aprofundar em como o design UX beneficia a narrativa tradicional.

13m

Encontrando os Elementos da História 2

Durante esta segunda parte da lição, continuarei ensinando você a mapear os elementos da história.

13m

Inspiração visual para desencadear a imaginação

Nesta lição, você verá como encontrar inspiração visual em diferentes fontes antes de avançar para a última etapa da tarefa: o wireframe da landing page.

Construindo a Narrativa e o Wireframe 1

Até agora, usei atos, sequências e cenas para mapear a jornada do usuário. A grade que criei usando o Post será o modelo e me ajudará a garantir que o produto digital que estou projetando proporcionará a experiência certa para o usuário.

Construindo a Narrativa e o Wireframe 2

Para finalizar esta unidade, você aprenderá a se aprofundar na narrativa examinando as cenas e criando o wireframe.

15m

Apoiando a Narrativa: Wireframe vs. Mock-up de Alta Fidelidade

Nesta lição, apresentarei o mock-up de alta fidelidade inspirado no wireframe criado na unidade anterior. A fase de desconstrução é essencial porque nos ajuda a entender se estamos sendo consistentes com a nossa história (também conhecida como consistência com o wireframe e as escolhas tomadas ao analisar o briefing).

Envolvendo o público com a narrativa

Contar histórias é uma ferramenta poderosa que precisa ser usada com sabedoria. Por isso, você aprenderá a descobrir como usá-la para motivar, persuadir e inspirar seu público.

Módulo 6

Entre no mundo do design inclusivo com Margot Gabel e aprenda como a acessibilidade pode transformar as experiências digitais para todos. Margot compartilha maneiras práticas de tornar seu site mais amigável — do contraste de cores a textos alternativos. Você descobrirá como o design inclusivo não apenas promove a equidade, mas também melhora o SEO e a usabilidade geral.

14 aulas (1h 53m)

Introdução à Acessibilidade Digital

Para começar, você aprenderá sobre padrões de acessibilidade e seus benefícios.

Os benefícios da acessibilidade digital

Agora, falarei sobre por que é crucial tornar a acessibilidade digital uma necessidade ao projetar.

Acessibilidade na vida real

É hora de explorar como replicar algumas situações de navegação em que a acessibilidade digital é crucial. Isso ajudará você a se identificar com elas e entender por que elas são importantes.

Cores e Contraste

Primeiro, você aprenderá sobre a "famosa" taxa de contraste e como aplicá-la a textos e elementos visuais. Depois, ensinarei como escolher uma combinação de cores.

Tipos de letra e hierarquia

Agora você verá as opções de tipografia e como elas podem ser acessíveis. Você também verá como escolher uma combinação.

Texto Alternativo e Microcópia

Nesta lição, ensinarei um elemento muito importante da acessibilidade digital e como ele pode influenciar seu pensamento de design.

Estados

Deixe-me ajudar você a entender como os usuários podem usar entradas de teclado/voz/toque de forma diferente e como você precisa se adaptar/pensar sobre isso em relação às escolhas de design e UX.

Animações e controles multimídia

Vamos dar uma olhada em diferentes maneiras de devolver o controle e fazer escolhas de animação responsáveis.

Wireframing para acessibilidade

Nesta lição, você verá como fazer um design de baixa fidelidade do seu projeto e já incluir o que aprendeu até agora nesta etapa vital.

10m

Um sistema de design básico e acessível

Mostrarei como configurar os elementos fundamentais: uma paleta de cores, uma escala de tipos básica, criar alguns botões e campos de texto e pensar sobre seus vários estados.

17m

Projetando

Por fim, mostrarei como criar seus designs com todos os elementos que mencionei anteriormente. Depois, você aprenderá a usar o sistema de design.