FTIN - Módulo de WebDesign Prof. Ítalo Araújo

FTIN – FORMAÇÃO TÉCNICA EM INFORMÁTICA PHOTOSHOP CS5

Adobe Photoshop CS5 A ferramenta de edição de imagens mais poderosa e utilizada no mundo. Versão CS5: Novos recursos ainda mais inovadores. O que podemos fazer com esta ferramenta?

Conceito de Imagem Digital As imagens bitmap Definição: A imagem é dividida nos pontos de uma matriz. Cada ponto é gravado com seu valor particular de luminosidade e cor, formando um mapa (map) dos pontos (bit). Mesmo as áreas sem desenho (fundo) fazem parte do arquivo.

Conceito de Imagem Digital As imagens bitmap Características: Imagem formada por um conjunto de pontos denominados “Pixel” Arquivos de tamanhos muito grande O tamanho da imagem, quando alterada, pode sofrer perda de qualidade.

Conceito de Imagem Digital As imagens vetoriais Definição: A palavra "vetor" refere-se a uma linha, mas a representação vetorial descreve um desenho com uma série de linhas e formas. Possui algumas regiões preenchidas com cor sólida ou sombreada.

Conceito de Imagem Digital As imagens vetoriais Características: São entidades geométricas, representada por um círculo, rectângulo ou um segmento. São representadas por fórmulas matemáticas Podem ser aumentadas sem perdas de resolução. Tamanho de arquivos muito menores

Conceito de Imagem Digital Imagem Bitmap x Imagem Vetorial

Conceito de Imagem Digital Resolução Nível de detalhe que uma imagem comporta Resoluções mais altas significam mais detalhes na imagem. A resolução de imagem pode ser medida de várias formas. Medidas: mm, polegadas, pixel, etc...

Conceito de Imagem Digital Resolução Para cada sistema de impressão, existe uma resolução ideal.Resoluções acima dela resultarão em arquivos maiores sem ganhos de qualidade, menores, resultarão em perda de definição de detalhes e pixelização. Resolução ideal para monitores: 72 dpi Resolução ideal para impressão em alta qualidade: 300 dpi

Cores O que é cor? A cor é uma percepção visual provocada pela ação de um feixe de fotons sobre células especializadas da retina, que transmitem através de informação pré-processada no nervo óptico, impressões para o sistema nervoso. Cor: Fenômeno Ótico. Universidade Federal do Pará (26 de julho de 2009).

Psicologia das Cores Cinza: elegância, humildade, respeito, reverência, sutileza; Vermelho: paixão, força, energia, amor, liderança, masculinidade, alegria (China), perigo, fogo, raiva, revolução, "pare"; Azul: harmonia, confidência, conservadorismo, austeridade, monotonia, dependência, tecnologia, liberdade, saúde; Ciano: tranquilidade, paz, sossego, limpeza, frescor; Verde: natureza, primavera, fertilidade, juventude, desenvolvimento, riqueza, dinheiro, boa sorte, ciúmes, ganância, esperança

Psicologia das Cores Roxo: velocidade, concentração, otimismo, alegria, felicidade, idealismo, riqueza (ouro), fraqueza, dinheiro; Magenta: luxúria, sofisticação, sensualidade, feminilidade, desejo; Violeta: espiritualidade, criatividade, realeza, sabedoria, resplandecência, dor; Laranja: energia, criatividade, equilíbrio, entusiasmo, ludismo; Branco: pureza, inocência, reverência, paz, simplicidade, esterilidade, rendição, união; Preto: poder, modernidade, sofisticação, formalidade, morte, medo, anonimato, raiva, mistério, azar;

Modos de Cores Necessidade das Indústrias Gráficas de produzirem padrões. Matiz da Cor Descreve as cores numericamente Photoshop têm como base os modelos de cores que são úteis para imagens utilizadas na editoração

Modos de Cores RGB (vermelho, verde e azul) CMYK (ciano, magenta, amarelo e preto) LAB (com base no CIE L*a*b*) (Luminosidade) BITMAP TONS DE CINZA DUOTÔNICO CORES INDEXADAS MULTICANAL

Modos de Cores Exemplos de Cores em RGB Branco - RGB(255,255,255) Azul - RGB(0,0,255) Vermelho - RGB(255,0,0) Verde - RGB(0,255,0) Amarelo - RGB(255,255,0) Magenta - RGB(255,0,255) Ciano - RGB(0,255,255) Preto - RGB(0,0,0)

Iniciando o Photoshop Criando um novo Documento

Iniciando o Photoshop

Iniciando o Photoshop A interface do photoshop é composta por: Barra do Aplicativo Opções Ferramentas Painéis

Ferramentas de Seleção Utilizada para selecionar uma área específica da imagem.

Ferramentas de Seleção (Lasso) Utilizada para selecionar uma área específica da imagem com mais precisão.

Ferramentas de Seleção (Rápida) Utilizada para selecionar uma área comum da imagem que possua o mesmo tom de cor.

Ferramentas de Preenchimento e Cores Pode-se aplicar preenchimentos sólidos e Gradientes numa imagem ou em um desenho.

Ferramentas de Desenho Pode-se criar Quadrados, Quadrados com Cantos arredondados, Círculos, Poligonos, Linhas e Simbolos pré-definidos.

ATIVIDADE Quais as diferenças entre imagem bitmap e imagem vetorial? Dê exemplos. O que é Resolução? Qual a Resolução indicada para se trabalhar com Web? Defina, com suas palavras, o que é Cor? Para que servem os Modos de Cores? Como é composta a interface do Photoshop CS5? Para que serve cada componente?

Atividade Prazo para postagem: 30/06/12 até às 23:55h EVITE DEIXAR A POSTAGEM DE SUA ATIVIDADE PARA O ÚLTIMO DIA. FAZENDO ISSO, IMPREVISTOS NÃO VÃO LHE PREJUDICAR. * LEMBRANDO QUE SUA ORGANIZAÇÃO TAMBÉM ESTA SENDO AVALIADA

Ferramentas de apoio Apostilas e vídeos do AVASIS; Fórum durante o módulo, com resposta em até 6 horas úteis; E-mail do professor:

DÚVIDAS... Acesse o Fórum de dúvidas e discussões Diariamente Chat na Terça-Feira: dia 26/06/12 no horário: das 19:00 às 20:30 h

Por hoje é só! Na próxima aula: Siga-me: Ferramentas de Desenho a mão Trabalhando com Layers. Siga-me: Facebook.com/italoj.araujo Twitter.com/italoj