Oi Pessoal! Criei, especialmente para este making of, uma divertida ilustração para o header do blog da minha irmã, a Stella. No seu blog e ela narra situações do dia-a-dia com leveza e bom humor, e achei que seria divertido desenvolver uma ilustração que representasse isso. Espero que esse meu passo a passo ajude os profissionais que estão começando a se aventurarem pelo mundo do design e ilustração. E fique à vontade para dar feedbacks e para comentar o tutorial.

Passo 1 - Brainstorming ftw

Sempre que inicio uma ilustração pessoal para alguém, gosto de fazer um brainstorm sobre as coisas que aquela pessoa gosta, para criar uma espécie de moodboard e captar bem a sua personalidade no desenho. No caso da minha irmã, por exemplo, Itália, Viagem e Macarrão não podiam faltar de jeito nenhum na ilustração. Nessa etapa também crio despretensiosamente rascunhos da ilustração, testando novas formas e composições interessantes.

Beautiful Vector Illustration in Illustrator and Photoshop by Carol Rivello

Passo 2 - Roughs, Sketches & Drawings

Depois de definidos os elementos que farão parte da ilustração e de escolhida uma linha gráfica inicial, eu começo o rascunho que servirá de base para o vetor. Nesta etapa eu gosto de ser mais detalhista, utilizo lapiseira e um lápis macio para simular os contornos e gradientes do vetor. Muitas pessoas pulam esta etapa e iniciam o desenho diretamente no computador, mas eu pessoalmente prefiro criar primeiro no papel. Além de eu me sentir mais criativa nele, serve como desculpa para sair um pouco do computador.

Beautiful Vector Illustration in Illustrator and Photoshop by Carol Rivello

Step 3 - Vector madness

Terminado o rascunho, eu escaneio ou tiro uma foto dele, para depois importar o jpg em um software de ilustração vetorial (meu preferido do momento é o Illustrator). Nesta etapa eu me preocupo somente em criar os outlines das formas, deixando o preenchimento com cores para depois. Recomendo trabalhar com uma cor que se destaque bastante do desenho de base para auxiliar na visualização. Nessa ilustração eu escolhi um stroke vermelho.

Beautiful Vector Illustration in Illustrator and Photoshop by Carol Rivello

Step 4

Eu gosto do illustrator porque ele oferece vários recursos para facilitar o processo de vetorização. Um artifício que eu uso frequentemente é o Pattern Brush. Em vez de desenhar uma flor inteira, por exemplo, você pode desenhar somente uma pétala, transformá-la em pattern brush, criar uma forma com este outline, e conseguir resultados bem legais. Esta dica é especialmente boa para quem gosta de composições abstratas, como eu.

Beautiful Vector Illustration in Illustrator and Photoshop by Carol Rivello

Step 5 - Cleaning up the house

Depois que eu termino finalmente de vetorizar toda a composição, eu dedico um tempinho para organizar o arquivo, colocando todos os objetos na ordem certa, para facilitar a próxima etapa, que eu considero a mais difícil…

Beautiful Vector Illustration in Illustrator and Photoshop by Carol Rivello

Step 6 - Choosing Colors

O momento de escolher as cores e pintar a ilustração é sempre o mais difícil para mim. Nesse projeto me inspirei nas cores da bandeira da Itália, mescladas com os tons alegres da bandeira do Brasil, mas com um look vintage. Nesta fase também desenvolvo os gradientes e escolho as texturas que utilizarei. Minha dica é dar uma olhada nos Patterns do próprio Illustrator, dentro de Swatches » Patterns » Basic Graphics.

Beautiful Vector Illustration in Illustrator and Photoshop by Carol Rivello

Step 7 - Color Groups & Inspiration

Um bom site para buscar inspiração em cores é o colourlovers.com. Lá você pode pesquisar entre inúmeras paletas criadas pelos usuários. Ah, e depois de escolhida a paleta de cores, vale a pena criar um new color groupcom os tons escolhidos.

Beautiful Vector Illustration in Illustrator and Photoshop by Carol Rivello

Step 8 - Almost there

…Colore mulata, colore!

Beautiful Vector Illustration in Illustrator and Photoshop by Carol Rivello

Step 9 - Typography

A escolha da fonte para compor com a ilustração é uma etapa muito divertida. Adoro testar várias combinações e ir à procura de fontes novas. O problema é que empolgo tanto nessa etapa, que as vezes pré-seleciono 30 fontes e depois sofro para escolher a final. Para esta ilustração pensei em uma fonte forte, bold e moderna, contrastando com uma segunda fonte manuscrita.

Beautiful Vector Illustration in Illustrator and Photoshop by Carol Rivello

Step 10

Quando você for utilizar a mesma forma diversas vezes, uma boa dica é usar o recurso de símbolos do illustrator. Você cria um motion clip, e espalha o objeto pela composição conforme seu preset. Com as opções da ferramenta você tem a possibilidade de aumentar e diminuir o símbolo, mudar sua posição, opacidade, etc. Desta forma você não precisa duplicar e reposicionar o objeto manualmente.

Beautiful Vector Illustration in Illustrator and Photoshop by Carol Rivello

Step 11 - Blending Modes

Depois de preencher o vetor com os tons escolhidos, gosto de dar uma refinada na composição com gradientes e texturas. Algumas ilustrações ficam bonitas com cores chapadas, mas nessa preferi trabalhar com gradientes para deixar o resultado final com mais profundidade. Um dos segredos para uma composição visualmente rica é testar diferentes texturas e blending modes. Eu utilizo com frequência as opções multiply, overlay e softlight. Também gosto de brincar com diferentes opacidades e nuances.

Beautiful Vector Illustration in Illustrator and Photoshop by Carol Rivello

Step 12 - Photoshop

Depois de terminar a vetorização, eu exporto o trabalho para um polimento final no photoshop. No photoshop eu mesclo o vetor à imagens em bitmap, para atingir um visual mais orgânico. Lá eu também utilizo as adjustment layers e faço testes com ajustes de cores, levels, curvas e etc.

Beautiful Vector Illustration in Illustrator and Photoshop by Carol Rivello

Step 13 - Don’t be messy

Com a grande quantidade de layers criada, é comum se perder e gerar um arquivo bagunçado. Tente sempre evitar isso, e mantenha um documento com camadas nomeadas corretamente e com pastas organizadas.

Beautiful Vector Illustration in Illustrator and Photoshop by Carol Rivello

Step 14 - Brushes and Scribbles

Ainda na ideia de deixar os vetores com uma aparência mais orgânica, inseri nessa etapa final elementos desenhados à mão, criando uma composição hibrida. Também adicionei brushes e luzes coloridas, todos em layers separadas, preservando a ilustração original.

Beautiful Vector Illustration in Illustrator and Photoshop by Carol Rivello

Conclusion

Depois de terminar a ilustração do header, é hora de criar o layout do restante do blog. Mas isso fica para um próximo passo-a-passo. ;) Obrigada por ter me aturado até aqui! Caso você queira ficar por dentro de mais devaneios meus, dicas e links interessantes (ou não, hah), estou lá no twitter: www.twitter.com/carolrivello.

Beautiful Vector Illustration in Illustrator and Photoshop by Carol Rivello

Sobre o Autor

Sou a Carol Rivello, uma designer que ama trabalhar com web design, direção de arte e ilustração. Atualmente sou freelancer, moro em Floripa e é isso que eu vejo quando abro minha janela. Amo porquinhos e tenho uma coleção com mais de 300 integrantes. Também amo: Internet, Música, Viajar, Cinema, Seriados, Ilustração, Sketch Books, Motion design, Decoração, T-shirts, Porcos, Chocolate, Sorvete de Flocos, Pássaros, Nuvens, Sol, Mar e quase tudo dos anos 80. Para mais informações visite http://www.carolrivello.com/

About the author of this post

Would like to write a guest post for us?

If you would be interested in writing some guest articles or even become a regular contributor, send us an email to abduzeedo[at]abduzeedo.com requesting a contributor account.