Retratos tipográficos Photoshop

13th September 2011
Postado originalmente em http://www.photoshopcreative.com.br/tutoriais/aq0-122-7374-4-

retratos+tipograficos+feitos+com+photoshop.html#anc-pagina [http://www.photoshopcreative.com.br/tutoriais/aq0-122-7374-4-
retratos+tipograficos+feitos+com+photoshop.html#anc-pagina] em 04/04/2010 s 12h 52min
Este tutorial tem como objetivo mostrar que ao experimentar com peso, tamanho, espaamento e
opacidade da fonte possvel criar luzes, sombras e profundidade na imagem. A tcnica pode ser aplicada
s imagens de seu gosto.
[http://www.photoshopcreative.com.br/upload/imagens_upload/00(48).jpg]
[http://2.bp.blogspot.com/-pFcULjlQThI/Tm7PUbseXVI/AAAAAAAADKg/1kJQlwgf8r8/s1600/1.jpg]
Tipografia [http://www.photoshopcreative.com.br/tutoriais/aq0-122-7374-1-
retratos+tipograficos+feitos+com+photoshop.html] no apenas escolher uma fonte bonita, mas a forma como
arrumamos as letras no layout, decidindo o tamanho, peso e tipo de fonte adequados para transmitir a
mensagem do jeito mais simples.
INFORMTICA EM ARTES GRFICAS II: Retratos
tipogrficos feitos com PHOTOSHOP
INFORMTICA EM ARTES GRFICAS II: Retratos tipogrficos feito... http://regisdesigner.blogspot.com.br/2011/09/informatica-em-artes-graf...
1 de 11 06/01/2014 13:28
Nossa escolha de palavras e fontes para esta imagem funciona bem com o retrato que desejamos criar
[http://www.photoshopcreative.com.br/tutoriais/aq0-122-7374-1-retratos+tipograficos+feitos+com+photoshop.html] , mas
encorajamos voc a experimentar com suas prprias fontes e palavras para obter resultados nicos relevantes
no retrato construdo.
A hora de brincar [http://www.photoshopcreative.com.br/tutoriais/aq0-122-7374-1-
retratos+tipograficos+feitos+com+photoshop.html] com fontes, fundos texturizados e gradientes. Voc pode ser to
detalhado quanto desejar. Experimente estas instrues e deixe voar sua imaginao.
1 Prepare a imagem de referncia
[http://3.bp.blogspot.com/-hQ_9JkxB_xc
/Tm7PVJ2pReI/AAAAAAAADKk/DR2jhr7J41o/s1600/2.jpg]
Abra a imagem que ser usada. Aplique Image > Mode > Grayscale a ela e use Levels e Curvespara aumentar o
contraste, tornando as reas de luz e sombra fceis [http://www.photoshopcreative.com.br/tutoriais/aq0-122-7374-1-
retratos+tipograficos+feitos+com+photoshop.html] de perceber.
[http://3.bp.blogspot.com/-4-fibowkIkY
/Tm7PWNG4aJI/AAAAAAAADKo/RSEGHX6smr0/s1600/3.jpg]
2 Sombras e luzes V a Image > Adjustments > Shadow/ Highlight. Brinque com os deslizantes para exibir
luzes e sombras suficientes. Para Shadows, usamos: Amount = 25%, Tonal Width = 35% e Radius = 48
px. Para Highlights usamos:Amount = 34%, Tonal Width = 0% e Radius = 78 px.
[http://www.photoshopcreative.com.br/upload/imagens_upload/03(169).jpg] [http://www.photoshopcreative.com.br/upload
/imagens_upload/03(169).jpg]
2 de 11 06/01/2014 13:28
[http://2.bp.blogspot.com/-ijXNpGUcf8Y
/Tm7PXedtTYI/AAAAAAAADKs/mx59R1yiKuo/s1600/4.jpg]
3 Recorte V o menu Select > Color Range e escolha as sombras. Inverta a seleo, aplique uma Quick Mask e
apague as reas mascaradas ao redor da modelo usando a ferramenta Brush ajustada para branco. Depois de
mascarar a modelo, saia da Quick Mask e aplique Select > Feather de 3 px. Copie e abra um novo documento.
Cole a imagem como uma nova camada acima da camada de fundo. Salve o documento, pois trabalharemos
nele. O recorte no precisa ser muito exato, pois servir apenas como referncia.
[http://3.bp.blogspot.com/-XQw1rS5bxeo
/Tm7PYLWXrxI/AAAAAAAADKw/Pz_dUEg2EzE/s1600/5.jpg]
4 Brilho e contraste Agora que temos nossa referncia, precisamos acentuar as luzes e sombras para que seja
mais fcil posicionar o texto. Abra o ajuste deBrightness/Contrast do menu Image > Adjustments e
aumente Brightness +10 eContrast +20. Seu guia est pronto para receber texto.
3 de 11 06/01/2014 13:28
[http://3.bp.blogspot.com/-VI9ZBIX6EgU/Tm7PY23dQQI
/AAAAAAAADK0/bDI5ywrQcIE/s1600/6.jpg]
5 Diminua a opacidade Reduza o valor de opacidade da camada de referncia para que o texto fique visvel
quando for aplicado. Comece com os trechos maiores e no se esquea de pr cada linha em uma camada
separada caso seja necessrio reorganizar o posicionamento ou alterar a fonte. Lembre-se tambm de salvar
em intervalos regulares.
[http://4.bp.blogspot.com/-1_rxNC-
Dy-U/Tm7PZTuijkI/AAAAAAAADK4/aMSsDIiwB1s/s1600/7.jpg]
6 Posicionamento do texto Depois de arranjar o texto principal, ponha o texto ligeiramente menor logo atrs
do maior para que este se destaque [http://www.photoshopcreative.com.br/tutoriais/aq0-122-7374-2-
retratos+tipograficos+feitos+com+photoshop.html] um pouco mais. Se quiser, adicione um discreto Drop Shadow s
linhas principais em camadas de ajuste para destac-las mais ainda, mas isso opcional e pode ser removido
posteriormente caso desejado.
4 de 11 06/01/2014 13:28
[http://3.bp.blogspot.com/-o6899-
ZTVU0/Tm7PaeoAGmI/AAAAAAAADK8/IHAJ2kI9Iks/s1600/8.jpg]
7 Comece a empilhar as sombras Quando estiver posicionando o texto, o truque
[http://www.photoshopcreative.com.br/tutoriais/aq0-122-7374-2-retratos+tipograficos+feitos+com+photoshop.html] fazer
linhas menores, mais aproximadas e com peso maior nas reas de sombra da imagem de referncia, e texto
maior, mais espaado e com menos peso nas reas de luz. Assim se cria a profundidade da imagem final, que,
de outro, modo pareceria plana.
[http://3.bp.blogspot.com/-E90fhsF7zLI/Tm7PbdEQcTI/AAAAAAAADLA/4bJbQoFCzm0/s1600/9.jpg]
8 Relatrio de progresso Enquanto constri o cabelo, oculte a camada de referncia ocasionalmente para
observar seu progresso. preciso poder perceber as reas sombreadas e iluminadas. Para facilitar
[http://www.photoshopcreative.com.br/tutoriais/aq0-122-7374-2-retratos+tipograficos+feitos+com+photoshop.html] , agrupe
as camadas na paleta de acordo com as partes do retrato em que est trabalhando. Continue com esse processo
ao longo do tutorial.
5 de 11 06/01/2014 13:28
[http://4.bp.blogspot.com/-VJsn4rHbCAk/Tm7Pb-9NIzI/AAAAAAAADLE/i1--1fuMkpo/s1600/10.jpg]
9 Construa os olhos Depois de completar o cabelo, o retrato precisa de um rosto. Comeamos com os olhos.
Usando o mesmo mtodo do cabelo, mantenha o texto bem prximo nas reas escuras e deixe as brancas sem
nada. Use o menu Edit > Transform > Rotate no texto para seguir a forma do olho. No precisa usar palavras
diferentes. Para ganhar tempo, basta duplicar as camadas de texto e transformar. Mexa na opacidade
das letras [http://www.photoshopcreative.com.br/tutoriais/aq0-122-7374-2-
retratos+tipograficos+feitos+com+photoshop.html] nos clios inferiores.
[http://4.bp.blogspot.com/-AK6eG6Ykh5E/Tm7PceFRWNI/AAAAAAAADLI/2Ovbr6halCI/s1600/11.jpg]
6 de 11 06/01/2014 13:28
10 Sobrancelhas e sombra Faa o mesmo nas sobrancelhas. Tente usar palavras mais longas para preencher a
forma e use o menu Edit > Transform > Warp para seguir a curva. Para a sombra sob o olho, brinque com o
valor de opacidade das camadas de texto e o peso da fonte, j que essa sombra tem de ser perceptivelmente
mais clara que os traos principais do rosto.
[http://3.bp.blogspot.com/-ACcT6oWPKpc
/Tm7PdIYK-3I/AAAAAAAADLM/9Eh9olW_Ntg/s1600/12.jpg]
11 Comece o nariz O nariz, acreditamos, a parte mais difcil do rosto. preciso usar todas as tcnicas
aprendidas at agora. O sombreamento um importante fator. Utilize as ferramentas de transformao para
contornar o nariz, mas brinque tambm com o valor de opacidade do texto para as transies de sombra.
[http://1.bp.blogspot.com/-mxMVQ38coWk
/Tm7Pd1fYv4I/AAAAAAAADLQ/zyCHdsTfgSY/s1600/13%252C.jpg]
12 Repita as sombras Tente duplicar as camadas de texto para o outro lado do nariz para poupar tempo e
brinque com as ferramentas de transformao para dar forma. Quando for hora de sombrear, mantenha a
opacidade do texto mais forte nas narinas e duplique o texto, reduzindo a opacidade conforme a sombra
esmorece.
7 de 11 06/01/2014 13:28
[http://3.bp.blogspot.com/-bvQPdBQh4fA
/Tm7Perob5QI/AAAAAAAADLU/40iol6mKwmU/s1600/14.jpg]
13 Lbios atraentes Para fazer os lbios, siga as mesmas etapas do nariz. Concentre-se nas reas escuras e
depois trabalhe o sombreamento. Demora bastante at acertar as feies, mas vale a pena insistir para chegar
a um efeito realstico no final.
[http://4.bp.blogspot.com/-DjJIMzJnCB0
/Tm7PfcRKKyI/AAAAAAAADLY/KdfOLsWYcfQ/s1600/15.jpg]
14 Relatrio de progresso facial Terminado o rosto, esconda a camada de referncia para observar seu
progresso. Nota-se que o rosto est tomando forma e vemos a diferena entre as feies principais e o
sombreamento. Agora o rosto precisa de um contorno e de alguns toques finais.
8 de 11 06/01/2014 13:28
[http://2.bp.blogspot.com/-oE_waYLV5YQ
/Tm7PgL4dGlI/AAAAAAAADLc/5tNDHm9XcQQ/s1600/16.jpg]
15 Siga o trao Tendo em vista que as feies esto prontas, vamos criar [http://www.photoshopcreative.com.br
/tutoriais/aq0-122-7374-3-retratos+tipograficos+feitos+com+photoshop.html] um contorno. Percebemos que as
palavras menores funcionam bem. Duplique etransforme [http://www.photoshopcreative.com.br/tutoriais
/aq0-122-7374-3-retratos+tipograficos+feitos+com+photoshop.html] as palavras para seguir a forma. O queixo ficou
meio achatado, por isso preciso sombre-lo um pouco. Repita, alterando gradualmente a opacidade do texto
e siga a forma para criar um dgrad.
[http://3.bp.blogspot.com/-T3i4WS5FEqU
/Tm7PhLpxVHI/AAAAAAAADLg/rKcnpzyRSdY/s1600/17.jpg]
16 Mas do rosto e pescoo Para dar mais profundidade ao rosto, vamos usar sombras que mostrem o
contorno das mas do rosto. Use a mesma palavra para manter a consistncia e empilhe as palavras
ligeiramente inclinadas para mostrar a direo da sombra, mexendo na opacidade e seguindo a foto
[http://www.photoshopcreative.com.br/tutoriais/aq0-122-7374-3-retratos+tipograficos+feitos+com+photoshop.html] guia.
Faa o mesmo no pescoo, comeando com texto e opacidade mais pesados sob o queixo e terminando com
valores mais leves.
9 de 11 06/01/2014 13:28
[http://1.bp.blogspot.com/-qMUVdEaGbb0/Tm7PiVNwzOI/AAAAAAAADLk/Mo8cQ8ZNjVk/s1600/18.jpg]
17 Achate se ousar Quando estiver satisfeito, selecione as camadas de texto (excluindo o Background) e
selecione Layers > Merge Layers (mas mantenha uma verso com as camadas para uso futuro). Utilize a
ferramenta Burn com Exposure 100% sobre as reas de sombra para acentu-las.
10 de 11 06/01/2014 13:28
[http://1.bp.blogspot.com/-ByZWDOrwgBM/Tm7PjGq0rKI/AAAAAAAADLo/mEiU_Xta254/s1600/19.jpg]
18 Brinque com gradientes Altere Image > Mode para CMYK e aplique um estilo de camada Gradient
Overlay na nova camada de texto. Brinque com os gradientes, direo e modos de mesclagem dos efeitos na
caixa de dilogo Layer Styles. Aqui, usamos o modo Linear Light.
19 Fundo Adicione uma camada de ajuste Gradient Fillacima da camada Background e abaixo da de texto.
Escolhemos um gradiente branco para azul/verde claro, Reflected, Angle = -45 e Scale = 150%. Finalmente,
selecione a miniatura da mscara da camada de ajuste e aplique uma textura Sandstone (Filter > Texture >
Texturizer) para dar mais profundidade.
Postado h 13th September 2011 por REGIS
11 de 11 06/01/2014 13:28

Retratos tipográficos Photoshop

Uploaded by

Document Information

Original Title

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

Retratos tipográficos Photoshop

Uploaded by

Copyright:

Available Formats

13th September 2011

Postado originalmente em http://www.photoshopcreative.com.br/tutoriais/aq0-122-7374-4-

You might also like