Web Design

web_design

O curso de Web Design 120h desenvolve a criação de layouts e projetos para sites responsivos com HTML, CSS e JavaScript, adaptados aos diferentes formatos de tela e dispositivos, levando em conta a experiência de usuário, interfaces e estratégias para a otimização em mecanismos de buscas.
É formado pelos módulos de Layout Web, User Interface & Experience, Search Engine Optimization e Web Front End.

Pré requisitos

Para cursar Web Design é recomendado que você tenha conhecimento em um software gráfico como Photoshop ou Illustrator, para auxiliar no desenvolvimento de layouts.

Habilidades

Criação de sites responsivos considerando a experiência do usuário, com desenvolvimento front end (HTML, CSS, JavaScript e JQuery) e otimização para mecanismos de busca (SEO).

Oportunidades

Após a conclusão do curso, você poderá atuar como freelancer, em agências de comunicação digital, estúdios de web design, empresas de diferentes segmentos, entre outros.

GRADE CURRICULAR

lw

Layout Web 30h

O curso de Layout Web 30h aborda os princípios do web design e desenvolvimento criativo para a elaboração de layouts e templates responsivos para sites ou blogs, levando em consideração diferentes resoluções de telas e dispositivos diversos.

[AULA 1] INTRODUÇÃO
Overview: História Web, Web 3.0, Princípios de Rede; Normativas e Padrões: W3C, Dinâmica de Funcionamento: Domínios, Subdomínios, HTTP, HTTPS, Hospedagens; Estudos de Caso: Google, awwwards.com. Oficina: Briefing.

[AULA 2] MERCADO WEB E METODOLOGIA DE PROJETO
Briefing; Metodologia de Projeto; Etapas de Desenvolvimento: da Concepção ao Mockup com Wireframes; Tabelas Indicativas de Orçamentos; Estudo de Caso. Oficina: Levantamento, Referências, Moodboard.

[AULA 3] APLICAÇÕES E TENDÊNCIAS
Layout e Funções; Templates WordPress; Estudos de Caso Nacionais e Internacionais; Resolução do Site; Resolução em Telas; Telas HD e Dispositivos Móveis; Layout Responsivo: Introdução do Design Responsivo; Desktop x Mobile; Novos Modelos. Oficina: Análise Estrutural de Referências.

[AULA 4] COMPOSIÇÃO ALINHAMENTO E GRID
Ordem de Leitura; Grids; A Importância dos Espaços Vazios; Noções de Diagramação: Títulos, Subtítulos, Texto, Espaçamento, Fontes, Peso da Fonte; WebFonts; O que Não Fazer. Oficina: Geração de Alternativas.

[AULA 5] OFICINA: DESENVOLVIMENTO DE PROJETO EM WIREFRAMES
Elementos Comuns do Site: Cabeçalho, Rodapé, Texto, Imagens, Imagem de Fundo, Tabelas, Vídeos, Menus, Anúncios. Oficina: Geração de Alternativas dos Elementos.

[AULA 6] WEB COLOURS
Cores Hexadecimais e RGB; Cores Comumente Utilizadas por Segmento; Composições para Web: Harmonia, Contraste; Legibilidade; Criação de Paletas de Cores. Oficina em Software Gráfico: Criação de Paletas de Cores.

[AULA 7] OFICINA: LAYOUT
Geração de Alternativas em Software Gráfico, Discussão e Seleção.

[AULA 8] OFICINA: LAYOUT E WIREFRAME
Refinamento do Projeto: Wireframe para o Projeto Final.

[AULA 9] OFICINA: LAYOUT RESPONSIVO
Adaptação para Responsividade.

[AULA 10] FINALIZAÇÃO E APRESENTAÇÃO
Finalização dos Projetos, Apresentação e Comentários.

uix

User Interface & Experience 30h

O curso de User Experience & Interface 30h apresenta os componentes da experiência do usuário, arquitetura da informação, design universal, testes de usabilidade e desenvolvimento de projeto web de user interface e user experience.

[AULA 1] INTRODUÇÃO EXPERIÊNCIA DO USUÁRIO
Conceitos; Identificação e Compreensão dos Usuários; Componentes da Experiência do Usuário; Aplicação em Diversos Segmentos: Produto, Serviço; Sistema; Estudos de Caso. Oficina: Análise de Referências.

[AULA 2] TESTES DE EXPERIÊNCIA DO USUÁRIO
Métricas; Testes e Ferramentas; Pesquisa; Observação; Grupo de Foco; Entrevistas; Registro de Uso Real; Estudo de Campo; Questionário; Protocolo de Questionamentos; PrEmo; Expressões Faciais; ESD e DRM; Corpus; iScale; UX Curve; Cenário. Oficina: Pesquisa.

[AULA 3] IDEAÇÃO
Busca por Soluções com Foco no Usuário; Envolvimento de Usuários; Participantes Multidisciplinares; Geração e Teste de Ideias; Criação de Cenários; Observação de Tendências de Comportamento; Mockup e Prototipagem das Soluções Identificando os Pontos Fortes e Fracos; Gargalos. Oficina: Análise da Jornada do Usuário, Diagnóstico de Problemas e Recomendações de Aprimoramento para o Projeto.

[AULA 4] INTRODUÇÃO INTERFACE DO USUÁRIO
Conceitos: User Interface (UI) x User Experience (Ux); Interfaces Físicas e Interfaces Comunicacionais; Estudos de Caso Nacionais e Internacionais; Interatividade; Limitações do Usuáro e Limitações Técnicas/Tecnológicas; Pesquisa em Design de Interface. Oficina: Briefing e Brainstorm de Aplicativo.

[AULA 5] ARQUITETURA DA INFORMAÇÃO
Conceitos: Contexto, Conteúdo, Usuários, Organização, Busca, Rotulagem, Navegação, Categorização, Hierarquia da Informação; o Layout e a Arquitetura da Informação. Oficina: Organização de Informações do Site.

[AULA 6] USABILIDADE
Boas Práticas para Interfaces Digitais: Clareza, Consistência, Autonomia, Feedback, Tolerância, Guidelines Windows e IOs; Design Responsivo; As Heurísticas de Nielsen; Aplicação das Análises Heurísticas. Oficina: Discussão sobre Diferenças de Aplicação entre Diferentes Dispositivos.

[AULA 7] OFICINA: ÍCONES
Oficina: Desenvolvimento de Ícones.

[AULA 8] ACESSIBILIDADE, PRINCÍPIOS DO DESIGN UNIVERSAL E TESTES DE USABILIDADE
Deficiências Visuais; Baixa Visão; Daltonismo; Deficiências Auditivas; Captions; Recursos; Estudo de Caso: Facebook; Design Universal: Uso Equitativo, Flexibilidade no Uso, Simples e Intuitivo, Informação Perceptível, Tolerância ao Erro, Baixo Esforço, Tamanho e Espaço para o Uso; Estudos de Caso. Oficina: Apresentação e Análise dos Sites Pesquisados.

[AULA 9] PROTOTIPAGEM E AVALIAÇÃO
Importância e Ferramentas da Prototipagem; Low Fidelity Prototyping. Oficina: Planejamento da Tarefa, Jornada do Usuário, Desenvolvimento.

[AULA 10] FINALIZAÇÃO E APRESENTAÇÃO
Finalização da Oficina e Apresentação.

wfe

Web Front End 45h

O curso de Web Front End 45h trata do desenvolvimento front end através das linguagens CSS, HTML, JavaScript e JQuery, passando por conceitos do Design Responsivo e aplicação de frameworks como o Bootstrap.

[AULA 1] INTRODUÇÃO AO HTML
Apresentação dos Objetivos e Estrutura da Disciplina; Objetivos Desenvolvimento Front End: Acessibilidade, Usabilidade e Performance; Dinâmica HTML; Cronograma de Desenvolvimento de um Site; Controle de Versão; Sintaxe Documentos HTML; Tags; Organização de Títulos e Subtítulos; Formatação de Texto; Cores em Objetos. Oficina: Hello World.

[AULA 2] INTRODUÇÃO AO CSS
Sintaxe CSS; Cascade; Seletores e Flutuação; Formatação de Texto; Estilização; Estilização com Classes; Imagens de Fundo; CSS Reset; Display; Positions: Static, Relative, Fixed e Absolut; Integração HTML e CSS.

[AULA 3] CSS BOTÕES
Button Tags; Button Sizes; Active State; Disabled State; Hover Buttons; Botões com Texto; Icon Buttons; Opções Avançadas de Animação para Botões.

[AULA 4] CSS, TABELAS, FORMULÁRIOS E IMAGENS
Striped Rows; Bordered Table; Hover Rows; Condensed Table; Contextual Classes; Responsive Tables; Caixas de Seleção; Caixas de Texto; Botões de Seleção; Criar Formulário Básico para Contato; Responsive Images; Image Shapes; Rounded; Circle; Img Thumbnail.

[AULA 5] OFICINA
Exercício em CSS e Html.

[AULA 6] JAVASCRIPT
Definição de Comportamento do Site; Definição de Varíáveis; Diferenciação Strings; Integers e Floats; Aplicação de Condicionais; Descrever Argumentos Relacionados com Funções; Valores e Funções; JavaScript Frameworks; DOM Script (Document Object Model).

[AULA 7] JQUERY
Árvores JQuery Manipulação de DOM; Aplicação de Funções através de JQuery Docs; Integração JavaScript e JQuery. Oficina: Menu Carrossel.

[AULA 8] DESIGN RESPONSIVO
Colunas CSS; Print Classes; Test Classes.

[AULA 9] AMBIENTE DE DESENVOLVIMENTO: LESS & SASS
Less; Ruby; Node; SASS; Sublime Test; Máquinas Virtuais. Oficina: Construção Layout Responsivo.

[AULA 10] BOOTSTRAP
Desenvolvimento Front End a partir de um Framework; Classes Dinâmicas; Css Columns.

[AULA 11] DESENVOLVIMENTO DE PROJETO
Desenvolvimento do Projeto e Acompanhamento do Professor.

[AULA 12] FORMULÁRIO
Execução de Formulário.

[AULA 13] REVIEWING E REFACTORING, PRÉ-APRESENTAÇÃO
Reviewing e Refactoring; Pré-Apresentação dos Projetos e Comentários.

[AULA 14] REFINAMENTO DO PROJETO
Refinamento do Projeto.

[AULA 15] FINALIZAÇÃO E APRESENTAÇÃO
Finalização, Apresentação do Projeto e Comentários.

seo

Search Engine Optimization 15h

O curso de Search Engine Optimization 15h apresenta uma visão geral dos mecanismos de busca, ferramentas para webmaster, estratégias e otimizações para posicionamento em sites de busca de acordo com o perfil do público-alvo.

[AULA 1] INTRODUÇÃO
Visão Geral dos Mecanismos de Busca: PageRank; Conceitos; Busca Orgânica e Busca Paga; Diretrizes dos Principais Mecanismos de Busca e do World Wide Web Consortium; Critérios de Classificação de um Site; O Valor do Domínio; Benefícios do Uso de Código em HTML e CSS para Seo; Qualidade da Requisição e Tráfego; Tráfego Desejado; Mudanças nos Mecanismos de Busca e Implicações para o SEO; Panda Update; Search Spiders/Bots.

[AULA 2] ESTRATÉGIAS
Estratégias White Hat; Escolha das Palavras-Chave; Títulos e Tags; Arquitetura da Informação e Estrutura do Site; Anúncios Pagos e Links Patrocinados; Modelos de Publicidade Paga; Qualidade dos Conteúdos; Serviços de Diretórios; Otimização para Busca Vertical; Otimização para SEO Local; Links: Link Juice, Deep Linking, Link Building Campaigns, Backlinks; Métricas para Links.

[AULA 3] OTIMIZAÇÃO
On Page Optimization e Off Page Optimization; Páginas de Baixo Valor; NoFollow Tag; Distância de Cliques entre as Páginas e a Home; Site Map; Latent Semantic Analysis; Meta Tags; Otimização de Código; SEO para WordPress; Importância do Texto Âncora; Otimização de Imagens e Vídeos; Alt Attributes; NoScript; Ativos Linkáveis; Soluções para Conteúdo Duplicado, User Reviews; CMSs que Facilitam o SEO.

[AULA 4] MÉTRICAS E RELATÓRIOS, FERRAMENTAS
Estatísticas de Tráfego; Taxa de Conversão; Google Webmasters Tools; Keyword Analytics; Google Keyword; Plano de Ações e Acompanhamento de Palavras-Chave; Ferramentas para Seo: Linkscape, mozRank, mozTrust, Social Media Metrics.

[AULA 5] PROJETO DE SEO
Segmentação; Perfil do Público-Alvo; Objetivos; Escolha e Composição de Palavras Chave; Termos Longos e Curtos; Estratégia de Links.

Carga horária total: 120h

Sempre atualizamos nossos cursos quando necessário. Esta é a grade curricular mais recente.

nome@4ed.school

Fornecemos uma conta Google Apps for Education com acesso a e-mail, agenda do curso, documentos, planilhas e espaço ilimitado no drive.

Material de Apoio

O conteúdo das aulas e materiais complementares para aprendizagem são compartilhados no drive que você poderá acessar por tempo ilimitado.

Certificado

Com frequência mínima de 75% e desempenho acima de 70 pontos em cada módulo, você recebe o certificado do curso com a autenticidade 4ED.

INVESTIMENTO

12x R$ 300,00

Cartões de crédito Visa, MasterCard, Elo, Diners, American Express, JCB e Aura.

8x R$ 450,00

Cheque* ou boleto* parcelado. Acréscimo de R$ 10,00 por parcela no boleto.

R$ 3.240,00

Boleto à vista com 10% de desconto. Data de vencimento para um dia após a inscrição.

*Condições de pagamento sujeitas a análise de crédito. Saiba mais sobre o parcelamento.

Gostei, quero saber mais