Design Digital

Design digital
Fundamentos de web design
AVISO DE DIREITOS Copyright 2012 por Adobe Systems Incorporated. All rights reserved. Esta obra est licenciada sob uma licena Creative Commons Atribuio-No comercial-Compartilhamento pela mesma licena 3.0 Unported. Para obter mais informaes sobre os direitos concedidos sob essa licena, visite: http://creativecommons.org/licenses/by-nc-sa/3.0/
Somente para fins educacionais, a Adobe Systems concede o direito de fazer cpias conforme necessrio do todo ou de parte do currculo de Design digital: Fundamentos de web design, por meio de cpia ou arquivos impressos do documento PDF, desde que voc sempre inclua pginas contendo informaes de direitos autorais e distribua essas cpias sem fins lucrativos. responsabilidade da sua organizao monitorar a cpia e o uso deste currculo e a conformidade com os termos deste aviso. Voc concorda que a Adobe Systems se reserva o direito de fazer auditorias em relao conformidade da sua organizao com esses termos, mediante aviso prvio. Ficam proibidos quaisquer outros tipos de cpia, reproduo e transmisso. Este aviso no abrange o uso de software da Adobe Systems. Voc deve cumprir com os termos do Acordo de licena de usurio final fornecido com o software. MARCAS REGISTRADAS Adobe Systems Inc, o logotipo da Adobe Systems, o logotipo da Adobe Certified Associate, Adobe Dreamweaver CS6, Adobe Fireworks CS6, Adobe Flash CS6, Adobe BrowserLab, Adobe Photoshop CS6 Extended, Adobe Illustrator CS6 e Adobe Acrobat X Pro so marcas registradas ou marcas comerciais registradas da Adobe Systems, Inc., nos Estados Unidos e/ou em outros pases. Materiais de terceiros (como produtos, servios, nomes de empresas, logotipos, design, ttulos, palavras ou frases) nestes materiais podem ser marcas registradas de seus respectivos proprietrios. AVISO DE RESPONSABILIDADE As informaes contidas nestes materiais de treinamento so distribudas COMO ESTO, sem garantia. Embora precaues razoveis tenham sido tomadas na preparao destes materiais, nem a Adobe, Inc., nem seus licenciantes sero responsabilizados perante qualquer pessoa ou entidade com relao responsabilidade, perda ou danos alegados como causados diretamente pelas instrues contidas nestes materiais ou pelos produtos de software e hardware descritos neste documento. Esses materiais contm links para sites de terceiros que no esto sob o controle da Adobe, e a Adobe no responsvel pelo contedo de qualquer site vinculado. A Adobe fornece esses links apenas a ttulo de comodidade, e a incluso do link no significa que a Adobe endossa o contedo nesses sites de terceiros. ISTE NETS*S reimpresso com permisso da National Education Technology Standards for Students, 2007, ISTE (International Society for Technology in Education), iste@iste.org, www.iste.org. All rights reserved. AGRADECIMENTOS Autores Anuja Dharkar, Dale Underwood, Kirsti Aho e Ellen Flaherty Reviso CS6 Scott Tapley, Jay Heins, Dale Underwood, Ellen Flaherty e Matt Niemitz Editores Dale Underwood e Matt Niemitz Responsvel editorial Malinda McCain Professores colaboradores Cindy Agnew, Joanne Fevergeon, Brian Martin, Shannon Thissen, Mary Ann Campo, Dave Farnell, Leanne Fike, Will Fry, Lance Groesbeck, Nancy Jensen, Shane Loucks, Sara McReynolds, Doug Reppe, Ralph Rise, Chris Sande, Peggy J. SoongYaplee, Loretta Speed, Anne Taylor, Bre Urness-Straight, Kim Cavanaugh, Mark DuBois, Sheri German, Colin Maxwell, Kristine Kopelke Gerente do programa Matt Niemitz Arte da capa Scott Design Fotografia e vdeo Matthew Aho e Dan Cowles
2012 Adobe Systems Incorporated
Sumrio
Sumrio
Viso geral do curso e preparao ........................................................................................................... 3
Projetos do primeiro semestre ................................................................................................................ 4 Projetos do segundo semestre ................................................................................................................. 4 Mtodos alternativos para utilizao do Design digital .......................................................................... 5 Matrizes de competncias do Design digital .......................................................................................... 6 Preparao do computador em sala de aula .......................................................................................... 14 Melhoramento da sala de aula .............................................................................................................. 19 Apresentao da viso geral das competncias .................................................................................... 23
Normas da ISTE NETS*S para os alunos ................................................................................................ 27 Objetivos da Adobe Certified Associate ................................................................................................. 29
Projeto 1: Widgets
Projeto 5: Jogo interativo
Orientaes para o instrutor do projeto Apresentaes Guias do aluno
Projeto 2: Web design e planejamento
Projeto 6: Narrativa digital
Projeto 3: Desenvolvimento e implantao na web
Projeto 7: Aplicativo mvel
Projeto 8: Portflio final da web Projeto 4: Portflio da web
Orientaes para o instrutor dos projetos Guias do aluno
Sumrio
Viso geral do curso e preparao

O Design digital: Fundamentos de web design um curso com durao de dois semestres com base em projetos que ensina habilidades de comunicao digital no contexto do profissional de web design e do processo de desenvolvimento, utilizando ferramentas da web da Adobe. O Design digital desenvolve habilidades em quatro reas principais: Gerenciamento de projetos e colaborao Design Pesquisa e comunicao Ferramentas profissionais para edio de pginas da web
Os alunos desenvolvem essas habilidades principais em espiral cada projeto acrescenta habilidades mais desafiadoras s competncias bsicas. O Design digital aborda cada uma dessas reas utilizando uma abordagem com base em projetos. Cada projeto tem fases que seguem um processo de design e desenvolvimento, do planejamento do projeto at a avaliao e o lanamento. Para simular um ambiente de trabalho profissional, os alunos migram gradualmente seu projeto de design de um processo individual para um processo em grupo. O design e o trabalho tcnico por sua prpria natureza so repetitivos; assim, os projetos contm atividades que exigem que os alunos avaliem e, em seguida, faam novo design e reformulem as suas comunicaes. Ateno especial dada aos conceitos de desenvolvimento e aos princpios para o design completo e eficaz. O diagrama a seguir mostra a sequncia e o fluxo dos projetos:
Projetos do primeiro semestre

O primeiro semestre do curso Design digital (Projetos 1 a 4) desenvolve habilidades que constituem a base da produo de comunicaes prontas para a web: princpios de design, documentos de design, storyboards, desenvolvimento na web, habilidades compartilhadas de gerenciamento de projetos, como entrevistas e programao de projetos, reviso por colegas e novo design. As atividades do projeto se concentram no desenvolvimento de comunicaes eficazes que podem ser implementadas na web. Os alunos desenvolvem um widget, uma variedade de imagens grficas, um site de cliente e um portflio da web. Um alto grau de flexibilidade est implcito no currculo. As principais habilidades enfatizadas neste semestre so: Habilidades bsicas, como participar de entrevistas e responder a feedback Criao de site de clientes Resoluo de problemas que ajudam a manter mltiplas perspectivas Reflexo sobre o processo de design e a comunicao eficaz Ensino entre colegas e avaliao em um ambiente colaborativo Publicao tcnica na web
No primeiro semestre, os alunos utilizam o Adobe Photoshop CS6 e o Adobe Fireworks CS6 para desenvolver grficos estticos e interativos. Eles utilizam o Adobe Dreamweaver CS6 para projetar e criar sites. Este contedo prepara os alunos para a Adobe Certified Associate, Comunicao na web, utilizando o exame do Adobe Dreamweaver CS6.
Projetos do segundo semestre

O segundo semestre do Design digital (Projetos 5 a 8) promove as habilidades de design e desenvolvimento do aluno, concentrando-se no desenvolvimento de mdia avanada. Os alunos continuam a trabalhar individualmente ou em equipes e produzem comunicaes de mdia avanada, como jogos interativos, narrativas digitais e aplicativos mveis. Eles se concentram na eficcia de design de mdia avanada, storyboarding multimdia, especificaes do design e desenvolvimento frequente com clientes. Eles produzem documentos de design e complementos visuais que os clientes revisam. Eles desenvolvem designs de mdia avanada que solucionam desafios especficos de comunicao. Eles desenvolvem habilidades tcnicas para atender s necessidades do cliente. As principais habilidades enfatizadas neste semestre so: Habilidades bsicas, como participar de entrevistas e responder a feedback Comunicao com clientes, utilizando documentos de design ou especificaes Design e novo design de acordo com as especificaes do cliente Habilidades de multimdia tcnica, como efeitos de cinema e transies Solues de design, incluindo sistemas de navegao eficazes e narrativas digitais
No segundo semestre, os alunos aprendem o Adobe Flash Professional CS6 para aplicar solues de design que exigem mdia avanada e interatividade. Este contedo prepara o aluno para a Adobe Certified Associate, Comunicao em mdia avanada, utilizando o exame Adobe Flash Professional CS6.
Mtodos alternativos para a utilizao do Design digital

Se as circunstncias no permitirem a utilizao do Design digital no formato de currculo de um ano de durao, h outras maneiras de estruturar o contedo para adequ-lo ao tempo determinado, s habilidades e s limitaes da estrutura do curso. Instruo com base no produto Voc pode usar uma abordagem com base no produto, centrada basicamente em ensinar como utilizar o Adobe Fireworks CS6, Adobe Dreamweaver CS6 ou o Adobe Flash CS6. As orientaes tcnicas includas nos projetos do Design digital so alternativamente apresentadas por produto individual. Por exemplo, baixe o Portflio PDF de todos os guias do Dreamweaver CS6 se planeja simplesmente ensinar as habilidades do Dreamweaver aos seus alunos. Use a sua criatividade com uma abordagem baseada no produto, tentando incorporar um mtodo de ensino com base na atividade. Assim, voc pode ainda utilizar tudo ou partes dos projetos individuais para ensinar sobre produtos especficos. A tabela abaixo mostra em detalhes as etapas especficas em cada projeto que se alinha a cada produto. Dreamweaver Projeto 1: Widgets Etapas 10 a 36 Fireworks Etapas 17 a 26 Etapas 25 a 40 Etapas 16 a 22 Etapas 11 a 13 Etapas 4 a 6, 12 a 30 Etapa 18 Etapa 9 Etapas 6 a 8, 14 a 34 Etapas 10 a 20 Flash
Projeto 2: Web design e planejamento Etapas 5 a 8 Projeto 3: Desenvolvimento e implantao na web Projeto 4: Portflio da web Projeto 5: Jogo interativo Projeto 6: Narrativas digitais Projeto 7: Aplicativo mvel Projeto 8: Portflio final da web Projetos individuais Etapas 3 a 14, 21 a 37, 47 a 50 Etapas 14 a 21
Dependendo do nvel de habilidade dos alunos, voc pode utilizar projetos individuais do currculo Design digital sem concluir outros projetos na sequncia do currculo. Por exemplo, um educador ministrando um curso de jogos poderia querer ensinar apenas o projeto do jogo interativo. Alm disso, possvel adaptar as instrues e utilizar os guias tcnicos dos projetos anteriores para ensinar um projeto individual. Seja criativo! Utilize o currculo Design digital como ponto de partida para o desenvolvimento de seus prprios projetos e de um currculo personalizado para a sua sala de aula. Ao utilizar os guias tcnicos dos produtos existentes, voc pode formular projetos educacionais completos com base em reas de interesse especficas. Se voc criar seus prprios projetos ou cursos, compartilhe-os com a comunidade no Adobe Education Exchange (http://edexchange.adobe.com), onde voc tambm pode navegar em recursos adicionais teis para o ensino com o Adobe Creative Suite 6.
Matrizes de competncias do Design digital

Gerenciamento de projetos Criar para um pblico-alvo e finalidade especficos Pesquisa e comunicao Compreender a funo e a finalidade de widgets Analisar e criticar os widgets e os sites Avaliar e analisar a validade do contedo Avaliar e analisar a navegao do site Compreender as questes de copyright e diretrizes de utilizao normal Defender e praticar o uso legal de imagens Coletar e analisar as necessidades e os objetivos do pblico-alvo para bem informar o design Participar na reviso por pares Comunicar e apresentar as decises do design Comentar sobre um projeto
Design Criar para o(s) seu(s) pblico(s)alvo Aplicar dos princpios de design Criar wireframes Criar componentes de design Aprender fundamentos bsicos de HTML e HTML5 Compreender de CSS Aplicar aspectos de design como cor, design, layout, contraste e composio Integrar imagens e texto
Tcnico Fireworks Compreender a rea de trabalho do Fireworks Criar wireframes Criar componentes de design Preparar imagens Photoshop Compreender a rea de trabalho do Photoshop Redimensionar, girar e cortar imagens Corrigir cor Retocar imagem Criar vrios formatos de arquivo Dreamweaver Compreender a rea de trabalho do Dreamweaver Configurar um projeto da web Usar o painel Inserir Inserir imagens Inserir texto Usar o navegador de widget Inserir um widget em uma pgina da web em HTML Editar e personalizar as regras de CSS Usar o painel Estilos CSS Publicar arquivos na web
Projeto 1: Widgets Foco: Uso de CSS para criar consistncia Princpios de um bom design Wireframe de uma pgina da web Personalizao de um widget Avaliao e comparao de sites Durao: 8 a 12 horas (2 a 3 semanas)
Compreender das
fases de desenvolvimento da web
Fazer o
planejamento grfico com base nas necessidades e no pblico-alvo
Gerenciamento de projetos Projeto 2: Web design e planejamento Foco: Processo profissional de design da web Criao para um cliente Processo da equipe de criao para desenvolvimento do site Interao e comunicao equipecliente Durao: 12 a 18 horas (3 a 4 semanas) Desenvolver um plano de projeto Desenvolver um documento de soluo de design Analisar para selecionar os melhores exemplos Sintetizar o contedo com base na anlise e reflexo Gerenciar e organizar vrias tarefas envolvidas no design em relao produo Compreender as funes e responsabilidades Cumprir as entregas
Design Comunicar ideias e informaes por meio de wireframes simples Fornecer vrias ideias sobre design Sintetizar informaes das reunies de reviso do design Criar wireframes Criar componentes de design Criar storyboards Criar prottipos Aplicar princpios de design Aplicar arquitetura da informao Criar para usabilidade e acessibilidade Criar pginas consistentes Compreender e aplicar aspectos de design, como teoria da cor, layout, contraste e composio Criar para usabilidade e acessibilidade Criar para um pblico-alvo e finalidade especficos Planejar grfico e contedo de mdia avanada com base nas necessidades e no pblico-alvo Criar para um cliente atendendo s suas exigncias
Pesquisa e comunicao Avaliar e analisar a validade do contedo Editar contedo do site Avaliar e analisar a navegao do site Compreender e praticar o uso legal de imagens Compreender ferramentas para criao de animao e contedo interativo Criticar designs Comunicar o objetivo e a finalidade Comunicar e apresentar as decises do design Comentar sobre um projeto Fazer perguntas para focalizar e esclarecer Prestar ateno e interpretar o feedback
Tcnico Dreamweaver Compreender a acessibilidade Fireworks Compreender a rea de trabalho do Fireworks Criar wireframes Criar componentes de design Criar um prottipo Exportar um prottipo para o Dreamweaver
Compreender e
tratar as questes de design do cliente
Gerenciamento de projetos Projeto 3: Desenvolvimento e implantao na web Foco: Colaborao eficaz da equipe Criao para um cliente Desenvolvimento de contedo reutilizvel Uso de normas da web Reviso e processo de novo design Criao de contedo acessvel na web Durao: 20 a 35 horas (5 a 7 semanas) Acompanhar e executar um plano de projeto Acompanhar e executar wireframes e prottipo Acompanhar e prosseguir com as funes e responsabilidades Definir e priorizar tarefas Produzir resultados e cumprir prazos Gerenciar arquivos e usar convenes de nomenclatura de arquivo Executar um ciclo de reviso e novo design Realizar testes de garantia de qualidade
Design Fornecer consistncia e acessibilidade Fornecer navegao universal Integrar imagens, texto e multimdia Planejar grficos e multimdia com base nas necessidades e no pblico-alvo Criar pginas da web usando padres da web Criar com CSS Organizar pginas com CSS Compreender o HTML Usar o HTML bsico Criar modelos e designs reutilizveis Adaptar o contedo para facilitar a leitura e dar nfase Criar design para vrias telas Considerar o tamanho de tela e os requisitos do dispositivo Incorporar o layout e a cor de maneira consistente Criar um teste de garantia de qualidade
Pesquisa e comunicao Comunicar ideais claramente Apresentar um site para um grupo Anotar as crticas Fornecer feedback significativo, mas no excessivamente crtico Prestar ateno e interpretar informaes e feedback Demonstrar a realizao das metas da do novo design Realizar anlise da usabilidade Criar testes de garantia de qualidade
Tcnico Dreamweaver Compreender a rea de trabalho do Dreamweaver Configurar um projeto da web Configurar as propriedades do documento Usar os painis Inserir, Arquivos e Ativos Inserir imagens Inserir texto Criar listas Criar tabelas de dados Criar mapas de imagem Usar layouts de CSS para iniciantes Usar estilos de texto de CSS Criar, modificar e solucionar problemas de CSS Criar modelos Desenvolver site para vrias telas Verificar entrada e sada de arquivos Inserir vdeos HTML5 Verificar links Testar no Adobe BrowserLab
Publicar
arquivos na web Fireworks Otimizar imagens Criar botes Criar barras de navegao Criar menus pop-up Redimensionar e cortar imagens
Gerenciamento de projetos Projeto 4: Portflio da web Foco: Design de portflio eletrnico Planejamento, implementao e teste de designs de site Desenvolvimento de contedo Consistncia no design de site Crtica e apresentao de colegas Durao: 5 a 10 horas (1 a 2 semanas) Planejar e criar um portflio da web Organizar e gerenciar contedo Criar fluxogramas
Design Criar pginas consistentes Criar para um pblico-alvo e finalidade especficos Fornecer consistncia e acessibilidade Fornecer navegao universal Adaptar o contedo para facilitar a leitura e dar nfase
Pesquisa e comunicao Investigar e pesquisar reas de carreiras no mbito de design e desenvolvimento de web Comunicar informaes para pblico-alvo especfico Definir os objetivos e usos de um portflio Solicitar e fornecer feedback Escrever e editar contedo do site
Tcnico Fireworks Otimizar imagens Criar botes Criar barras de navegao Criar menus pop-up Exportar para Dreamweaver Photoshop Redimensionar e girar imagens Dreamweaver Configurar as propriedades do documento Usar o painel Ativos Usar layouts de CSS para iniciantes Usar estilos de texto CSS Criar, modificar e solucionar problemas de CSS (Folhas de estilos em cascata) Criar modelos Criar formas Publicar arquivos na web
Gerenciamento de projetos Projeto 5: Jogo interativo Foco: Animao e mdia avanada para interao Habilidades com Flash Melhor experincia de usurio Avaliao de mdia avanada Durao: 23 a 30 horas (5 a 6 semanas) Avaliar a experincia do usurio na web em diferentes tcnicas utilizadas na mdia avanada Determinar a finalidade do jogo, o pblicoalvo e o objetivo Determinar os recursos disponveis e o nvel de habilidade para desenvolvimento do jogo Escrever proposta para um jogo, com ateno aos cenrios e caracterizao do pblico-alvo
Design Criar uma experincia personalizada Fazer esboos de telas para experincias interativas
Pesquisa e comunicao Pesquisar, avaliar e analisar o uso do Flash em jogos on-line Avaliar e analisar vrios tipos de jogos Pesquisar pblicoalvo e cenrio geral do jogo Pesquisar jogos disponveis atualmente Pesquisar usos apropriados de multimdia em jogos Avaliar o nvel de habilidade do desenvolvedor tecnolgico da equipe Conectar os objetivos do jogo interao e experincia do usurio Comunicar e apresentar as decises do design Criticar designs Comunicar o objetivo e as finalidades Escrever scripts para uma narrativa de jogo
Tcnico Flash Compreender a rea de trabalho Flash Usar ferramentas de desenho Trabalhar com camadas Organizar camadas e bibliotecas Usar mtodos de animao Criar botes interativos Trabalhar com bitmaps Usar ActionScript bsico Usar mtodos de animao Criar e modificar texto Criar efeitos de linha do tempo Criar botes transparentes Salvar e usar predefinies de movimento Publicar documentos Flash
10
Gerenciamento de projetos Projeto 6: Narrativas digitais Foco: Animao e mdia avanada para comunicao Um olhar mais profundo no pblicoalvo e nas necessidades do pblico-alvo Melhor experincia do visitante por meio do uso de narrativas Contedo de mdia avanada acessvel Durao: 20 a 28 horas (4 a 5 semanas) Definir finalidades, metas e pblicoalvo Atribuir funes e tarefas equipe Definir e priorizar tarefas Acompanhar um plano de projeto Compreender e atribuir funes e tarefas Determinar requisitos funcionais da aplicao Criar para um cliente Acompanhar e prosseguir com as funes
Design Criar uma experincia personalizada Criar para o pblico-alvo Fornecer vrias ideias sobre design Aplicar princpios de design grfico Desenvolver storyboards completos e precisos Criar para acessibilidade Criar designs que atendam aos requisitos do cliente Sintetizar e exibir informaes complexas Fazer esboos para experincias interativas
Pesquisa e comunicao Pesquisar exemplos de mdia avanada Compreender a funo e a finalidade das narrativas digitais Analisar o uso eficiente das narrativas digitais Criar um plano do projeto Escrever scripts para uma narrativa digital Realizar um ciclo de reviso e de nova concepo Comunicar-se com pares Pesquisar o pblico-alvo e sites apropriados Usar o Flash de maneira eficiente Conectar as metas com a interao do usurio
Tcnico Flash Importar e compactar udio Otimizar tamanho de arquivo Produzir vdeo Flash Trabalhar com texto e efeitos de texto Usar ferramentas de desenho Organizar camadas e bibliotecas Trabalhar com camadas Otimizar tamanho de arquivo Trabalhar com bitmaps Publicar e testar filmes Usar mtodos de animao Criar contedo Flash acessvel Salvar e usar predefinies de movimento Fireworks Criar wireframes Criar componentes de design
11
Gerenciamento de projetos Projeto 7: Aplicativo mvel Foco: Usabilidade e consistncia Desenvolvimento de aplicativo mvel Reviso individual e por colegas Durao: 15 a 21 horas (3 a 4 semanas) Definir finalidades, metas e usurios Sintetizar e recomendar alteraes durante o processo de design
Design Conectar o contedo e o estilo s necessidades do usurio Criar wireframes Criar componentes de design Considerar tamanhos da tela Criar para vrios dispositivos e sadas Criar para usabilidade
Pesquisa e comunicao Pesquisar mercados de aplicativos existentes Analisar aplicativos similares Criar cenrios do usurio Selecionar quais informaes so importantes Realizar reviso por pares Criticar designs Fornecer feedback significativo, mas no excessivamente crtico Conectar os objetivos do aplicativo interao e experincia do usurio Escrever e editar contedo para o aplicativo Realizar anlise da usabilidade
Tcnico Flash Otimizar tamanho de arquivo Criar e modificar texto Trabalhar com texto e efeitos de texto Criar botes interativos Usar ferramentas de desenho Organizar camadas e bibliotecas Trabalhar com camadas Criar botes transparentes Escrever ActionScript Usar o simulador de dispositivo Publicar aplicativos mveis Fireworks Criar wireframes Criar componentes de design
12
Gerenciamento de projetos Projeto 8: Portflio final da web Foco: Design de portflio eletrnico Sites teis, eficazes Consistncia no design de site Crtica e apresentao de colegas Durao: 2 a 3 horas (3 a 4 dias) Realizar uma oficina de reviso Fornecer crtica construtiva Planejar e atualizar um portflio da web existente Organizar e gerenciar contedo Criar fluxogramas Criar um plano de lanamento
Design Criar pginas consistentes Criar para um pblico-alvo e finalidade especficos Fornecer navegao universal Fornecer consistncia e acessibilidade Adaptar o contedo para facilitar a leitura e dar nfase
Pesquisa e comunicao Avaliar e estimar as habilidades Avaliar e estimar um portflio existente Escrever e editar o contedo do portflio Apresentar um portflio da web para um grupo Solicitar e fornecer feedback Anotar as crticas Investigar e pesquisar reas de carreiras no mbito de design e desenvolvimento de web Planejar carreiras futuras Compreender e praticar habilidades de carreira duradouras: Desenvolver habilidades para pesquisar empregos Desenvolver habilidades de apresentao
Tcnico Dreamweaver Atualizar um portflio da web Adicionar mdia avanada a um portflio da web
13
Preparao do computador em sala de aula

Inclumos informaes tcnicas necessrias para que seu laboratrio de informtica ou sala de aula esteja pronto para implementar o curso Design digital.
Adobe Fireworks CS6
Instale o Fireworks em todas as estaes. Os requisitos do sistema so indicados abaixo e os procedimentos de instalao esto includos no software. Para atualizaes dos requisitos do sistema, visite: www.adobe.com/go/fireworks_systemreqs
Windows
Processador Intel Pentium 4 ou AMD Athlon 64 Microsoft Windows XP com Service Pack 2 (Service Pack 3 recomendado) ou Windows 7 1 GB de RAM (2 GB recomendado) 1 GB de espao disponvel no disco rgido para instalao; espao livre adicional necessrio durante a instalao (no pode ser instalado em dispositivos removveis de armazenamento flash) Tela 1280 x 1024 com placa de vdeo de 16 bit Unidade de DVD-ROM Este software funcionar sem ativao. Conexo de internet banda larga e registro so necessrios para a ativao do software, a validao de assinaturas e o acesso aos servios on-line.*A ativao por telefone no est disponvel.
Macintosh
Processador Multicore Intel Mac OS X v.10.6 ou v10.7 1 GB de RAM (2 GB recomendado) 1 GB de espao disponvel no disco rgido para instalao; espao livre adicional necessrio durante a instalao (no pode ser instalado em um volume que utiliza sistema de arquivo com distino entre maisculas e minsculas ou em dispositivos removveis de armazenamento flash) Tela 1280 x 1024 com placa de vdeo de 16 bit Unidade de DVD-ROM Este software funcionar sem ativao. Conexo de internet banda larga e registro so necessrios para a ativao do software, a validao de assinaturas e o acesso aos servios on-line.*A ativao por telefone no est disponvel.
Adobe Photoshop CS6
Instale o Photoshop CS6 em todas as estaes de trabalho. Os requisitos do sistema e os procedimentos de instalao esto includos no software. Para atualizaes dos requisitos do sistema, visite: www.adobe.com/go/photoshop_systemreqs
Windows
Processador Intel Pentium 4 ou AMD Athlon 64 Microsoft Windows XP com Service Pack 3 ou Windows 7 com Service Pack 1 1 GB de RAM 1 GB de espao disponvel no disco rgido para instalao; espao livre adicional necessrio durante a instalao (no pode ser instalado em dispositivos removveis de armazenamento com base em flash)
Tela 1.024 x 768 (1.280 x 800 recomendado), resoluo de vdeo com cor de 16 bits e 256 MB (512 MB recomendado) de VRAM
14
Sistema compatvel com OpenGL 2.0 Unidade de DVD-ROM Este software funcionar sem ativao. Conexo de internet banda larga e registro so necessrios para a ativao do software, a validao de assinaturas e o acesso aos servios on-line. A ativao por telefone no est disponvel. *Alguns recursos habilitados para GPU no so compatveis com o Windows XP.
Macintosh
Processador Multicore Intel com suporte para 64 bits Mac OS X v10.6.8 ou v10.7 1 GB de RAM 2 GB de espao disponvel no disco rgido para instalao; espao livre adicional necessrio durante a instalao (no pode ser instalado em um volume que utiliza sistema de arquivo com distino entre maisculas e minsculas ou em dispositivos removveis de armazenamento flash) Tela 1.024 x 768 (1.280 x 800 recomendado), resoluo de vdeo com cor de 16 bits e 256 MB (512 MB recomendado) de VRAM Sistema compatvel com OpenGL 2.0 Unidade de DVD-ROM Este software funcionar sem ativao. Conexo de internet banda larga e registro so necessrios para a ativao do software, a validao de assinaturas e o acesso aos servios on-line. A ativao por telefone no est disponvel.
Adobe Illustrator CS6
Instale o Illustrator CS6 em todas as estaes de trabalho. Os requisitos do sistema e os procedimentos de instalao esto includos no software. Para atualizaes dos requisitos do sistema, visite: www.adobe.com/go/illustrator_systemreqs
Windows
Processador Intel Pentium 4 ou AMD Athlon 64 Microsoft Windows XP com Service Pack 3 ou Windows 7 com Service Pack 1 1 GB de RAM (3 GB recomendado) para 32 bits; 2 GB de RAM (8 GB recomendado) para 64 bits. 2 GB de espao disponvel no disco rgido para instalao; espao livre adicional necessrio durante a instalao (no pode ser instalado em dispositivos removveis de armazenamento com base em flash) Tela 1.024 x 768 (1.280 x 800 recomendado) com placa de vdeo de 16 bits Unidade de DVD-ROM* Alguns recursos no Adobe Bridge contam com placa de vdeo compatvel com DirectX 9 com pelo menos 64 MB de VRAM Este software funcionar sem ativao. Conexo de internet banda larga e registro so necessrios para a ativao do software, a validao de assinaturas e o acesso aos servios on-line. A ativao por telefone no est disponvel.
Macintosh
Processador Multicore Intel com suporte para 64 bits Mac OS X v10.6.8 ou v10.7 2 GB de RAM (8 GB recomendado) 2 GB de espao disponvel no disco rgido para instalao; espao livre adicional necessrio durante a instalao (no pode ser instalado em um volume que utiliza sistema de arquivo com distino entre maisculas e minsculas ou em dispositivos removveis de armazenamento flash)
15
Tela 1.024 x 768 (1.280 x 800 recomendado) com placa de vdeo de 16 bits Unidade de DVD-ROM* Este software funcionar sem ativao. Conexo de internet banda larga e registro so necessrios para a ativao do software, a validao de assinaturas e o acesso aos servios on-line. A ativao por telefone no est disponvel. *Verses do Illustrator vendidas na Europa Continental exigem uma unidade de DVD-ROM compatvel com DVDs de camada dupla
Adobe Dreamweaver CS6
Instale o Dreamweaver em todas as estaes de trabalho. Os requisitos do sistema so indicados abaixo e os procedimentos de instalao esto includos com o software. Para atualizaes dos requisitos do sistema, visite: www.adobe.com/go/dreamweaver_systemreqs
Windows
Processador Intel Pentium 4 ou AMD Athlon 64 Microsoft Windows XP com Service Pack 2 (Service Pack 3 recomendado); Windows Vista Home Premium, Business, Ultimate ou Enterprise com Service Pack 1; ou Windows 7 512 MB de RAM 1 GB de espao disponvel no disco rgido para instalao; espao livre adicional necessrio durante a instalao (no pode ser instalado em dispositivos removveis de armazenamento flash) Tela 1.280 x 800 com placa de vdeo de 16 bits Java Runtime Environment 1.6 (includo) Unidade de DVD-ROM Software QuickTime 7.6.6 necesrio para reproduo de mdia HTML5 Este software funcionar sem ativao. Conexo de internet banda larga e registro so necessrios para a ativao do software, a validao de assinaturas e o acesso aos servios on-line. A ativao por telefone no est disponvel.
Macintosh
Processador Multicore Intel Mac OS X v.10.6 ou v10.7 512 MB de RAM 1.8 GB de espao disponvel no disco rgido para instalao; espao livre adicional necessrio durante a instalao (no pode ser instalado em um volume que utiliza sistema de arquivo com distino entre maisculas e minsculas ou em dispositivos removveis de armazenamento flash) Tela 1.280 x 800 com placa de vdeo de 16 bits Java Runtime Environment 1.6 (includo) Unidade de DVD-ROM Software QuickTime 7.6.6 necesrio para reproduo de mdia HTML5 Este software funcionar sem ativao. Conexo de internet banda larga e registro so necessrios para a ativao do software, a validao de assinaturas e o acesso aos servios on-line. A ativao por telefone no est disponvel.
16
Adobe Flash Professional CS6
Instale o Flash em todas as estaes de trabalho. Os requisitos do sistema so indicados abaixo e os procedimentos de instalao esto includos no software. Para atualizaes dos requisitos do sistema, visite: www.adobe.com/go/flash_systemreqs
Windows
Processador Intel Pentium 4 ou AMD Athlon 64 Microsoft Windows XP com Service Pack 3 ou Windows 7 2 GB de RAM (3 GB recomendado) 3.5 GB de espao disponvel no disco rgido para instalao; espao livre adicional necessrio durante a instalao (no pode ser instalado em dispositivos removveis de armazenamento flash) Tela 1.024 x 768 (1.280 x 800 recomendado) Java Runtime Environment 1.6 (includo) Unidade de DVD-ROM Software QuickTime 7.6.6 necessrio para recursos multimdia Alguns recursos no Adobe Bridge contam com placa de vdeo compatvel com Direct X 9 com pelo menos 64 MB de VRAM Este software funcionar sem ativao. Conexo de internet banda larga e registro so necessrios para a ativao do software, a validao de assinaturas e o acesso aos servios on-line. A ativao por telefone no est disponvel.
Macintosh
Processador Multicore Intel Mac OS X v.10.6 ou v10.7 2 GB de RAM (3 GB recomendado) 4 GB de espao disponvel no disco rgido para instalao; espao livre adicional necessrio durante a instalao (no pode ser instalado em um volume que utiliza sistema de arquivo com distino entre maisculas e minsculas ou em dispositivos removveis de armazenamento flash) Tela 1.024 x 768 (1.280 x 800 recomendado) Java Runtime Environment 1.6 (includo) Unidade de DVD-ROM Software QuickTime 7.6.6 necessrio para recursos multimdia Este software funcionar sem ativao. Conexo de internet banda larga e registro so necessrios para a ativao do software, a validao de assinaturas e o acesso aos servios on-line. A ativao por telefone no est disponvel.
Adobe Flash Player 11 Windows
Processador de 2.33 GHz ou mais rpido compatvel com x86, ou processador Intel Atom 1.6 GHz ou mais rpido para netbooks. Microsoft Windows XP (32-bit), Windows Server 2003 (32-bit), Windows Server 2008 (32-bit), Windows Vista (32-bit), Windows 7 (32-bit and 64-bit) Internet Explorer 7.0 e superior, Mozilla Firefox 4.0 e superior, Google Chrome, Safari 5.0 e superior, Opera 11 128 MB de RAM (1 GB de RAM recomendado para netbooks); 128 MB de memria grfica Processador Intel Core Duo 1.33 GHz ou mais rpido
Macintosh
17
Mac OS X v.10.6 ou v10.7 Safari 5.0 e superior, Mozilla Firefox 4.0 e superior, Google Chrome, Opera 11 256 MB de RAM; 128 MB de memria grfica
Linux
Processador de 2.33 GHz ou mais rpido compatvel com x86, ou processador Intel Atom 1.6 GHz ou mais rpido para netbooks. Red Hat Enterprise Linux (RHEL) 5.6 ou superior (32-bit e 64-bit), openSUSE 11.3 ou superior (32-bit e 64-bit), Ubuntu 10.04 ou superior (32-bit e 64-bit) Mozilla Firefox 4.0 ou Google Chrome 512 MB de RAM; 128 MB de memria grfica
18
Melhoramento da sala de aula

Muitas tcnicas podem ajudar a melhorar a experincia dos alunos medida que eles se envolvem nesses projetos e tambm ajudar o instrutor a gerenciar o contedo e a tecnologia. Quando voc configura seu laboratrio de informtica ou sala de aula para trabalhar em projetos com base em tecnologia, as sugestes abaixo podem ajudar a criar uma experincia de aprendizagem bem-sucedida para os seus alunos do Design digital.
Polticas de uso aceitveis
Para promover boa cidadania digital e ajudar os alunos a se sentirem donos da tecnologia e das ferramentas que eles utilizam, discuta polticas de uso aceitveis com os alunos. Talvez sua instituio j tenha uma poltica, mas discuta com os alunos o uso apropriado da internet e das ferramentas de tecnologia e faa-os aplicar sua compreenso em vrios cenrios de uso incorreto para determinar as consequncias. Trabalhe com os alunos na criao de uma poltica de classe para proteger os direitos e privilgios de outros alunos e do hardware/software da classe. Proponha regras para uma boa dinmica de equipe e crticas por colegas.
Gerenciamento de arquivos
Para poupar tempo na avaliao do trabalho do aluno, certifique-se de que os materiais da sala de aula e o trabalho do aluno sejam salvos e publicados corretamente (de preferncia em um servidor da escola). As diretrizes a seguir sero teis: Pastas do aluno: todos os alunos devem ter uma pasta para todos os seus trabalhos. Os nomes das pastas podem incluir o sobrenome do aluno, a primeira inicial e o perodo da aula (por exemplo, per7_m_smith). Backups: os alunos podem querer manter flash drives, cpias locais ou cpias do servidor de backup da escola nas suas pastas. Trabalhar em casa: os alunos podem trabalhar em casa, mas certifique-se de que eles encontrem uma maneira para transferir seus trabalhos para os computadores da escola (como FTP, e-mail, flash drive ou servidor da escola). Entrega do trabalho: se os alunos trabalharem em casa por e-mail, verifique se voc tem proteo eficiente contra vrus de arquivos e que todo o trabalho est bem classificado para facilitar a identificao e a organizao (por exemplo, per7_logo_m_smith). Questes legais: se voc planeja publicar o trabalho do aluno na web, verifique as regras da escola sobre a colocao de imagens ou nomes dos alunos na web. Talvez seja adequado para os alunos no inclurem seus nomes completos ou endereos de e-mail.
Ambiente de sala de aula
Usar a tecnologia como parte de qualquer lio na sala de aula pode levar a questes de gerenciamento no relacionadas ao contedo que est sendo coberto. Abaixo so listadas algumas dicas e tcnicas que podem ajud-lo a gerenciar a tecnologia e, ao mesmo tempo, reforar os principais conceitos.
19
Criao de bons cartazes: como o curso se concentra nas tcnicas recomendadas de design, talvez voc queira imprimir e folhear exemplos de sites bem desenvolvidos criados e apresent-los classe. Uma variao pode ser publicar exemplos de design bom e ruim nos lados opostos da sala de aula. Os exemplos de design bom e ruim devem incluir sites em HTML e Adobe Flash. Voc tambm pode fazer com que os alunos compilem uma lista de bons critrios de design durante todo o curso e a exibam em aula. Central de ajuda: crie uma biblioteca de materiais impressos do software e tcnicas de design em um canto da sala, onde os alunos possam procurar respostas s questes mais desafiadoras. Lista de questes em andamento: faa uma lista de perguntas tcnicas em uma grande folha de papel ou lousa na sala de aula para os alunos pesquisarem. medida que as perguntas so respondidas, escreva as respostas embaixo delas. Lderes estudantis: designar os alunos lderes com habilidades tcnicas para serem o primeiro contato para perguntas e questes de software ou hardware para que os alunos no interrompam o tempo de aula com questes de tecnologia. Voc pode estabelecer um rodzio dessa funo entre diferentes grupos de alunos, capacitando-os a terem mais iniciativa em sua aprendizagem. Processo de questionamento: voc pode ser interpelado quando os alunos tiverem tempo livre para trabalhar nos projetos. Para aliviar isso, solicite aos alunos que tentem primeiro encontrar a resposta sozinhos para s depois contar com o professor e que continuem trabalhando sem esperar por uma resposta. Por exemplo, voc pode pedir aos alunos para procurarem primeiro no sistema de ajuda e perguntar aos colegas antes de perguntar ao professor. Voc tambm pode fornecer acessrios para os alunos colocarem nos monitores como um sinal silencioso de que eles precisam de ajuda. Extenso da tecnologia: medida que os alunos trabalham nos seus projetos, alguns vo se deparar com tcnicas que ainda no foram demonstradas em aula. Quando os grupos de alunos aprenderem uma nova tcnica sozinhos, pea para que eles a apresentem para a classe. O grupo deve mostrar o produto resultante, compartilhar detalhes sobre como eles conseguiram e fazer a classe concluir as mesmas etapas, enquanto os membros do grupo andam pela sala para ajudar os outros a aprenderem a tcnica. Comentrio construtivo: trabalhar em equipe exige que os alunos se tornem comunicadores melhores. Durante o processo de design da web, s vezes os alunos precisam criticar os trabalhos uns dos outros. Fornecer feedback exige que os alunos se sensibilizem com os sentimentos dos outros. Para ajudar os alunos a serem comunicadores melhores, voc pode reservar um tempo para discusses com a classe para identificar comentrios e palavras construtivas. Esta lista gerada pela classe pode ser exibida como um lembrete para todos quando forem fazer a crtica do trabalho de um colega.
Uso e produo de contedo tico
Em muitos projetos, os alunos podero obter, manipular e criar imagens e sites. Destaque a responsabilidade social que os alunos tm uns com os outros e com o pblico-alvo, a fim de ajud-los a criar prticas recomendadas, pois eles podem utilizar essas habilidades em programas e trabalhos futuros. Algumas reas de interesse incluem: Validade do contedo: medida que os alunos fazem pesquisa on-line de contedo, eles precisam considerar e avaliar continuamente as diferenas de contedo, atualidade e corroborar a fonte. Voc pode tratar de algumas tcnicas de pesquisa, como aquelas fornecidas pelo November Learning: http://novemberlearning.com/resources/information-literacy-resources/. Direitos autorais: destaque a necessidade de obter permisso para usar elementos grficos, imagens, vdeo e udio produzidos por terceiros e registrar os direitos autorais do seu prprio trabalho original.
Recursos limitados (cmeras digitais, cmeras de vdeo, etc):
Considere trabalhar com os alunos em grupos em vez de individualmente. Considere a conexo de todos os computadores em uma rede local para incentivar o aprendizado cooperativo.
20
Voc pode dividir os computadores em estaes de aprendizagem, talvez agrupados por reas de interesse ou atividades (centro de mdia digital, centro de pesquisa da web, etc.). Voc pode considerar a diviso das atividades associadas ao projeto. Faa com que alguns alunos utilizem o equipamento para obteno de dados enquanto outros usam o tempo para pesquisar o tpico em questo, planejando o tempo no equipamento para que eles possam capturar ou criar um aspecto do projeto. Faa rodzio dos grupos para ter certeza de que todos os alunos estejam ocupados o tempo todo.
Competncias profissionais
Este curso tem como finalidade apresentar experincias profissionais aos alunos. Voc pode reforar, de algumas maneiras, as ideias em relao ao comportamento profissional e ao trabalho. Habilidades bsicas: ao se comunicar com os clientes, os alunos precisam de habilidades bsicas para ajud-los na entrevista e na reviso dos seus trabalhos com os clientes. Os alunos podem praticar entrevistando uns aos outros ou realizando entrevistas prticas com voc, medida que desenvolvem habilidades para falar com os clientes.
Acompanhamento de projetos: reforce a necessidade de planejar cronogramas adequados e gerenciar o tempo. Os alunos podem fazer relatrios dirios resumidos sobre como esto cumprindo os prazos de acordo com a tarefa. Oriente os alunos em relao nova priorizao e atualizao dos seus planos de projetos, quando necessrio. Trabalho em equipe: ajudar os alunos a se desenvolverem individualmente e como membros de uma equipe produtiva uma tarefa desafiadora. Reforce a importncia dos dois tipos de desenvolvimento, avaliando tanto o desempenho individual quanto as formas como cada um contribui para os objetivos da equipe, trabalha para solucionar quaisquer conflitos da equipe e colabora com as outras equipes para adotar prticas bem-sucedidas. Ambiente profissional: preparando os alunos para trabalhar com clientes e ajud-los a desenvolver atitudes profissionais, voc pode fornecer pontos semanais para exibio de atitudes e habilidades profissionais, como segue: Ser pontual Vestir-se bem ao entrevistar colegas e clientes Responder prontamente aos colegas e clientes Ouvir sugestes e trabalhar bem em grupos
Designers profissionais: os alunos podem se beneficiar bastante ao falar com desenvolvedores ou web designers profissionais. Voc pode organizar uma excurso a um estdio de design ou pedir a um designer para participar de uma das suas aulas. Principais tpicos para tratar com o designer: Trabalho em equipe e colaborao Design eficaz Amostras do trabalho do designer e os desafios que elas representaram Uso de software profissional, como produtos da Adobe, na web e nos campos de mdia avanada Crtica do trabalho do aluno
Ensino interdisciplinar
Em certos projetos, voc pode adotar o ensino com uma equipe de professores de outros departamentos, a fim de ajudar os professores da rea de contedo tradicional a integrar a tecnologia aos seus cursos, ao mesmo tempo auxiliando os alunos a se desenvolverem em reas acadmicas como redao, leitura, matemtica e cincias. Outra opo fazer os alunos participarem da aula de outro professor para
21
mudarem de ambiente, ou leve o outro professor para a sua aula. Isso especialmente til com os seguintes tpicos: Design grfico: um professor de arte pode tratar de tpicos como linha, regra dos teros e tipografia. Design de pgina da web: um professor de arte pode tratar de tpicos como composio, cor e formato. Produo e design de pgina da web: um professor de negcios ou carreira pode discutir qualificaes, salrio e habilidades necessrias para trabalhar no campo de design da web. Um professor de marketing pode melhorar a discusso com relao ao pblico-alvo e finalidade. Contedo da pgina da web: um professor de literatura pode enfatizar a redao para diferentes pblicosalvo medida que os alunos se envolvem em projetos da web que incluam diferentes clientes.
22
Apresentao da viso geral das competncias

Esta apresentao das competncias gerais uma ferramenta para avaliar os diversos aspectos dos principais projetos de web e mdia avanada. Embora cada atividade tenha sua prpria apresentao, voc pode usar o seguinte mtodo para ajudar a avaliar aspectos particulares dos demais projetos. Selecione os itens que se aplicam a um projeto especfico.
Habilidades de design
Categoria No atende s expectativas Atende s expectativas Supera as expectativas
Composio
No h uso de espao em branco, simetria e ponto focal. As pginas do site (e os elementos dentro das pginas) so cortadas de maneira inadequada nas suas bordas ou esto rodeadas por espaos em branco excessivos. As cores no combinam e pouco contribuem ao tema do design. A cor do plano de fundo interfere com o texto e as imagens. As cores deixam o texto menos legvel. O texto no lido facilmente. O espao em branco no usado de forma eficaz. As fontes e os efeitos de texto interferem com o design e a legibilidade.
H algum uso de espao em branco, simetria e ponto focal. As pginas do site (e os elementos dentro das pginas) normalmente se encaixam de maneira adequada dentro das bordas. As cores so um tanto complementares. A cor do plano de fundo tem harmonia com o design de imagens e texto. As cores no interferem com a legibilidade. O texto legvel. Os tamanhos dos tipos comunicam informaes e so compatveis com o design geral do site. O espao em branco ao redor do texto ajuda na legibilidade e no design. As fontes e os efeitos so compatveis com o design e a legibilidade. Todas as pginas do site proporcionam navegao consistente, e todos os links funcionam corretamente. A navegao permite aos usurios o acesso s principais pginas no site, e o uso intuitivo. Algumas pginas do site demoram muito para carregar, mas vale a pena esperar pela maioria dos atrasos.
Espao em branco, simetria e ponto focal so usados de maneira eficaz. As pginas do site (e os elementos dentro das pginas) encaixam dentro das bordas de forma agradvel.
Cores
As cores trabalham em conjunto, reforando o tema do design. A cor do plano de fundo melhora o design de imagens e do texto. As cores ajudam na leitura.
Tipografia
O texto legvel e as fontes selecionadas apoiam os objetivos do design. Os tamanhos dos tipos refletem a nfase desejada. O espao em branco ao redor do texto ajuda muito na legibilidade e no design. As fontes e os efeitos de texto adicionam humor e tom. As fontes melhoram a legibilidade por meio de cor, tamanho e contraste. Todas as pginas do site proporcionam navegao consistente, e todos os links funcionam corretamente. A navegao permite aos usurios o acesso a todas as principais pginas no site e o uso intuitivo. As pginas do site carregam em tempo razovel e vale a pena aguardar pelos atrasos.
Usabilidade
A navegao do site aparece em algumas pginas, e nem todos os links funcionam corretamente. A navegao no permite aos usurios o acesso a todas as pginas principais no site e no tem uso intuitivo. Algumas pginas do site demoram um tempo considervel para carregar, e os atrasos so causados por elementos irrelevantes.
23
Categoria
No atende s expectativas
Atende s expectativas
Supera as expectativas
Uso de elementos tcnicos (Dreamweaver, Fireworks, Photoshop, Illustrator ou Flash)
O uso de elementos tcnicos e efeitos no melhora a experincia do usurio nem apoia de maneira consistente os objetivos gerais e a mensagem do site.
O uso de elementos tcnicos e efeitos apoia de maneira consistente os objetivos gerais e a mensagem do site, mas no melhora a experincia do usurio. O uso desses elementos ou efeitos no excessivo ou causa distrao. O storyboard completo, mas um pouco difcil de interpretar.
O uso de elementos tcnicos e efeitos contribui para o design geral do site, melhorando a experincia do usurio e apoiando as metas e mensagens do site. O uso desses elementos ou efeitos no excessivo ou causa distrao.
Storyboard
O storyboard fornece informaes de produo incompletas ou contraditrias.
O storyboard est inteiro, completo e muito claro.
Habilidades tcnicas
Acessibilidade
Raros elementos grficos do site, como imagens e botes, tm identificaes de texto alternativas. As ilustraes e os botes esto mal desenhados e nem sempre utilizam ferramentas de efeitos e desenho apropriadas. A cor no aplicada de maneira consistente, e os painis normalmente no so configurados para web. A qualidade das imagens no suficiente ou o tamanho do arquivo muito grande. Com frequncia o aluno pergunta qual ferramenta usar para criar elementos e efeitos desejados. No usa de maneira independente as informaes disponveis sobre as ferramentas. No usa as ferramentas de maneira eficiente.
Alguns elementos grficos do site, como imagens e botes, tm identificaes de texto alternativas. As ilustraes e os botes esto desenhados de maneira suficiente, usando uma variedade de ferramentas de desenho e efeitos. A cor aplicada de maneira consistente na maioria do tempo, e os painis normalmente so configurados para web. As imagens possuem equilbrio satisfatrio de qualidade e tamanho de arquivo. Normalmente, o aluno sabe quais ferramentas usar para criar os elementos e efeitos desejados, mas s vezes precisa ser lembrado para usar as informaes disponveis sobre as ferramentas. Usa a maioria das ferramentas de maneira eficiente.
Todos os elementos grficos do texto, como imagens e botes, tm identificaes de texto alternativas.
Desenho
As ilustraes e os botes so limpos e claramente desenhados, utilizando de maneira eficiente uma grande variedade de ferramentas de desenho e efeitos. A cor aplicada de maneira consistente, e os painis so configurados para web.
Painis das cores
Otimizao
As imagens possuem excelentes equilbrio de qualidade e tamanho de arquivo. O aluno sabe quais ferramentas usar para criar os elementos e efeitos desejados de maneira eficaz e consegue encontr-las de maneira independente. Usa as ferramentas de maneira eficiente.
Uso de ferramentas
24
Habilidades de pesquisa e comunicao

Processo de design
O processo de design no inclui todos os elementos apropriados, como esboos, mapa do site, storyboard e comentrios de reviso. O produto final no reflete completamente o storyboard e o feedback.
O processo de design inclui todos os elementos apropriados, como esboos, mapa do site, storyboard e comentrios de reviso. O produto final reflete o storyboard, com algumas revises embasadas no feedback.
O processo de design inclui todos os elementos apropriados, como esboos, mapa do site, storyboard e comentrios de reviso. O produto final reflete precisamente o storyboard, incluindo revises do storyboard com base no feedback e em pertinentes decises de design feitas durante a produo. Revises dos designs de outros alunos fornecem uma anlise minuciosa e criteriosa do contedo e do design. O feedback usa vocabulrio claro e informativo e vincula os comentrios ao design e ao contedo. O feedback sempre construtivo. As apresentaes do design estabelecem, de maneira clara e completa, metas, conceitos de design e requisitos de um projeto. O aluno colabora livremente com os outros alunos para fornecer feedback ou assistncia. Cumpre com as funes atribudas equipe e contribui igualmente para o projeto. Consulta os outros membros da equipe sobre decises importantes do projeto e ajuda voluntariamente os outros a adquirir habilidades para concluir o projeto.
Feedback
As revises dos designs de outros alunos no tratam corretamente de contedo e design. O feedback no usa vocabulrio informativo e muitas vezes no construtivo.
As revises dos designs de outros alunos fornecem alguma anlise do contedo e do design. O feedback usa algum vocabulrio informativo e vincula os comentrios ao design e ao contedo. O feedback nem sempre construtivo. As apresentaes do design abrangem metas, conceitos de design e requisitos de um projeto.
Apresentao
As apresentaes do design fornecem pouca informao sobre metas, conceitos de design e requisitos de um projeto. O aluno no colabora com os outros alunos para fornecer feedback ou assistncia. Cumpre com as funes atribudas equipe, mas no contribui igualmente para o projeto. No consulta os outros membros da equipe antes de tomar decises importantes sobre o projeto. No ajuda aos outros a adquirir habilidades.
Colaborao em equipe
O aluno colabora com os outros alunos conforme necessrio para fornecer feedback ou assistncia. Cumpre com as funes atribudas equipe e contribui igualmente para o projeto. s vezes consulta os outros membros da equipe sobre decises importantes do projeto, mas faz poucos esforos para ajudar os outros a adquirir habilidades.
25
Habilidades de gerenciamento de projetos

Design progressivo
O aluno no usa o documento de design nem o feedback dos colegas.
O aluno usa documentos de design para orientar o processo de design. Usa inconsistentemente o comentrio dos colegas para orientar o processo de novo design.
O aluno usa consistentemente documentos de design para orientar o processo de design e desenvolvimento. Usa cuidadosamente os comentrios dos colegas para orientar o processo de novo design. Os arquivos e pastas do aluno so nomeados de forma consistente e lgica nos drives remotos e locais. A organizao de arquivos criada no incio de um projeto.
Gerenciamento de arquivos
Os arquivos e pastas do aluno so nomeados de forma inconsistente e no se organizam logicamente. A organizao do arquivo no vista como tarefa importante. O aluno no responde ao feedback ou faz novo design sem decidir se o feedback melhora o contedo e o design do projeto.
A maioria dos arquivos e pastas do aluno nomeada e organizada logicamente nos drives locais e remotos. A organizao do arquivo evolui conforme o andamento do trabalho do projeto. O aluno responde ao feedback, decidindo se o feedback melhora o contedo e o design do projeto. Incorpora parte do feedback ao novo design.
Reviso de tarefas
O aluno responde de maneira pensada e completa ao feedback, decidindo qual feedback melhora de maneira eficaz o contedo e o design do projeto. Incorpora o feedback ao novo design de um projeto. O aluno reserva um tempo de maneira pensada e eficiente para cada fase do processo de design e desenvolvimento por meio de um plano de projeto. Conclui todas as fases no cronograma.
Gerenciamento do tempo
O aluno no reserva tempo de maneira eficaz para as fases do processo de design e desenvolvimento. Conclui poucas fases dentro do cronograma.
O aluno reserva um tempo para cada fase do processo de design e desenvolvimento por meio de um plano de projeto. Conclui a maioria das fases dentro do cronograma.
26
Normas da ISTE NETS*S para os alunos

A International Society for Technology in Education (ISTE) a fonte confivel para desenvolvimento profissional, gerao de conhecimento, defesa e liderana para inovao. Essas normas, identificadas em todo o curso Design digital, so integradas a vrias atividades nas quais os alunos se envolvem durante cada projeto. I. Criatividade e inovao Os alunos demonstram pensamento criativo, constroem conhecimento e desenvolvem produtos e processos usando tecnologia. Alunos: A. aplicam o conhecimento existente para gerar novas ideias, produtos ou processos; B. criam trabalhos originais como meio de expresso pessoal ou do grupo; C. usam modelos e simulaes para explorar sistemas e questes complexas; e D. identificam tendncias e possibilidades de previso. II. Comunicao e colaborao Os alunos usam mdia digital e ambientes para comunicao e trabalho colaborativo, incluindo a distncia, para oferecer suporte ao aprendizado individual e contribuir ao aprendizado dos outros. Alunos: A. interagem, colaboram e publicam com colegas, especialistas e outros que utilizam uma variedade de ambientes e mdias digitais; B. comunicam informaes e ideias de maneira eficaz para diversos pblicos-alvo usando uma variedade de mdias e formatos; C. desenvolvem compreenso cultural e conscincia global se envolvendo com aprendizes de outras culturas; e D. contribuem com a equipe do projeto para produzir trabalhos originais ou solucionar problemas. III. Pesquisa e fluncia de informaes Os alunos aplicam ferramentas digitais para obter, avaliar e usar informaes. Alunos: A. planejam estratgias para orientar a investigao; B. localizam, organizam, analisam, avaliam, sintetizam e utilizam de maneira tica as informaes de uma variedade de fontes e mdias; C. avaliam e selecionam fontes de informaes e ferramentas digitais com base na adequao a tarefas especficas; e D. processam os dados e informam os resultados. IV. Pensamento crtico, soluo de problemas e tomada de decises Os alunos usam habilidades de pensamento crtico para planejar e realizar pesquisas, gerenciar projetos, solucionar problemas e tomar decises ponderadas utilizando ferramentas digitais e recursos apropriados. Alunos: A. identificam e definem problemas autnticos e questes significativas para investigao;
27
B. planejam e gerenciam atividades para desenvolver uma soluo ou concluir um projeto; C. coletam e analisam dados para identificar solues e/ou tomar decises corretas; e D. usam diversos processos e perspectivas para explorar solues alternativas. V. Cidadania digital Os alunos entendem questes culturais e sociais do ser humano relacionadas a tecnologia, prtica legal e comportamento tico. Alunos: A. defendem e praticam o uso seguro, legal e responsvel das informaes e da tecnologia; B. mostram uma atitude positiva em relao ao uso de tecnologia que oferece suporte colaborao, ao aprendizado e produtividade; C. demonstram responsabilidade pessoal pelo aprendizado duradouro; e D. mostram liderana para cidadania digital. VI. Operaes e conceitos de tecnologia Os alunos demonstram compreenso dos conceitos de tecnologia, sistemas e operaes. Alunos: A. compreendem e usam sistemas tecnolgicos; B. selecionam e usam aplicativos de maneira eficiente e produtiva; C. solucionam problemas de sistemas e aplicativos; e D. transferem o conhecimento atual para aprender novas tecnologias.
28
Objetivos da Adobe Certified Associate

Nos ltimos anos, a Adobe realizou uma pesquisa para identificar as habilidades bsicas que os alunos precisam para criar comunicao eficaz usando ferramentas de mdia digital. A Adobe se reuniu com educadores e profissionais de design, com as empresas pesquisadas e com instituies de ensino em todo o mundo. A pesquisa resultou em objetivos que abrangem design, planejamento de projeto, comunicao e tecnologia. Os seguintes conjuntos de objetivos essenciais de aprendizagem fazem parte dos exames da Adobe Certified Associate em Comunicao na web e Comunicao em mdia avanada e esto totalmente integrados no Design digital.
Objetivos de comunicao na web usando o Dreamweaver CS6

Estabelecer os requisitos do projeto
1.1 Identificar a finalidade, o pblico-alvo e as necessidades do pblico-alvo do site. 1.2 Identificar o contedo da pgina da web que relevante finalidade do site e apropriado ao pblicoalvo. 1.3 Demonstrar conhecimento das regras padro de direitos autorais (termos relacionados, obteno de permisso e citao de material com direitos autorais). 1.4 Demonstrar conhecimento dos padres de acessibilidade do site que tratam das necessidades das pessoas com deficincia visual e motora. 1.5 Tomar decises de desenvolvimento da web com base na anlise e na interpretao de especificaes do design. 1.6 Compreender as tarefas e as responsabilidades do gerenciamento de projetos.
Planejar o design do site e o layout da pgina
2.1 Demonstrar conhecimento geral e especfico de Dreamweaver das prticas recomendadas para criar um site, como manter a consistncia, separar o contedo do design, usar fontes padro e utilizar hierarquia visual. 2.2 Produzir designs de site que funcionem igualmente bem em vrios sistemas operacionais, verses/configuraes de navegador e dispositivos. 2.3 Demonstrar conhecimento de conceitos e princpios de design de layout de pgina. 2.4 Identificar princpios bsicos de usabilidade, legibilidade e acessibilidade de sites. 2.5 Demonstrar conhecimento de fluxogramas, storyboards e wireframes para criar pginas da web e mapa do site (ndice do site) que mantenham a hierarquia planejada do site. 2.6 Comunicar aos outros (como colegas e clientes) os planos do design.
Compreender a interface do Adobe Dreamweaver CS6
3.1 Identificar elementos da interface do Dreamweaver. 3.2 Usar a barra de insero. 3.3 Usar o inspetor de propriedade.
29
3.4 Usar o painel Ativos. 3.5 Usar o painel Arquivos. 3.6 Personalizar a rea de trabalho.
Adicionar contedo usando o Dreamweaver CS6
4.1 Demonstrar conhecimento de HTML (Hypertext Markup Language). 4.2 Definir um site Dreamweaver. 4.3 Criar, escolher um ttulo, nomear e salvar uma pgina da web. 4.4 Adicionar texto a uma pgina da web. 4.5 Inserir imagens e aplicar texto alternativo em uma pgina da web. 4.6 Vincular contedo da web, usar hiperlinks, links de e-mail e ncoras nomeadas. 4.7 Incluir vdeo e som em uma pgina da web. 4.8 Adicionar animao e interatividade ao contedo. 4.9 Inserir barras de navegao, sobreposio de imagens e botes criados em um programa de desenho em uma pgina da web. 4.10 Criar mapas de imagem. 4.11 Importar dados tabulares para uma pgina da web. 4.12 Importar e exibir um documento do Microsoft Word ou Microsoft Excel em uma pgina da web. 4.13 Criar formulrios.
Organizar contedo usando o Dreamweaver CS6
5.1 Configurar e modificar as propriedades do documento. 5.2 Organizar o layout da pgina da web com tags diversas e estilos CSS relativos e bem posicionados. 5.3 Modificar texto e propriedades de texto. 5.4 Modificar imagens e propriedades de imagem. 5.5 Criar modelos de pgina da web. 5.6 Usar tags bsicas de HTML para configurar um documento HTML, formatar texto, adicionar links, criar tabelas e criar listas ordenadas e no ordenadas. 5.7 Adicionar contedo principal para deixar uma pgina da web visvel para os mecanismos de pesquisa. 5.8 Usar CSS para implementar um design reutilizvel.
Avaliar e manter um site utilizando o Dreamweaver CS6
6.1 Realizar testes tcnicos. 6.2 Identificar testes bsicos de usabilidade. 6.3 Identificar mtodos para coleta de feedback do site. 6.4 Gerenciar ativos, links e arquivos para um site. 6.5 Publicar e atualizar arquivo do site para um servidor remoto.
30
Comunicao de mdia avanada usando objetivos do Flash Professional CS6

Estabelecer os requisitos do projeto
1.1 Identificar a finalidade, o pblico-alvo e as necessidades do pblico-alvo para o contedo de mdia avanada. 1.2 Identificar contedo de mdia avanada que seja relevante para a finalidade de mdia na qual ele ser usado (sites, dispositivos mveis e assim por diante). 1.3 Compreender as opes para produzir mdia avanada acessvel. 1.4 Demonstrar conhecimento das regras padro de direitos autorais (termos relacionados, obteno de permisso e citao de material com direitos autorais). 1.5 Compreender as tarefas e as responsabilidades do gerenciamento de projetos. 1.6. Comunicar aos outros (como colegas e clientes) os planos de design e de contedo.
Identificar elementos de design de mdia avanada
2.1 Identificar prticas recomendadas gerais e Flash para criar contedo de mdia avanada para web, aplicativos mveis e aplicativos AIR. 2.2 Demonstrar conhecimento de elementos e princpios de design. 2.3 Identificar tcnicas Flash gerais e especficas para criar elementos de mdia avanada que sejam acessveis e legveis. 2.4 Usar um storyboard para criar elementos de mdia avanada. 2.5 Organizar um documento Flash.
Compreender a interface Adobe Flash Professional CS6
3.1 Identificar elementos da interface Flash. 3.2 Usar o inspetor de propriedade. 3.3 Usar a linha do tempo. 3.4 Ajustar as propriedades do documento. 3.5 Usar guias e rguas Flash. 3.6 Usar o Motion Editor. 3.7 Compreender os tipos de arquivo Flash. 3.8 Identificar prticas recomendadas para gerenciar o tamanho do arquivo de um documento Flash publicado.
Criar elementos de mdia avanada utilizando Flash Professional CS6
4.1 Tomar decises sobre desenvolvimento de contedo de mdia avanada com base na anlise e na interpretao das especificaes do design. 4.2 Usar ferramentas no painel Ferramentas para selecionar, criar e manipular elementos grficos e textos. 4.3 Importar e modificar elementos grficos. 4.4 Criar texto. 4.5 Ajustar as propriedades do texto.
31
4.6 Criar objetos e convert-los em smbolos, incluindo elementos grficos, clipes de filme e botes. 4.7 Compreender smbolos e a biblioteca. 4.8 Editar smbolos e instncias. 4.9 Criar mscaras. 4.10 Criar animaes (alteraes em formato, posio, tamanho, cor e transparncia). 4.11 Adicionar controles simples por meio do ActionScript 3.0. 4.12 Importar e usar som. 4.13 Adicionar e exportar vdeo. 4.14 Publicar e exportar documentos Flash. 4.15 Criar um documento Flash acessvel.
Avaliar elementos de mdia avanada utilizando Flash Professional CS6
5.1 Realizar testes tcnicos bsicos. 5.2 Identificar testes bsicos de usabilidade.
32

Design Digital

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Design Digital

Uploaded by

Copyright:

Available Formats

Design digital

Fundamentos de web design

2012 Adobe Systems Incorporated

Projeto 5: Jogo interativo

Orientaes para o instrutor do projeto Apresentaes Guias do aluno

Orientaes para o instrutor do projeto Apresentaes Guias do aluno

Projeto 2: Web design e planejamento

Projeto 6: Narrativa digital

Orientaes para o instrutor do projeto Apresentaes Guias do aluno

Orientaes para o instrutor do projeto Apresentaes Guias do aluno

Projeto 3: Desenvolvimento e implantao na web

Projeto 7: Aplicativo mvel

Orientaes para o instrutor do projeto Apresentaes Guias do aluno

Orientaes para o instrutor do projeto Apresentaes Guias do aluno

Projeto 8: Portflio final da web Projeto 4: Portflio da web

Orientaes para o instrutor do projeto Apresentaes Guias do aluno

Orientaes para o instrutor dos projetos Guias do aluno

2012 Adobe Systems Incorporated

Viso geral do curso e preparao

2012 Adobe Systems Incorporated

Viso geral do curso e preparao

Projetos do primeiro semestre

Projetos do segundo semestre

Viso geral do curso e preparao

2012 Adobe Systems Incorporated

Mtodos alternativos para a utilizao do Design digital

2012 Adobe Systems Incorporated

Viso geral do curso e preparao

Matrizes de competncias do Design digital

Viso geral do curso e preparao

2012 Adobe Systems Incorporated

2012 Adobe Systems Incorporated

Viso geral do curso e preparao

Viso geral do curso e preparao

2012 Adobe Systems Incorporated

2012 Adobe Systems Incorporated

Viso geral do curso e preparao

Viso geral do curso e preparao

2012 Adobe Systems Incorporated

2012 Adobe Systems Incorporated

Viso geral do curso e preparao

Viso geral do curso e preparao

2012 Adobe Systems Incorporated

2012 Adobe Systems Incorporated

Viso geral do curso e preparao

Preparao do computador em sala de aula

Adobe Photoshop CS6

Viso geral do curso e preparao

2012 Adobe Systems Incorporated

2012 Adobe Systems Incorporated

Viso geral do curso e preparao

Viso geral do curso e preparao

2012 Adobe Systems Incorporated

Adobe Flash Professional CS6

Adobe Flash Player 11 Windows

2012 Adobe Systems Incorporated

Viso geral do curso e preparao

Viso geral do curso e preparao

2012 Adobe Systems Incorporated

Melhoramento da sala de aula

2012 Adobe Systems Incorporated

Viso geral do curso e preparao

Viso geral do curso e preparao

2012 Adobe Systems Incorporated