Curso MCWD 2.0 - Multimedia Certified Web Designer
ModalidadeO aluno poderá realizar o curso nas modalidades presencial ou virtual
Certificado oficialCertificados serão entregues aos alunos que concluírem o curso.
ConsideraçõesO curso MCWD 2.0 capacita profissionais e demais interessados para o desenvolvimento de conteúdo multimídia, web design, criação de sites em dispositivos móveis, como Smartphones e Tablets, a partir do uso integrado de tecnologias.
Além do projeto piloto que será desenvolvido ao final dos 8 módulos, os alunos também poderão
testar conhecimentos nos simulados preparatórios para as provas de Certificação da ADOBE
Dirigido aCurso destinado aos interessados no desenvolvimento de aplicações interativas, programação, aquitetura da informação e web design.
Área de atuaçãoOs profissionais especializados nessa área podem se destacar desenvolvendo web sites para as mais distintas empresas de forma autônoma, ou ainda, trabalhar diretamente em empresas que prestam serviço de TI.
Curso MCWD 2.0 - Multimedia Certified Web Designer
ConteúdoCurso MCWD 2.0 - Multimedia Certified Web Designer
Com a nova geração de comunicação virtual e serviços, faz-se necessário o desenvolvimento de aplicações mais interativas, sofisticadas e com troca de dados. Sites com conteúdo dinamicamente atualizados usando das diversas áreas técnicas do design propriamente dito e da arquitetura da informação, programação, usabilidade, acessibilidade entre outros. Com a formação MCWD, o profissional de Web Design fica capacitado plenamente a atender às necessidades do mercado, que se torna mais exigente.
Ao finalizar a formação MCWD você terá a condição de desenvolver sites com:
Conteúdo dinâmico – a partir de bancos de dados;
Conteúdo multimídia (com animações, áudio e inserção de vídeos);
Imagens otimizadas para a Internet;
Conceitos de web design (com direção de arte e usabilidade);
Qualidade e produtividade (com o uso integrado das tecnologias Adobe Web & Design Premium).
Desenvolvimento de sites para smartphones e tablets.
Realizando sua capacitação na ENG, você faz os exames simulados, preparatórios para as provas de Certificação da ADOBE, além de projetos-piloto que irão solidificar os conhecimentos adquiridos nas aulas instrucionais.
A formação completa é composta por 08(oito) treinamentos/ módulos:
- Dreamweaver
- Fireworks
- Introdução a Bases de Dados
- Dreamweaver com acesso a base de dados
- Flash Básico
- Direção de Arte para Internet e Intranet
- Design Responsivo/Adaptativo
Pré-requisito: Conhecimento de Informática básica e noção de Web.
Conteúdo Programático:
DREAMWEAVER
Tipos de documentos web: HTML, XHTML, XML, XSLT.
A informação versus formatação
Formatos XHTML: Transitional, Frameset, Strict.
Breve análise: XHTML 1.1.
Criando um site no Dreamweaver.
Adicionando conteúdo ao site:
- paragrafos
- listas
- caracteres especiais
- tag <span>
Trabalhando com tags <meta>
Introdução às folhas de estilo CSS:
- redefinindo tags
- Criando o layout
- Tabelas
- Tag <div>
- Tabelas de dados
- Como criar código xhtml correto em tabelas que apresentam dados.
Adicionando recursos de navegação ao site:
- links
- âncoras
- barra de navegação
Paradigmas para navegar entre conteudos de um site:
- página a página
- usando a tag <iframe>
- usando Ajax (breve comentário)
Agilizando a produção:
- Bibliotecas e Templates
- Criando formulários
- Adicionando comportamentos Javascript ao site (ex: validação de formulários).
Checando o site do ponto de vista da qualidade:
- Executando os testes internes do Dreamweaver
- Submetendo à aprovação do W3C.
Publicando o site:
- FTP
- Sincronização
- Recurso 'Cloak'
- Comandos GET e PUT
- Tipos de CHMODE
- Projeto Piloto
FIREWORKS
Introdução
- Sobre o Fireworks
- Fireworks PNG
Conhecendo o ambiente de trabalho
- Criar, configurar e salvar um novo documento
- A página inicial
- Abrir um documento existente
- A área de trabalho
- O Painel Tools (Ferramentas)
- O Painel Properties (Propriedades)
- O Painel Layers (Camadas)
- Bitmaps
- Formas básicas
- Formas compostas
- Formas livres
Texto
- Criar e formatar e blocos de texto
- Editar blocos de texto
- Anexar texto a um caminho
- Correção Ortográfica
- Verificar e corrigir a ortografia
- Personalizar a verificação ortográfica
Máscaras e Mesclagem
- Máscaras
- Máscaras de Vetor
- Máscaras de Bitmap
- Criar máscara com o comando Paste
- Criar máscara com o comando Paste Inside
- Criar máscara com o painel Layers
- Mesclagem
- Modos de mesclagem
Estilos, Símbolos e URLs
- Estilos
- Aplicar um estilo
- Criar um estilo
- Excluir um estilo
- Salvar uma biblioteca de estilos
- Importar estilos
Animação
- Símbolos de animação
- Criar um símbolos de animação
- Visualizar uma animação na área de trabalho
- Estados
- Adicionar estados
- Duplicar estados
- Exportar uma animação
Slices, Rollover e Hotspots
- Slices (Fatias)
- Criar slice com base em um objeto selecionado
- Rollover (Sobreposição)
- Adicionar interatividade simples a slices
- Criar slice com a ferramenta Slice
- Adicionar interatividade deslocada simples
- Atribuir URLs a slices
- Hotspots (Pontos de Acesso)
- Criar um hotspot retangular
- Criar um hotspot circular
- Criar um hotspot com forma irregular
- Preparar hotspots para exportação
- Criar mapas de imagem
Botões e Menus Pop-up
- Criar uma barra de navegação básica
- Menus pop-up
- Exportar o menu pop-up
Desenvolvimento de protótipos de sites web
- Trabalho com páginas do Fireworks
- Criar um protótipo de página
- Criar uma página-mestre
- Criar novas páginas a partir da página-mestre
- Editar a página-mestre
- Exportar um layout de CSS
Otimização e exportação
- Usar o Export Wizard
- Usar o Imagem Preview
- Otimizar na área de trabalho
- Otimizar usando uma opção pré-definida
- Escolher um tipo de arquivo
- Exportar a partir da área de trabalho
Automação de tarefas
- Extensão do Fireworks
- Criação de scripts
- Criação de scripts com o painel History
- Salvar etapas como um comando para reutilização
- Sobre a criação de scripts com JavaScript
- Gerenciar comandos
- Renomear um comando personalizado
- Excluir um comando personalizado
- Editar um comando usando JavaScript
- Editar ações selecionadas no painel History usando JavaScript
INTRODUÇÃO AO BANCO DE DADOS
Diferenciação entre SBD's e SGBD's
Tipos de bancos de dados:
- Relacional
- Orientado a objetos
- XML
Ferramentas comerciais open source existentes
Ferramentas comerciais proprietárias existentes
Como projetar um Banco de Dados
- Modelagem de aplicativos versus modelagem de banco de dados
- Como determinar os dados necessários para o aplicativo
- Introdução ao meta modelo E-R.
- Principais casos de equivocos em modelagem E-R
- Distinção entre termos: relação e relacionamento.
- Compreendendo o modelo reducionista relacional.
- Organização dos dados em tabelas
- Os relacionamentos entre tabelas
- Normalização de banco de dados
- Uso de Índices
Conceitos e sintaxe SQL
- Comando SELECT
- Cláusulas FROM, WHERE, ORDER BY e INNER JOIN
- Comando UPDATE
- Comando INSERT
- Comando DELETE
Discussão sobre como publicar bancos de dados na web
DREAMWEAVER AVANÇADO COM BANCO DE DADOS
Diferenciação entre páginas estáticas e páginas dinâmicas
Definindo um site dinâmico no Dreamweaver
Linguagens server-side suportadas pelo Dreamweaver (breve análise)
- ASP.NET
- PHP
- JSP
- CFM
Tipos de bancos de dados.
Criando a comunicação entre a base de dados e a linguagem escolhida:
- DSN (ASP.NET, JSP, CFM)
- Acesso direto ao servidor de banco de dados (PHP)
Discussão sobre a estrutura para desenvolver aplicativos web:
- o modo linear (apresentado no curso)
- modos não lineares (breve demonstração para aqueles que pretendem avançar em programações mais complexas)
Criando uma recordset.
Criando uma página de resultados:
- comportamento Repeat Region
- adicionando a barra de navegação
- adicionando a barra de status
Adicionando imagens dinamicamente à página de resultados
Envio de dados através de páginas
- HIDDEN FIELDS
- GET
- POST
- COOKIE
- SESSION
Compreendendo a confecção de um website dinâmico: lado cliente X lado administrativo
Base para desenvolvimento de um website:
Lado Cliente:
- página de busca
- simples
- composta
- página de resultado
- usando a cláusula SELECT do SQL
- usando a cláusula INNER JOIN do SQL adjunto ao SELECT
- página de detalhe
Lado Administrativo:
- Controle de acesso
- Página de login
- Protegendo páginas contra acesso indevido
- Página de inserção
- Página de edição
- Página de deleção de registros
Projeto Piloto
FLASH PROFESSIONAL
- Apresentação
-Introdução
-O que há de Novo no Flash CS5
-A interface do Flash
-Criando um novo documento
-A Barra de Ferramentas
-A Timeline
-Introdução à Animação
-Animação quadro a quadro
-Biblioteca
-Criação de Símbolos
-Animação Tween Motion (Clássica)
-Animação Tween Motion (CS5)
-Animação dentro de um movie clip (exercício)
-Máscara (exercício)
-Motion Presets
-Animação com Bones
-Filtros
-Animação com filtros
-Blends
-Introdução ao Actionscript
-O painel de Ações
-Ações básicas de navegação
-Botões (simples, invisível, com áudio)
-Ações no botão
-Criando uma navegação na timeline
-Ação getURL()
-Abrindo uma página web
-Abrindo um cliente de e-mail
-Áudio
-Importando arquivos de áudio
-Utilizando áudio da biblioteca comum
-Vídeo
-Conversão de arquivos de vídeo
-Publicação
-Configurações do HTML
-Configurações do Flash
-Configurações para arquivos acessados em CD-ROM.
-Projeto Final
FLASH PROFESSIONAL AVANÇADO
- Introdução
- Revisão (Classic Motion Tween, Motion Tween CS5, Shape Tween, Motion Guide e Máscara)
- Movie Clip
- Instâncias
- Classe
- Introdução ao Actionscript
- Pontuação
- Variáveis
- Propriedades
- Métodosº Dia - Manhã - 2º Tempo
- Máscara Dinâmica
- Arrastar e Soltar
- Janelas
- Menu Deslizante
- Menu Abre e Fecha Dia - Tarde - 1º Tempo
- Tela Cheia
- Menu de Opções / Impressão
- Posição de um objeto na telaº Dia - Tarde - 2º Tempo
- Propriedades
- A ação With
- Botão selecionado/não selecionado
- Pré-carregador simples
- Pré-carregador avançado
- Pré-carregador com porcentagem
- Pré-carregador com barra de progressão animadaia - Tarde - 1º Tempo
- Leitura de dados externos
- Leitura de dados externos com XML
- Leitura de dados externos com XML e imagens
- Leitura de arquivos externos (SWF, JPG e PNG)
- Data e Hora (relógio)
- Formulário de Email
- Projeto Piloto
DIREÇÃO DE ARTE E USABILIDADE NA WEB
- Características do Meio (Resolução, Profundidade de Cor, Tipologia, Cachê)
- O Projeto Gráfico
- Interfaces
- Metáfora
- Tema
- Projeto baseado em Informação
- Imagem Digital
- Formatos
- Anti-aliasing
- Dithering
- Gif Animado
- Imagem de Fundo
- Corte de Imagens em Fatias (Slicing)
- Javascript
- Flash
- Preload Images
- Pop Up
- Templates
- Libraries
- Server Side Includes
- DHTML
- Layers
- CSS e Timeline.
- Teoria da Usabilidade
TÉCNICAS DE INTEGRAÇÃO ENTRE DESIGN E USABILIDADE
- Integração Creative Studio Web Standard
- Produção Integrada com os softwares Adobe Creatve Suite Web Standard: Dreamweaver, Fireworks, Flash e Contribute para a criação de um Site - Piloto