[Teoria] Do Básico ao Avançado

por **BR.** Sex Nov 18, 2011 2:18 pm

Bom Galera, To Fazendo Esse Tuto Pra Ajudar Muitas Pessoas Que
Estão Começando Hoje Em Design. Isso Não Foi Diferente de Mim, No Dia em
Que Comecei.

1º - Obter o Photoshop

O Photoshop é o Programa de Edição de Imagens Mais Utilizados,

Por Isso Recomendo Baixá-lo Para Mecher.

Existem Várias Versões do Photoshop, As Mais Utilizadas São o Cs2 e o Cs3, Porém eu Utilizo o Cs4

[Teoria] Do Básico ao Avançado Urlgg8hf9j

[Teoria] Do Básico ao Avançado Urlgg8hf9j

[Teoria] Do Básico ao Avançado Photoshopcs3extended300

[Teoria] Do Básico ao Avançado Dibujoup6wo4

Outras Coisa Pra Dar Um Efeito Legal é o Topaz Vivacity, um plugin bem legal.

2º - O Básico

O Photoshop Possui Muitas Ferramentas, Que São Muito Úteis.

A Seguir Farei Uma Descrição De Todas Elas.

[Teoria] Do Básico ao Avançado 2i6mf0z

Marquee Tool(M) - Para
Poder Selecionar Partes, Ou Selecionar Uma Determinada Parte Para
Aplicar o Efeito. Exitem Quatro "Jeitos” de Seleção: Rectangular,
Elliptical, Single Row e Single Column.

Move Tool(V) - Ferramenta Usada ParaMover Coisas

Lasso Tool(L) - Normalmente Usada Para Recortes, Mas é Mais Complicada =X

Magic Wand Tool(W) -Você
Pode Usá-la para Selecionar areas do seu Layout Por Valores, Cores ou
Tons, Dependendo da “Tolerance”. Também Pode Recortar Imagens.

Crop Tool© - Para Recortar Também. Basta Selecionar Uma Área, E Tudo Que Estiver Fora Dela Será Cortada.

Slice Tool(K) - Ferramenta Muito Útil para Webmasters; Você Pode Fatiar o Seu Documento[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
em Partes Que na Hora de Ser Exportado Vai Ser Automaticamente
Recortado em Partes Determinadas, Otimiza Seu Trabalho. Recortando o Seu
Layout em Partes, Você Faz com Que Sua Página Indiretamente Carregue
Mais Rápido. Você Poderá Definir Opções Para Cada “Fatia” Como Nome e
URL.

Heal Brush Tool(J) e Path Tool(J) - Usada Para "Concertar" Imagens Danificadas.

Pencil e Brush Tool(B) - Uma
Coisa Bastante Usada. É Como se Fosse o Lápis e o Pincel do Famoso
"Paint". Você Pode Definir Cor, Grossura, Etc. Existem Alguns Brushes
Prontos Com Uns EFeitos Legais.

Clone Stamp Tool(S) - Serve Para Copiar Uma Parte da Imagem e Colá-la Na Mesma Layer. Geralmente é Usada Para Remover Espinhas e Cravos de Imagens

History Brush Tool(Y) - Serve Para Tornar a Imagem Transparente.

Eraser Tool(E) - Usado Para Apagar Coisas Indesejadas.

Paint Bucket Tool(E) e Gradient Tool(E) - O
Paint Bucket Tool é Para Pintar Pequenas Partes da Imagem, Como o Balde
do Paint. O Gradient Tool Pode Ter 2 Cores Ou Mais e Geralmente é Usado
no Trabalho Inteiro.

Blur Tool® Sharpen Tool® e Smudge Tool® - A
Smudge Tool Também é Muito Usada. Serve Para Borrar Determinada Região,
e Dependendo do Strenght Tem Diferentes Resultados. A Sharpen Tool
Serve Para Dar Mais Nitidez a Imagem, Mas Não Exagere. A Blur Tool,
Diferente da Sharpen, Torna a Imagem Embaçada.

Dodge Tool(O) Burn Tool(O) e Sponge Tool(O) - A
Burn Tool Serve Para Escurecer Determinados Pontos, Bastante Usado Para
Fazer Iluminação nas Signs. A Dodge Tool, Ao Contrário da Burn Tool,
Serve Para Clarear Uma Imagem. Já a Sponge Tool Tira a Saturação de
Certa Parte, Ou Seja, A Torna P&B.

Path Selection Tool(A) Direct Selection Tool(A) - O
“Path selection tool” serve para selecionar um ponto apenas do shape
que fizemos com a “Pen tool”, assim poderemos editar a forma; o “Direct
selection tool” serve para selecionar todos os pontos do seu “shape”, ou
seja, você o move inteiramente.

Horizontal/Vertical Type Tool(T) e Horizontal/Vertical Mask Type Tool(T) - A
Horizontal Type Tool é a Ferramenta Usada Para Fazer a Tipografia do
Jeito Convencional, Ou Seja, Deitada. Já a Vertical Type Tool Tem a
Mesma Função, Porém a Tipografia Fica Vertical. O “Horizontal Mask Type
Tool” tem a mesma função do Horizontal type tool mas ele apenas deixa
selecionado o texto, não o preenche, fica como uma “máscara”; o
“Vertical Mask Type Tool” da mesma forma que o Vertical Type Tool se
dispõe de cima para baixo, mas também fica apenas selecionado, não é
preenchido.

Pen Tool(P) e Freeform Pen Tool(P) - Com
a “Pen Tool” você pode traçar riscos, que podem ser usados junto com o
shape tools. o “FreeForm Pen Tool” é usado bastante para fazer formas
arrojadas em layouts para websites, ou formas que não podem ser feitas
com outras ferramentas como o Marquee tool, lasso tool... O “Add Anchor
Point Tool” serve para adicionar um ponto a mais no seu shape feito pelo
freeform pen tool, para obter um efeito, curva esperado; o “Delete
Anchor Point Tool” deleta o ponto que você desejar, caso ele seja
necessário, serve para retas, caso você queira uma parte não curva,
quanto menos pontos mais fácil fazer a reta.

Shape Tools(P) - Com essa ferramenta você pode criar formas pré-definidas:
Rectangle, Round Rectangle, Ellipse, Polygon, Line e Custom(qualquer).
Podendo fazer janelas com cantos arredondados, muito utilizado por
webmasters; na versão 7 se não me engano, essa ferramenta ficou
disponível, nas versões anteriores do Photoshop para se fazer uma janela
com cantos arredondados, prescisávamos utilizar o Maquee Tool para
“arredondá-los”. Com essa ferramenta tudo se tornou muito mais fácil.
Zoom Tool(Z) - Ferramenta Para Dar Zoom e Ver Mais Detalhadamente Certos Pontos

Hand Tool(H) - Não
tem muita utilidade, apenas substitui a barra de ferramentas; ou a
rodinha do seu mouse... Caso seu documento esteja mais “comprido” que o
campo de visão do seu monitor...

EyeDropper Tool(I) - Copia a cor de uma área determinada.

3º - Filters

[Teoria] Do Básico ao Avançado 2pp0t8l

Filters São Efeitos Que Podem Ser Aplicados na Sign (Claro Que Não São os Únicos)

Não Vou Explicar Todos, Pois Acho que é Muito Importante a Pessoa
Aprender Mexendo, Às Vezes Ela Pode Aprender Mais Assim Do Que Lendo
Tutoriais.

4º - Qual a Diferença Entre Avatar e Sign?

[Teoria] Do Básico ao Avançado Image

Exemplo de Sign

Começando... As Signs Normalmente Variam de Tamanho ENtre 400x120px Até 440x160px

Já os Avatares, Aqui na Web Cheats Tem o Tamanho 150x300px

A Diferença Entre Eles é Claro, Principalmente o Formato e Tamanho.

5º - O Que é Render?

Click this bar to view the original image of 612x639px.

A Render é o Elemento Principal de Uma Sign

A Render é Um Objeto, Pessoa, Ou Qualquer Coisa Recortada,

Para Ser Colocada na Sua Sign. A Render Tem Que Ser o Mais Importante da Sign

6º - Como Crio um Documento e Aplico Renders?

Para Criar um Novo Documento, Basta Ir em File --> New E Colocar os Dados Desejados

Para Adicionar Renders, Basta ir em File --> Place e Posicioná-la

7º I - O Que é Blending Mode?

Click this bar to view the original image of 459x598px.

O Blending Mode é o Modo da Camada.

Cada Blending Mode Tem Características Específicas

7º II - Os Blending Modes

Normal

Edita
ou pinta cada pixel para transformá-lo na cor resultante. Esse é o modo
padrão (o modo Normal é chamado de Limiar quando se trabalha em imagens
bitmaps ou de cores indexadas).

Dissolve / Dissolver

Edita
ou pinta cada pixel para transformá-lo na cor resultante. Entretanto, a
cor resultante é uma substituição aleatória dos pixels pela cor básica
ou de mesclagem, dependendo da opacidade na localização de qualquer
pixel.

Darken / Escurecer

Examina
as cores em
cada canal e seleciona a cor básica ou de mesclagem (a que for mais
escura) como cor resultante. Os pixels mais claros que a cor de
mesclagem são substituídos e os mais escuros não são alterados.

Multiply / Multiplicar

Examina
as informações de cor em cada canal e multiplica a cor básica pela cor
de mesclagem. A cor resultante é sempre a mais escura. Multiplicar
qualquer cor por preto produz a cor preta. Multiplicar qualquer cor por
branco não altera a cor. Ao pintar com uma cor que não seja preto ou
branco, as pinceladas sucessivas de uma ferramenta de pintura produzem
cores progressivamente mais escuras. O efeito é semelhante ao de se
desenhar na imagem com vários marca-textos.

Color Burn / Superexposicao de cores

Examina
as informações de cor em cada canal e escurece a cor básica para
refletir a cor de mesclagem, aumentando o contraste. Mesclar com branco
não produz alterações.

Linear Burn / Superexposicao Linear

Examina
as informações de cor em cada canal e escurece a corbásica para
refletir a cor de mesclagem, diminuindo o brilho. Mesclar com branco não
produz alterações

Lighten / Clarear

Examina
as informações de co em cada canal e seleciona a cor básica ou de
mesclagem (a que for mais clara) como cor resultante. Os pixels mais
escuros que a cor de mesclagem são substituídos e os mais claros não são
alterados.

Screen / Divisao
Examina
as informações de cor em cada canal e multiplica o inverso das cores de
mesclagem básica. A cor resultante é sempre mais clara. Dividir por
preto não altera a cor. Dividir pro branco produz a cor branca. O efeito
é semelhante a projetar vários slides fotográficos, um sobre o outro.

Color Dodge / Subexposicao de cores

Examina
as informações de cor em cada canal e clareia a cor básica para
refletir a cor de mesclagem, diminuindo o contraste. Mesclar com preto
não produz alterações.

Linear Dodge / Subexposicao Linear

Examina
as informações de cor em cada canal e clareia a cor básica para
refletir a cor de mesclagem, aumentando o brilho. Mesclar com preto não
produz alterações.

Overlay / Sobrepor

Multiplica
ou divide as cores, dependendo da cor básica. Padrões ou cores se
sobrepõem aos pixels existentes, preservando os realces e as sombras da
cor básica. A cor básica não é substituida e sim misturada com a cor de
mesclagem, para refletir a luminosidade ou a sombra da cor original.

Seu resultado ira depender da camada inferior

Soft Light / Luz indireta

Escurece
ou clareia as cores, dependendo da cor de mesclagem. O efeito é
semelhante ao de iluminar a imagem com uma luz de spot difusa.

Se a cor de mesclagem (origem da luz) for mais clara que 50% cinza, a
imagem ficará mais clara, como se tivesse sido subexposta. Se a cor de
mesclagem for mais escura que 50% cinza, a imagem será escurecida como
se tivesse sido superexposta. A pintura com preto ou branco puro produz
uma área mais escura ou mais clara, de forma distinta, mas não resultará
em preto ou branco puro.

Hard Light / Luz direta

Multiplica
ou divide as cores, dependendo da cor de mesclagem. O efeito é
semelhante ao de iluminar a imagem com uma luz de spot direta.

Se a cor de mesclagem ( origem da luz) for mais clara que 50% cinza, a
imagem ficará mais clara, como se tivesse sido dividida. Isso é
importante ao adicionar realces a uma imagem. Se a cor de mesclagem for
mais escura que 50% cinza, a imagem será escurecida, como se tivesse
sido multiplicada. Isso é importante ao adicionar sombras a uma imagem.
Pintar como preto ou branco puro resulta em preto ou branco puro.

Vivid Light / Luz brilhante

Superexpõe
ou subexpõe as cores, aumentando ou diminuindo o contraste, dependendo
da cor de mesclagem. Se a cor de mesclagem (origem da luz) for mais
clara que 50% cinza, a imagem será clareada pela diminuição do
contraste. Se a cor de mesclagem for mais escura que 50% cinza, a imagem
será escurecida pelo aumento de contraste.

Linear Light / Luz Linear
Superexpõe
ou subexpõe as cores, aumentando ou diminuindo o brilho, dependendo da
cor de mesclagem. Se a cor de mesclagem (origem da luz) for mais clara
que 50% cinza, a imagem será clareada pelo aumento de brilho. Se a cor
de mesclagem for mais escura que 50% cinza, a imagem será escurecida
pela diminuição de brilho.

Pin Light / Luz do pino
Substitui
as cores, dependendo da cor de mesclagem. Se a cor de mesclagem (
origem da luz) for mais clara que 50% cinza, os pixels mais escuros que a
cor de mesclagem são substituídos e os mais claros não são alterados.
Se a cor de mesclagem for mais escura que 50% cinza, os pixels mais
claros que a cor de mesclagem são substituídos e os mais escuros não são
alterados. Isso é importante ao adicionar efeitos especiais a uma
imagem.

Diference / Diferenca

Examina
as informações de cor em cada canal e subtrai a cor de mesclagem da cor
básica ou a cor básica da cor de mesclagem, dependendo de qual tiver
brilho maior. Mesclar com branco inverte os valores da cor básica,
enquanto mesclar com preto não produz alterações.

Exclusion / Exclusao

Cria
um efeito semelhante, mas de menor contranste que o do modo Diferença.
Mesclar com branco inverte os valores da cor básica. Mesclar com preto
não produz alterações.

Hue / Matiz

Cria uma cor resultante com a luminosidade e a saturação da cor básica e com a matiz da cor de mesclagem

Saturation / Saturação

Cria
uma cor resultante com a luminosidade e a matiz da cor básica e com a
saturação da cor de mesclagem. Pintar com esse modo em uma área com
saturação zero ( cinza) não produz nenhuma alteração.

Color / Cor

Cria
uma cor resultante com a luminosidade da cor básica e com a matiz e a
saturação da cor de mesclagem. Isso preserva os níveis de cinza na
imagem e é útil para colorir imagens monocromáticas e pintar imagens
coloridas.

Luminosity / Luminosidade

Cria
uma cor resultante com o matiz e a saturação da cor básica e com a
luminosidade da cor de mesclagem. Esse modo cria um efeito inverso ao
efeito de modo Cor.

8º - Como Aplico C4d's ?

[Teoria] Do Básico ao Avançado 1207222640

[Teoria] Do Básico ao Avançado 1207222640

Exemplo de C4d's

C4d's São Uns Efeitos Bem Legais Para a Sign

Mas Se Posicioná-los Mal, Pode Acabar Com a Sign

Para Colocá-los, é Igual a Renders... File --> Place

Mas Não Basta Só Fazer Isso. Precisa Mudar Seu Blending Mode.

Normalmente Usa-se Lighten, Linear Dodge (Mais Usado) Ou Screen.

9º - Como Coloco Borda?

[Teoria] Do Básico ao Avançado Dpffjb

Repare a Borda na Sign

É Simples, Primeiro Selecione Tudo Apertando Ctrl+A

Em Seguida, Vá Em Edit --> Stroke e Coloque o Tamanho e a Cor!

10º - Como Faço um BG Legal?

[Teoria] Do Básico ao Avançado T4u5wk

BG Feito Com Smudge e C4d's

Fazr o BG Pode Ser Algo Difícil, Porém é Apenas Deixar a Imaginação Fluir.

VocÊ Pode Fazer um BG Smudgeando Renders, Ou Simplesmnete Colocando Algumas C4d's,

Dando Alguns Efeitos Como Radial Blur, Usando Brushes, Enfim, Existem Muitos Modos!

11º - Saturação

[Teoria] Do Básico ao Avançado Nwg10h

Perceba a Diferença. Primeira Sign Normal, Segunda Saturada

A
Saturação é o Que Dá Cores à Sign. Uma Saturação Muito Baixa Resulta
Numa Sign Em Preto e Branco. A Saturação Pode Dar Um Toque Muito Legal à
Sign, Mas Do Mesmo Jeito Pode Acabar Com Ela.

Uma Saturação Muito Alta Deixa as Cores Muito Fortes, Fica Ruim de Se Ver e Chega a Doer os Olhos

Caso Não ENtendeu, Pegue Uma Sign, Dê um Apply Image, Aperte Ctrl+U e Aumente a "Hue". Você Notará a Diferença.

12º - Dicas

Bom
Galera... Pra Quem Está Começando, É Muito Importante Que Leia
Tutoriais, Pois é Com Eles Que Se Aprende Muita Coisa, Técnicas Novas,
Estilos Novos, Etc.

Não Saia Por Aí fazendo Signs Que Nem Loco, Procure Ler Bastnate
Tutoriais, Procurar Reproduzir o Efeito do Tuto, Aí Quando Tiver Uma Boa
Série de Informações Faça a Sign.

13º - Ainda Não Consegui!

[Teoria] Do Básico ao Avançado Help

Ainda Não Entendeu? Apresenta Dúvidas em Alguma Parte?
Crie seu tópico em dúvidas ou contate-nos, então faremos o máximo para ajudá-lo!

Como Instalo Brushes e Fontes?

Para
Instalar os Brushes, Depois de Baixá-los e Extraí-los, Abra Seu
Photoshop, Clique na Brush Tool e Abra o Menu Para Escolher os Brushes.
Em Seguida, Clique em Uma "Setinha" no Canto, Escolha "Load Brushes" e
Escolha Os Brushes Para Serem Carregados! Eu Recomendo Deixálos em
C:/Arquivos de Programas/Adobe/Adobe Photoshop Cs4 (Ou Cs2 ou Cs3)/
Presets/Brushes.

Para Instalar as Fontes, Depois de Baixá-las e Extraí-las, Selecione
Todas as Fontes e Copie-as. Em Seguida, Vá em Painel de Controle, Altere
Pelo Modo de Exibição Clássico e Clique em "Fontes". Cole as Fontes Lá e
Espere Carregar... Pronto, Fontes Instaladas ;D

Considerações Finais:

Esse tutorial demorou bastante tempo e deu muito trabalho para fazer.
Se te ajudei, agradeça o tópico, pois isto é um esforço mínimo que você pode fazer que, além de mostrar sua gratidão, impulsiona o criador do tópico a ajudar cada vez mais.

Créditos
Blending Modes: Google
O Resto: BR.

Abraços.

por **Admin** Sex Nov 18, 2011 2:27 pm

Muito bom, BR. excelente tópico, meus parabéns.
Possui muita informação. Dando dica sobre cada detalhe no uso do photoshop.
Certamente ajudará muito aos membros que gostam de frequentar esta área.
Mais uma vez agradeço pelo ótimo tópico.

por **Kamus** Dom Nov 20, 2011 10:03 am

Este tutorial é um dos melhores BR. Lembro ainda quando você o fez creio que no ano de 2009.
Como eu sempre falei , excelente tópico com cores e etc. Irá ajudar muito os iniciantes.

por **BR.** Dom Nov 20, 2011 10:59 am

Realmente, é um tutorial bem antigo, mas acho que foi no começo de 2010.
Obrigado pelos comentários pessoal, qualquer dúvida só perguntar!

Abraços.

por Conteúdo patrocinado

[Teoria] Do Básico ao Avançado

[Teoria] Do Básico ao Avançado

Re: [Teoria] Do Básico ao Avançado

Re: [Teoria] Do Básico ao Avançado

Re: [Teoria] Do Básico ao Avançado

Re: [Teoria] Do Básico ao Avançado