Aula 1 - Apresentação do Projeto e Configuração de Ambiente de Produção
Conhecendo o App MyBeer Diary
Metodologia de Desenvolvimento (Design/Development/Deployment)
Download de UI Kits essenciais
Instalação de Plugins essenciais
Aula 2 - Montagem da UI e Assets (Colors/Character Styles/Components)
Criação do Arquivo para UI
Uso de componentes vinculados com Ui Kits
Criação de Componentes
Definição de Color Scheme
Definição de Character Styles
Aula 3 - Criando Style Guide com plugin Zeroheight
Criação Arquivo para Style Guide
Exportando Assets
Configurando Assets no Zeroheight
Compartilhando Style Guide
Aula 4 - Montagem da Prototipagem UX
Criação dos Artboards
Vínculos de navegação Básica
Estados de Botões
Inserção de Conteúdo com Plugins Undraw/Frontify/PhotoSplash
Aula 5 - Transformando em projeto Cross-Platform
Criando UI para cada plataforma (Mobile/Web/Desktop)
Aplicando Responsividade na versão Web
Criando UI separadas de Mobile e Tablet
Aula 6 - Prototipagem UX Cross-Platform
Vínculos de navegação básica para cada plataforma
Inserção de Overlay
Aula 7 - Prototipagem UX Avançada
Vínculos de Animação
Inserção de Audio
Inserção de âncora
Inserção de Padding
Aula 8 - Exportações
Exportação PNG para IDE Visual (Construct 3)
Exportação de Design Tokens com Plugin Toolabs DSM
Exportacão HTML com Plugin Anima
Aula 9 - Do Design ao Código - Construct 3
Montagem do App no Construct 3 para exportação HTM5/Cordova/NWjs
AULA 10 - Do Design ao Código - Integração com Firebase
Inserção de Design Tokens no Visual Studio Code em projeto React e React Native
@dualpixel_digital
NOVA AMÉRICA OFFICES
Av. Pastor Martin Luther K. Jr, 126 - Torre 1000 - Sl. 309 - RJ • CEP 20765-000
(21) 2042-0922 • (21) 98577-4875
ADOBE XD – MÓDULO 2
Neste módulo 2 avançamos a partir dos conceitos e técnicas ensinadas no curso Adobe XD – Módulo 1 apresentando ferramentas e recursos para automação com uso de plugins, componentes, design system, design token e animação automática.
Entenda como planejar e produzir telas para projetos mais complexos (cross-platform), que incluem web, mobile e desktop e contribua de forma mais profissional com os desenvolvedores do projeto.
Plano de Estudos
Aula 1 - Apresentação do Projeto e Configuração de Ambiente de Produção
Conhecendo o App MyBeer Diary
Metodologia de Desenvolvimento (Design/Development/Deployment)
Download de UI Kits essenciais
Instalação de Plugins essenciais
Aula 2 - Montagem da UI e Assets (Colors/Character Styles/Components)
Criação do Arquivo para UI
Uso de componentes vinculados com Ui Kits
Criação de Componentes
Definição de Color Scheme
Definição de Character Styles
Aula 3 - Criando Style Guide com plugin Zeroheight
Criação Arquivo para Style Guide
Exportando Assets
Configurando Assets no Zeroheight
Compartilhando Style Guide
Aula 4 - Montagem da Prototipagem UX
Criação dos Artboards
Vínculos de navegação Básica
Estados de Botões
Inserção de Conteúdo com Plugins Undraw/Frontify/PhotoSplash
Aula 5 - Transformando em projeto Cross-Platform
Criando UI para cada plataforma (Mobile/Web/Desktop)
Aplicando Responsividade na versão Web
Criando UI separadas de Mobile e Tablet
Aula 6 - Prototipagem UX Cross-Platform
Vínculos de navegação básica para cada plataforma
Inserção de Overlay
Aula 7 - Prototipagem UX Avançada
Vínculos de Animação
Inserção de Audio
Inserção de âncora
Inserção de Padding
Aula 8 - Exportações
Exportação PNG para IDE Visual (Construct 3)
Exportação de Design Tokens com Plugin Toolabs DSM
Exportacão HTML com Plugin Anima
Aula 9 - Do Design ao Código - Construct 3
Montagem do App no Construct 3 para exportação HTM5/Cordova/NWjs
AULA 10 - Do Design ao Código - Integração com Firebase
Inserção de Design Tokens no Visual Studio Code em projeto React e React Native
@dualpixel_digital
NOVA AMÉRICA OFFICES
Av. Pastor Martin Luther K. Jr, 126 - Torre 1000 - Sl. 309 - RJ • CEP 20765-000
(21) 2042-0922 • (21) 98577-4875
ADOBE XD – MÓDULO 2
Neste módulo 2 avançamos a partir dos conceitos e técnicas ensinadas no curso Adobe XD – Módulo 1 apresentando ferramentas e recursos para automação com uso de plugins, componentes, design system, design token e animação automática.
Entenda como planejar e produzir telas para projetos mais complexos (cross-platform), que incluem web, mobile e desktop e contribua de forma mais profissional com os desenvolvedores do projeto.
Plano de Estudos
