Curso de UX e Web Design Responsivo

Aula 1 • Processo de Design Thinking

Apresenta o quadro de design thinking em cinco etapas como método de resolução de problemas. Fornece a mentalidade iterativa aplicada em todos os capítulos seguintes.

Aula 2 • O Que o Design de UX Realmente Significa

Define UX para além da estética, abrangendo usabilidade, utilidade e desejabilidade. Estabelece o vocabulário utilizado ao longo do curso.

Aula 3 • Acessibilidade e Design Inclusivo

Estabelece a acessibilidade como um requisito central de design, não um pensamento posterior. Apresenta as diretrizes globais de acessibilidade para conteúdo e os princípios de design inclusivo.

Aula 1 • Inquéritos e Métodos Quantitativos

Apresenta a conceção de inquéritos, a avaliação comparativa de usabilidade e a interpretação de análises. Complementa as conclusões qualitativas com dados comportamentais mensuráveis.

Aula 2 • Entrevistas e Investigação Contextual

Ensina técnicas de entrevista estruturada e semiestruturada, juntamente com a observação em contexto. Desenvolve competências para capturar o comportamento e as motivações autênticas do utilizador.

Aula 3 • Planeamento de um Estudo de Investigação

Abrange os objetivos, o âmbito e a seleção do método de investigação antes do trabalho de campo. Garante que as questões de investigação se alinham com as decisões de design a serem tomadas.

Aula 1 • Mapas do Site e Hierarquias de Conteúdo

Produz documentos formais de mapa do site que comunicam a estrutura às partes interessadas e aos programadores. Alinha a hierarquia de conteúdo com os modelos mentais dos utilizadores provenientes da investigação.

Aula 2 • Card Sorting e Tree Testing

Ensina a realização de card sorting aberto e fechado para validar estruturas de categorias com os utilizadores. O tree testing verifica os rótulos de navegação antes da aplicação do design visual.

Aula 3 • Conceção de Sistemas de Navegação

Abrange padrões de navegação global, local e contextual para a Web e dispositivos móveis. Conecta o design de navegação aos fluxos de tarefas do utilizador estabelecidos na investigação.

Aula 1 • Ferramentas Digitais de Wireframing

Abrange as ferramentas de wireframing padrão da indústria para criar layouts de ecrã de fidelidade média. Desenvolve a fluência nas ferramentas aplicada nas etapas de prototipagem e entrega.

Aula 2 • Esboço e Wireframes de Baixa Fidelidade

Apresenta o esboço rápido e o wireframing em papel como ferramentas rápidas de ideação. Os artefactos de baixa fidelidade comunicam o layout sem distrair as partes interessadas com o polimento visual.

Aula 3 • Criação de Protótipos Interativos

Conecta wireframes em fluxos clicáveis que simulam o comportamento real do produto. Os protótipos são dimensionados para testar tarefas específicas do utilizador identificadas na investigação.

Aula 4 • Testes de Usabilidade com Protótipos

Aplica protótipos em testes de usabilidade moderados e não moderados para validar decisões de design. Fecha o ciclo de investigação-design antes do investimento em design visual.

Aula 1 • Layout, Espaçamento e Hierarquia Visual

Aplica sistemas de grelha, escalas de espaçamento e peso visual para direcionar a atenção do utilizador. O espaçamento e a hierarquia consistentes reduzem a carga cognitiva e melhoram a digitalização.

Aula 2 • Tipografia para Interfaces Digitais

Abrange a seleção de tipos de letra, escala, entrelinha e contraste para a legibilidade em ecrã. As decisões tipográficas afetam diretamente a acessibilidade e a perceção da marca.

Aula 3 • Teoria da Cor e Sistemas de Cor para IU

Ensina a psicologia da cor, os requisitos de contraste e a construção sistemática de paletas. Um sistema de cor estruturado garante consistência em todos os estados da interface.

Aula 4 • Iconografia e Imagens

Abrange princípios de design de ícones, seleção de imagens e estilo de ilustração para contextos de IU. Os ativos visuais devem reforçar o significado sem criar ambiguidade.

Aula 1 • Media Queries e Pontos de Quebra

Aplica queries de min-width e max-width para adaptar layouts em pontos de quebra definidos. Abrange a sintaxe de intervalo moderna e as container queries para capacidade de resposta ao nível do componente.

Aula 2 • CSS Flexbox para Layouts Responsivos

Ensina os eixos, o alinhamento e o wrapping do Flexbox para construir componentes responsivos unidimensionais. O Flexbox é aplicado a barras de navegação, linhas de cartões e layouts de formulários.

Aula 3 • Imagens e Media Responsivos

Ensina os atributos srcset, sizes e o elemento picture para servir imagens com o tamanho adequado. A entrega otimizada de media melhora o desempenho em todos os tipos de dispositivos.

Aula 4 • CSS Grid para Layouts Complexos

Abrange as áreas de template do Grid, a colocação automática e as linhas nomeadas para layouts bidimensionais. O Grid permite uma estrutura ao nível da página que o Flexbox, por si só, não consegue alcançar.

Aula 1 • Seletores Avançados e Especificidade

Ensina pseudo-classes, pseudo-elementos e gestão de especificidade para CSS sustentável. Reduz os conflitos de estilo comuns em bases de código responsivas de grande dimensão.

Aula 2 • Arquitetura e Escalabilidade de CSS

Apresenta as metodologias BEM, utility-first e CSS Modules para folhas de estilo escaláveis. A arquitetura escalável previne conflitos de especificidade em projetos responsivos de grande dimensão.

Aula 3 • Transições CSS e Microanimações

Aplica propriedades de transição para criar mudanças de estado suaves que reforçam o feedback da interação.

Aula 4 • Animações CSS com Keyframes

Constrói animações complexas de múltiplos passos usando @keyframes para estados de carregamento e fluxos de onboarding. Abrange propriedades seguras para o desempenho e orquestração de animações.

Aula 1 • Melhores Práticas de Entrega de Design

Abrange anotações, especificações de redline e fluxos de trabalho de exportação de ativos que reduzem a ambiguidade para os programadores. Documentos de entrega precisos previnem erros de implementação dispendiosos.

Aula 2 • QA e Testes de Design Responsivo

Aplica testes cross-browser e cross-device para verificar se o comportamento responsivo corresponde à intenção do design. O QA fecha a lacuna entre as especificações de design e a implementação ao vivo.

Aula 3 • Métricas de UX e Medição de Sucesso

Define métricas quantitativas e qualitativas que conectam as decisões de UX aos resultados de negócio. As métricas aqui definidas orientam a avaliação pós-lançamento no projeto final.

Aula 4 • Projeto Final e Apresentação de Portfólio

Sintetiza todas as competências do curso num estudo de caso completo de UX e web design responsivo. A apresentação do portfólio prepara os estudantes para entrevistas profissionais de design.