Ementa: Criação de páginas web incluindo noções de Web design e ferramentas para edição gráfica e animação para Web. Objetivo geral: Capacitar o aluno a criar páginas Web aplicando conceitos do Webdesign e inserindo elementos animados. Objetivos específicos:
- Aplicar conceitos do Web design;
- Conhecer e aplicar técnicas para tratamento de imagens para Web;
- Desenvolver elementos animados para páginas Web;
- Desenvolver projeto final contendo todos os recursos vistos em aula
Conteúdos programáticos
- Conceitos de cores na Web;
- Conceitos de Tipografia na Web;
- Conceitos de Planejamento Visual;
- Tratamento de imagem para Web;
- Pesquisa sobre bibliotecas para animação;
- Implementar animação na Web;
Links de referência:
- http://www.w3.org/standards/
- http://www.w3schools.com/
- http://www.lsc.ufsc.br/~edla/design/conceitos.htm
- http://www.freefoto.com/index.jsp
- http://www.dafont.com/ (fontes para baixar)
- 50 melhores fontes gratuitas de 2013
- http://www.lipsum.com/
- http://colorschemedesigner.com/
- http://www.checkmycolours.com/
- http://coolhomepages.com/
- Responsive Image Solution
- Emphasizing your message (visual hierarchy and Website Layout)
- http://www.creativebloq.com/web-design/wordpress-tutorials-designers-1012990
- Free responsive HTML5 templates
- 45 Beautiful Search Box Designs
- Responsive Web Design, Top 25 responsive design tools,
- O que é design responsivo (infográfico)
- Como fazer web design responsivo (infografico)
- Os 8 maiores problemas do Web design responsivo – como evitá-los. (Artigo)
- What font should I use
- Anatomia de uma página efetiva
- Tendencias do Design Interativo 2013 (slides no slideshare)
- Web design eye-candy: 24 ultra-colourful user interfaces
- 20 ferramentas e recursos para Web designers
- 30 belos exemplos de interfaces com o usuário para dispositivos móveis
- PhoneGap – App para desenvolvimento em dispositivos móveis
- Color Emotion Guide
- Como as cores afetam as compras (infográfico)
- Uma década de Web Design (infográfico)
- 10 termos do Web design que devemos saber (creative blog)
- 15 sites com ícones gratuitos de alta qualidade
- CSS 3.0 Maker (editor online)
- 25 melhores ferramentas photoshop para web designers
- Framer – toolkit para prototipação
- Tipografia – ajuste de caracter por linha
- Free vector icons
- A psicologia das cores no marketing (infográfico)
Frameworks JavaScript-based (alternativa ao Flash)
- D3.js – manipulação de documentos baseados em dados
Vídeos: Profissão de Webdesigner (Globo) O mundo de Rafinha