Metodologias de design digital

• Processos de desenvolvimento de produtos (Agile, Scrum, Lean e Waterfall)
• Perfis de uma equipa de product design (product owner, project manager, designers, developers, testers, etc.)
• Diferenças entre perfis de designers (digital product designer, UX designer, UI designer, visual designer, interactive designer, etc.)
• Definição do problemas
• Definição de briefings
• Conceito de MVP (minimum viable product)
• Design Thinking
• Google Design Sprint
• Processo de design digital (principais etapas)

Ux Strategy

• Introdução a UX Strategy
• Validação proposta de valor
• Conhecer a concorrência/mercado
• Value Innovation
• Criação de protótipos para experimentação
• Desenhar para conversão
• Construir uma estratégia de UX
• Next steps

Fundamentos de UX/UI Design

• Definição de user experience e user interface
• Elementos da user experience
• Princípios básicos de user experience
• Factores de sucesso de uma experiência digital
• Objetivos do utilizador vs. objetivo de negócio
• Definição de usabilidade
• Avaliação heuristica
• Acessibilidade

User Research

• Definição de user research
• Entrevistas
• Questionários
• Personas
• User stories
• Customer experience map
• Estudos etnográficos/observação

Arquitetura de informação

• Definição de arquitectura de informação
• Definição de taxonomia
• Estratégia de conteúdos
• Card Sorting (analógico e digital)
• Site map
• Definição de user flows
• Tree testing
• Ferramentas digitais (Optimal Workshop)

Visual Design

• Procura e identificação de referências visuais
• Moodboards
• Brainstorming
• Principios do visual design
• Elementos fundamentais do visual design (cor, tipografia, estilos de texto, iconografia, ilustração, fotografia, etc.)
• Grelhas
• Design system
• Tendências do design digital

Prototipagem com Sketch

• Definição do conceito de prototipagem (baixa fidelidade — esquiço ou wireframes — alta fidelidade e interactiva)
• Fundamentos wireframing
• Ferramentas de desenho digital
• Comparação com outras ferramentas
• Opções básicas do Sketch (the interface, layer basics, shapes, vector editing, text, images, grouping layers, styling, canvas e preferences)
• Opções avançadas do Sketch (text styles, layer styles, symbols e nested symbols)
• Plugins no Sketch
• Sketch mirror
• Opções de exportação e criação de assets
• Passagem de protótipos para desenvolvimento com Zeplin
• Criação de styleguides

Prototipagem interactiva com Invision

• Criação de protótipos em Invision
• Introdução ao Invision (preview mode, build mode, comment mode, inspect mode e history mode)
• Partilha de protótipos através de Invision
• Processos iterativos de trabalho e angariação de feedback
• Plugin do Invision para Sketch (Craft)
• Invision Design System Manager

Design de interação

• Definição de design interactivo
• Principios de interacção
• Principios de animação para digital product design
• Definição de responsive design
• Taxonomia dos gestos
• Desenho de processos interactivos simples (login, registos, preenchimento de formulários, etc.)
• Ferramentas digitais de prototipagem interactiva
• Prototipagem interactiva com Sketch

User testing

• Definição de user testing
• Tipos de testes com utilizadores (qualitativos e quantitativos)
• Testes de usabilidade (planeamento, realização e análise)
• A/B testing
• Métricas e análise de conversão
• Ferramentas (Google Analytics, Hotjar, etc.)

Projeto prático UX & UI

Front-End Development com HTML5 e CSS3

• Elementos estruturais HTML5
• Quando usar os novos elementos estruturais
• Texto
• Formulários
• Áudio e Vídeo
• Canvas
• Data Storage
• Offline
• Geolocation
• Acessibilidade
• Compatibilidade de HTML 5 e CSS 3
• CSS 3 properties e atributos
• CSS 3 animações
• CSS3 Media Queries

Responsive Web Design & Development

• Principios básicos do Responsive
• Responsive Website vs Mobile
• App”Fix and Fluid Layouts
• Adaptive and Responsive Web Design
• Media Queries
• Mobile First
• Responsive Design
• Progressive Enhancement
• Frameworks

Workshop: JavaScript Foundations

• Noções Base JavaScript
• Eventos
• Variáveis
• Funções
• Expressões e ciclos
• Programação Orientada a Objetos
• Strings
• Arrays
• Elementos e propriedade
• Criação de Nós
• Princípios básicos Animação

Workshop: Responsive WordPress

• Instalação do WordPress
• Instalação e utilização de Plugins
• Configurações base
• Utilização de themes/templates

Projeto Prático User Interface Development

 Motion for Interaction

• Princípios de animação tradicional vs digital e de interacção
• Ferramentas
• Micro-interações, animações de transição
• Desenvolvimento de protótipo
• Integrações

Interatividade e Animações com CSS3, Javascript e Plug-ins

• Como desenhar com HTML e CSS
• Transforms e transitions em CSS3
• Animações em CSS3
• Selectores
• Atributos
• Efeitos/Animações
• Eventos
• Animação e interatividade com o Javascript

Projeto Final Geral