No dia a dia constroem-se marcas através dos princípios fundamentais de design de comunicação. No espaço digital, a colaboração entre disciplinas e aptidões é crítica. Neste curso vais aprender a aplicar os fundamentos base das teorias de design, centrados no utilizador e nos princípios de interação, e o modo como podes inseri-los no contexto do digital e nos processos de produção standard da indústria digital.
Os Designers têm o espaço e liberdade para pensar profundamente e de forma holística sobre as linguagens visuais. Prestam atenção ao pormenor, às hierarquias visuais, à tipografia, ao espaço, à cor, e ao equilíbrio. São responsáveis por realizar e manter a qualidade do design ao longo de todas as fases de um projeto digital, estabelecendo as guidelines e ajustando cada pixel para garantir que o resultado final é o ideal, sabendo conjugar a forma e a função no produto final produzido e desenvolvido.
Este curso tem como objetivos:
No curso FLAGProfessional UX/UI Designer, os formandos serão dotados de todos os conhecimentos teóricos e competências necessários para ingressar no mercado de trabalho, fornecendo aos seus participantes os requisitos para desempenharem funções ligadas ao design de interação, usabilidade e user experience, no desenvolvimento e produção de interfaces para plataformas Web &Mobile.
Informações Gerais
Destinatários
Este curso destina-se a todos os interessados em iniciar ou consolidar uma atividade profissional no design de interação centrado no utilizador, e com uma forte componente de estrutura e desenho de interfaces gráficos. Note-se que os cursos FLAGProfessional desenvolvem-se com graus de exigência extremamente elevados, o que obriga a uma total disponibilidade para o correto acompanhamento das matérias lecionadas, bem como dos projetos a realizar.
Pré-Requisitos
Conhecimentos de sistema operativo (Windows ou MacOS) na ótica do utilizador. Conhecimentos gerais em Ferramentas Gráficas é facultativo mas não obrigatório na frequência do curso. Gosto e apetência pela Criatividade e pela área de Web, Mobile Design e plataformas digitais.
Metodologia
Presencial e live-training.
Programa
- Metodologias de design digital (12h)
- Fundamentos de UX/UI Design (12h)
- Ux Strategy (6h)
- User Research (12h)
- Arquitetura de informação (12h)
- Visual Design (9h)
- Prototipagem com Figma (15h)
- Prototipagem interactiva com Invision (21h)
- Design de interação (21h)
- User testing (6h)
- Projeto prático UX & UI (18h)
- Front-End Development com HTML5 e CSS3 (36h)
- Responsive Web Design & Development (15h)
- Workshop: JavaScript Foundations (18h)
- Workshop: Responsive WordPress (24h)
- Projeto Prático User Interface Development (18h)
- Motion for Interaction (15h)
- Interatividade e Animações com CSS3, Javascript e Plug-ins (24h)
- Projeto Final Geral (21h)
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)
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
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
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 Figma
- 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 Figma (the interface, layer basics, shapes, vector editing, text, images, grouping layers, styling, canvas e preferences)
- Opções avançadas do Figma (text styles, layer styles, symbols e nested symbols)
- Plugins no Figma
- 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
Calendário
Testemunhos
Sou Licenciado em Design, e este curso foi para mim a ferramenta ideal, não apenas para começar a desenhar para a web com maior rigor e aplicando os conceitos de usabilidade aprendidos, mas também para começar a desenvolver trabalho como Web Designer.
O curso da FLAG abriu-me portas para trabalhar na área de UX/UI, devido à possibilidade de Estágio no final do curso que foi fundamental para conseguir mostrar o que aprendi na FLAG. Nesta área, a experiência é um fator essencial!
Este curso que teve um grande impacto na minha vida profissional. Tive uma oportunidade de estágio, fornecido pela FLAG, numa excelente empresa e consegui entrar.
