quinta-feira, 10 de abril de 2014

Curso Web Design | Como pintar desenhos no Photoshop – parte 01

Curso Web Design | Como pintar desenhos no Photoshop – parte 01

Link to Blog do Curso Web Design - Microcamp SP

Como pintar desenhos no Photoshop – parte 01

Posted: 10 Apr 2014 06:26 AM PDT

CAPA PINTURA NO PHOTOSHOP

Nesta semana, a rede de escolas Microcamp SP promove sua Anime Fan Fest, a primeira do gênero na escola. Além do concurso de Cosplay, Jogos, Filmes e outras atividades, algumas escolas promoverão também uma oficina de desenho de Mangás e Animes. Pensando nisso e na possibilidade de que seus desenhos fiquem com um acabamento mais bacana e profissional depois de participar de uma oficina como essa, o Blog do Web Design vai mostrar para você como dar os primeiros passos na pintura de desenhos com o Adobe Photoshop.

Pintura digital no Photoshop é algo que desperta muito interesse nas pessoas que trabalham com o programa. Com tantos recursos que o programa possui e outros que você pode acrescentar como pincéis e texturas, você pode realizar efeitos realmente interessantes em seus desenhos, deixando-os com aspecto profissional.

Se você nunca experimentou pintar no Photoshop, esse tutorial básico (que será dividido em duas partes devido ao grande número de etapas) vai ajudar você a dar os primeiros passos e a conhecer dicas que o levarão a desenvolver suas próprias técnicas no futuro.

Se você já conhece a maioria dos recursos mostrados aqui, a segunda parte do tutorial (que sairá na semana que vem) vai lhe mostrar algumas opções interessantes que lhe ajudarão a arriscar-se em algo mais complexo. Nesta primeira parte mostrarei como preparar o desenho e o processo básico de pintura para colorização em camadas. Na segunda parte, mostrarei os efeitos e truques para deixar sua pintura igualzinha ao que você vê nas revistas e pôsteres vendidos em bancas e livrarias.

Observação 01: todos os recursos mostrados aqui estão disponíveis em qualquer versão do Photoshop CS3 em diante.

Observação 02: Se não possui um desenho de sua autoria e deseja  utilizar um pronto, vá direto para o fim do ITEM 5.

Vamos começar?

1 – Preparando o desenho

Se você costuma desenhar utilizando papel e caneta (o método mais tradicional) e quer pintar seus desenhos, é claro que vai precisar digitalizar sua imagem em um bom scanner.

É recomendável que nessa primeira tentativa você contorne seus desenhos com uma caneta preta, de preferência uma caneta nanquim, mas se não tiver uma, não tem problema: um bom resultado também pode ser alcançado com uma hidrográfica cor preta (daquelas que você já deve possuir – e se não possui pode comprar em qualquer papelaria).

Preparando o desenho a lapis e caneta

1) O desenho ainda no traço á lápis – 2) O desenho já devidamente contornado com caneta preta hidrográfica ou nanquim e livre dos traços á lápis.

Uma vez que tenha contornado seu desenho, procure apagar suavemente seus traços a lápis antes de digitaliza-lo. Podemos limpar esses traços mais tarde no Photoshop, mas quanto mais "limpo" você puder deixar a arte, menos trabalho terá em seguida.

2 – O processo de digitalização

Com o desenho previamente contornado e preparado e sem as marcas de lápis em sua maior parte, chegou a hora de digitaliza-lo em um Scanner. Hoje, qualquer scanner atual pode realizar essa função com os padrões ideais que mostrarei aqui.

Para que possamos obter um bom tratamento da imagem é recomendável digitalizar sempre com uma resolução de 300 DPI (Dots per Inch, ou Pontos por polegada). Essa resolução é a recomendável para trabalhos que serão impressos ou tratados no Photoshop. Você até pode digitalizar com uma qualidade acima dessa (como 600 DPI, por exemplo). Mas isso gerará arquivos realmente pesados, e esteja realmente preparado para consumir boa parte da memória virtual do programa durante o processo de colorização (e já escrevi um post aqui sobre como otimizar o desempenho do seu Photoshop, caso seu computador não possua muita memória, é bom ajustar alguns de seus recursos antes de começar).

Outro detalhe que deve observar durante a digitalização é a respeito do padrão de cor. A princípio, você pode digitalizar a imagem em tons de Cinza, em vez do modo de cor RGB ou CMYK, já que na etapa inicial de preparação do desenho, ainda não será necessário colori-lo.

Scaneando o desenho

3) Utilize um bom scanner para digitalizar seu desenho – 4 ) Não esqueça de configurar o modo de cor para Tons de Cinza e 5) Sempre utilize resolução em 300DPI.

3 – Tratando o desenho no Photoshop

Agora que digitalizou a imagem, é necessário que faça alguns ajustes iniciais para deixa-la em condições de pintura. Abra-a no Photoshop (Control+O, ou Arquivo > Abrir) e comece a ajustar seu brilho e contraste (no Menu Principal, opção Imagem > Ajuste > brilho e Contraste) até que as áreas de sombras e resíduos a lápis sumam por completo.

Abrindo o desenho no Photoshop

Acertando o Brilho e Contraste no Photoshop

Acertando o Brilho e Contraste no Photoshop - janela de ajuste

Acertando o Brilho e Contraste no Photoshop – janela de ajuste

Caso não consiga um bom ajuste somente com essa ferramenta, outra boa opção é a ferramenta Curvas (Control + M ou Imagens > Ajustes > Curvas). A intenção aqui é deixar tudo "preto-no-branco", isto é, deixar o traçado preto o mais forte possível e o fundo completamente limpo. Isso também irá ajudar a "desentupir" algumas áreas escuras dos cantinhos mais finos do desenho (mas cuidado para não deixar o contorno com aspecto "serrilhado", pois isso pode acabar com a qualidade do trabalho).

Acertando as Curvas no Photoshop

4 – Convertendo o arquivo para RGB

Para que possamos ter um resultado satisfatório na pintura e explorar a maioria dos recursos do programa, após tratar a imagem devemos convertê-la para o modo de cor RGB. Se mais tarde você necessitar imprimi-la, é recomendável que ao final do trabalho converta-a para CMYK (mas até lá temos muito trabalho pela frente, então não se preocupe por enquanto com esse detalhe). Para convertê-la de Tons de Cinza para RGB, vá até Imagem > Modo > Cores RGB. Você irá perceber que sua camada passará a se chamar "Plano de Fundo"  ou "Background" automaticamente, e terá algumas de suas propriedades bloqueadas.

5 – Limpando a imagem no Photoshop

Desbloqueie a camada dando um duplo clique nela e renomeie seu nome para "CONTORNO". Essa camada é muito importante, pois ela será a base de toda a nossa pintura.

Desbloqueio de camada

Agora que a camada está desbloqueada, devemos eliminar o fundo branco de toda a imagem. Você deverá ser bem paciente e caprichoso nesta etapa. Utilize a ferramenta Varinha Mágica para isso. clicando diretamente nas áreas brancas apertando "Delete" para exclui-las.

Utilizando a varinha mágica

Deletando o fundo

Caso alguns detalhes não possam ser excluídos em um primeiro momento, aumente o Zoom da imagem para buscar cada detalhe. É importante que a imagem fique completamente livre do fundo branco.

Detalhes no zoom

O resultado final deverá ser uma camada somente com o traçado do desenho, sem fundo branco, totalmente "limpa". Se você alcançou esse resultado, então agora estamos prontos para a pintura.

Desenho limpo sem fundo no Phostoshop

Se não possui um desenho para digitalizar, você pode baixar o desenho que utilizei nesse tutorial diretamente aqui, já em PNG e com o fundo totalmente transparente.

6 – Iniciando a pintura no Photoshop

Agora que o desenho está pronto para receber a pintura, vamos utilizar um método em que pintaremos cada detalhe da imagem em uma camada separada. Poderíamos pintar diretamente no desenho, mas pintar os detalhes em camadas diferentes será importante para aplicarmos diferentes efeitos que irei demonstrar na parte 02 deste tutorial. Portanto, siga os passos da maneira como vê a seguir:

Selecione a ferramenta Varinha Mágica (W) novamente e clique na opção chamada “Adicionar á seleção” que se encontra na barra de opções da ferramenta na parte superior do programa. Isso vai servir para que possamos selecionar várias partes do desenho de uma vez só.

Seleção com varinha mágica

Depois escolha um detalhe do desenho para começar a pintar. Eu escolhi começar pela PELE do personagem, então fui clicando e selecionando tudo o que é pele no desenho para poder pinta-la de uma só vez (nesse momento, ter uma imagem de referência também é fundamental).

Pele selecionada

Após ter terminado a seleção, crie uma nova camada (Control + Shift+ N) e dê a ela o nome de PELE . Esse passo é importante para que compreenda que sempre iremos fazer a seleção da imagem na camada de CONTORNO, mas nunca pintaremos diretamente nela. SEMPRE QUE FOR PINTAR ALGO NO DESENHO, DEVE CRIAR UMA CAMADA NOVA E PINTAR NELA, NUNCA NO CONTORNO, entendido?

Camada PELE

Por fim, antes  de iniciarmos a pintura, devemos aumentar um pouco a Seleção para que não fiquem pequenas falhas nas bordas do desenho. Esse detalhe é importante porque mesmo que nossa pintura “invada” um pouco o contorno, depois moveremos a camada de Contorno para cima de todas as outraspara resolver o problema.

Para aumentar a Seleção, vá até o menu Principal, escolha a opção “Selecionar”   e escolha “Modificar” e “Expansão” . Em seguida, digite 01 pixel na janela de opção que aparecerá e dê OK. Isso vai fazer com que a seleção que fez com a varinha mágica “cresça” um pixel, evitando assim que fiquem pequenas falhas ao pintar o desenho.

Aumentando a seleção no Photoshop

Agora, vamos começar a pintar pra valer. Escolha um tom de cor para a pele na caixa de diálogo de cor do Photoshop (dê um duplo clique na cor de primeiro plano da barra lateral para faze-la aparecer). Eu escolhi R 255, G 217 e B 188, mas você pode escolher o tom que desejar.

Janela de cor

Em seguida, também na barra lateral do programa, escolha o Pincel (B) e clicando diretamente na área selecionada inicie o processo de pintura. Somente a área selecionada será pintada e certifique-se de que está na camada da pele do personagem, criada por você nos passos anteriores.

Pintura

Para que possa ver o acabamento da figura de forma perfeita, como mencionei antes, mova a camada PELE para baixo da camada de CONTORNO, apenas clicando e arrastando. Sempre deixe todas as camadas que criar abaixo de Contorno, pois ela é a camada que dá o acabamento em todo o desenho.

Arrastando camadas no Photoshop

Para pintar o restante do desenho, vamos repetir sempre esse mesmo passo a passo, a recordar:

  1. Selecione as partes que deseja pintar com Varinha Mágica;
  2. Aumente a seleção em Selecionar > Modificar > Expandir 01 pixel;
  3. Abra um nova camada abaixo da camada de Contorno;
  4. Selecione a cor de sua preferência e…
  5. Pinte o objeto com o pincel.

No meu caso, por exemplo, escolhi a roupa do personagem para pintar em seguida, obedecendo essas mesmas etapas:

Camada roupa

Janela de cor

Roupa pintada

Prossiga com cada detalhe do desenho nesta mesma sequência. No meu caso, organizei a pintura agrupando os detalhes da seguinte forma: PELE. ROUPA, FAIXA, CORDÃO, SAPATOS, CABELO E SOBRANCELHAS, LÍNGUA E BRACELETES (não precisa ser nessa mesma ordem, você é quem escolhe o que irá pintar em sequência).

Em alguns detalhes mais difíceis, como o rabo(?) do personagem, você vai ter de fazer a seleção com a ferramenta laço Poligonal, pois é praticamente impossível selecionar cada cantinho dessa parte do desenho. Abra uma nova camada, faça a seleção com essa ferramenta clicando ao redor do objeto e pinte-a em seguida.

Seleção da calda

Seleção com laço poligonal

Depois de pintada, não esqueça de move-la para baixo da camada de Contorno para que fique como a imagem a seguir:

Finalizando e arrastando a calda

Se você repetir esse passo-a-passo, após pintar todos os detalhes, seu desenho deverá ficar com a mesma aparência da imagem a seguir:

Fim da pintura

Nossa pintura está quase pronta.Você pode retocar detalhes mais finos indo em cada camada e reduzindo a ponta do pincel para encontrar cantinhos mais difíceis de pintar. Quanto mais capricho, melhor será o resultado, lembre-se!

Na próxima parte deste tutorial, irei mostrar  como inserir volume no desenho adicionando sombras, brilhos e efeitos diversos. Você pode ter uma amostra de como esse desenho ficará após a segunda parte do post conferindo a imagem abaixo:

Aspecto final

Até lá, vá praticando no Photoshop e não deixe de postar nos comentários o que achou. Se quiser, envie-nos suas pinturas para que possamos ver se realmente conseguiu fazer o tutorial e quem sabe, surpreender-nos com o grande artista que vive em você!

Nenhum comentário:

Postar um comentário

Os comentários são muito bem vindos e importantes, pois enriquecem o conteúdo dos artigos.

Afilia-se na NetAffiliation

Ganhe dinheiro com os Programas de Afiliados