Unlimited PS Actions, graphics, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Design & Illustration
  2. Stickers
Design

Como Criar um Conjunto de Adesivo de Celebração de Contagem Regressiva no Adobe Illustrator

by
Difficulty:BeginnerLength:MediumLanguages:
This post is part of a series called 10 Years of Envato Tuts+!.
10 Essential Tools & Tips All Photoshop Beginners Should Learn
10 Essential Adobe Photoshop Brushes You Should Own

Portuguese (Português) translation by Adriana Takagi (you can also view the original English article)

Final product image
What You'll Be Creating

No tutorial de hoje vamos aprender como criar um conjunto de adesivos de mensagens para compartilhar nos nossos aplicativos de bate-papo. Vamos utilizar formas e ferramentas geométricas básicas do Adobe Illustrator, compreendendo algumas dicas rápidas e úteis ao longo do caminho.

Eu esbocei o conceito que vamos criar: os números de 10 a 1 em várias formatos de balão e fogos de artifício. Se você está procurando acelerar seu fluxo de trabalho ou comprar ilustrações semelhantes, você sempre pode dirigir-se ao GraphicRiver para comprar gráficos para decorar o pacote.

Vamos começar com o disparo da contagem regressiva de balão!

sketch concept celebration baloon countdown tutorial

Recursos do Tutorial

Para completar este tutorial, você vai precisar do seguinte:

1. Como Configurar o Arquivo do Novo Projeto

Passo 1

Inicie o Adobe Illustrator.

Vamos configurar um Novo Documento (File > New ou Command-N) utilizando as seguintes configurações:

  • Nome: Celebração de Contagem Regressiva (Celebration_Countdown)
  • Largura (Width): 512 px
  • Altura (Height): 512 px
  • Unidades (Units): Pixels
  • Número de Pranchetas (Number of Artboards): 11
  • Modo de Cor (Color Mode): RGB
  • Clique em Create
Create New Document Pixels RGB

2. Como Ilustrar as Formas & Números Balão

Passo 1

Comece digitando os números da contagem regressiva, 10 a 1.

Abra o painel CharacterWindow > Type > Character (Command-T). Selecione a Ferramenta Type do painel Tools. Escolha uma fonte tipo bolha; Por exemplo, utilizei Sniglet. Defina a cor do traçado como nula, com cor de preenchimento preta.

No painel Character, defina o tamanho da fonte para 215 pt e digite em cada Prancheta o número de contagem correspondente, 10, 9, 8, 7, 6, 5, 4, 3, 2, 1, e deixe a última placa de prancheta vazia.

Sniglet font Type countdown Number characters Type Tool

Passo 2

Vamos começar a desenhar as formas do balão.

Primeiro você precisa transformar todos os tipos em objetos. Para fazer isso, Select > All (Comando-A), para selecionar todos os números. Em seguida, Tyoe > Create Outline, para transformar números em objetos.

Select All Type Create Outlines

Passo 3

Do painel Tools, selecione a Ferramenta Pen (P) e defina a cor do traço para preto, sem cor de preenchimento. Desenhe em todas as formas de balão à mão livre, exceto as circulares, para as quais você pode utilizar a Ferramenta Ellipse (L).

Depois em cada prancheta selecione os elementos, expanda-os gradualmente para dentro do espaço da prancheta e rotacione-os um pouco para criar uma ilusão flutuante.

Pen tool Ellipse Tool Draw Balloons

Passo 4

Em seguida, pegue a Ferramenta Selection (V), selecione todos os números preenchidos de preto e Shift-X como um atalho para trocar o preenchimento com a cor do traçado.

Depois selecione as formas do balão e Object > Path > Offset Path. Defina o Offset em -13px e Joins: Round, depois OK.

Object > Ungroup (Command-Shift-G), para desagrupá-los uns dos outros.

Path Object Offset path SWap Shift X

Passo 5

Selecione a Ferramenta Pen (P), no painel Tools, mantendo a cor do traçado preto, sem preenchimento. Desenhe o destaque interno do balão e as áreas de sombra.

Pen tool Draw highlights shadow Balloons

Passo 6

Precisamos colocar as cordas do balão.

Comece abrindo o painel BrushesWindow > Brushes. Depois no menu do painel: biblioteca Open Brush Library > Show Calligraphic Brushes > Artistic > Artistic_Calligraphic.

Escolha o 10pt Calligraphic Brush, da biblioteca Artistic_Calligraphic. Depois selecione a Ferramenta Paintbrush (B), com um traço preto, sem preenchimento e desenhe as cordas do balão para cada balão.

File > Save (Command-S).

Calligraphic Brush Paintbrush tool draw balloon strings

3. Como Colorir & Adicionar Efeitos

Passo 1

Vamos colorir!

Primeiro, dê as seguintes cores à parte interna, parte externa e aos nós do balão:

  • Pink: Interno (#FA3D9E): Externo (#FFA1D5): Nó (#DD1482)
  • Azul: Interno (#2B8EF9) : Externo (#5FD2FF) : Nó (#0977DB)
  • Vermelho: Interno (#F63536) : Externo (#FF9CBB) : Nó (#E01C1D)
  • Verde: Inner (#71BA0B) : Outer (#ABED27) : Knot (#5F9B00)
  • Amarelo: Interno (#FFDC0D) : Externo (#FFFB73) : Nó (#FFBC00)

Certifique-se de alterar o arranjo de empilhamento de seus objetos à medida que você se move.

Para Organizar a parte superior ou inferior em posição: Object > Arrange > Bring to Front (Shift-Command-]) ou Object > Arrange > Send to Back (Shift-Command- [).

Para Organizar um passo para frente ou para trás: Object > Arrange > Send Backward (Command- [) ou Forward (Command-]). Object > Arrange > Bring Forward.

Dê aos fogos de artifício cores vermelhas e amarelas.

Color Fill and Arrange Objects Front Back Shortcuts

Passo 2

Em seguida, vamos adicionar a cor gradiente aos números.

Abra o painel GradientWindow > Gradient. Aplique os seguintes gradientes:

  • Amarelo: #FFDC0D para #FFBC00 definindo em -90° de ângulo
  • Vermelho: #F63536 para #E01C1D definindo em -90° de ângulo
  • Verde: #71BA0B para #5F9B00 definindo em -90° de ângulo
Color Gradient panel 90 degree angle

Passo 3

Em seguida, vamos adicionar alguns destaques.

Abra o painel Transparency: Window > Transparency. Pegue a Ferramenta Selection (V) e selecione todos os destaques do balão. Remova a cor do traço para preto, e selecione Fill (X).

Depois no painel Transparency, defina o Blending Mode para a Screen. No painel Gradient, escolha um preenchimento branco para o controle deslizante do gradiente esquerdo e defina uma Opacidade de 80%, fixada em um ângulo de -45°.

Depois, escolha um preenchimento branco no controle deslizante de gradiente direito e defina sua Opacidade para 0%.

gradient opacity screen transparency panel highlight 45 angle

Passo 4

Depois avance para posicionar os gradientes de sombra.

Comece com a área de sombra do pink: Pegue a Ferramenta Selection (V) e selecione todas as áreas de sombra do balão. Remova a cor do traço preto, e selecione Fill (X). Escolha o Blending Mode: Multiply, do painel Transparency.

Depois no painel Gradient, escolha uma cor de preenchimento rosa escuro no controle deslizante de gradiente esquerdo e defina a Opacidade: 80%, em um ângulo de 120°. No controle deslizante do gradiente direito, mantenha-o branco e defina a Opacidade em 8%.

color gradient mulitply transparency opacity angle shadows

Repita os mesmos passos para as outras sombras, exceto a combinação do controle deslizante de gradiente de cor escura com as cores respectivas, assim o controle deslizante vermelho escuro com vermelho, verde escuro em balões verdes, etc.

color gradient mulitply transparency opacity angle shadows

Passo 5

Depois, com a Ferramenta Selection (V), selecione cada cordão de balão e dê uma cor de traçado de sua escolha. Certifique-se de que todos sejam enviados para trás: Object > Arrange > Send to Back (Shift-Command- [).

apply color stroke strings balloon

Passo 6

Vamos adicionar um pouco de brilho.

No painel Tools, sob a Ferramenta Paintbrush (B) no menu suspenso, selecione a Ferramenta Blob Brush (Shift-B). Selecione um preenchimento branco.

Depois escolha um tamanho da Ferramenta Blob Brush segurando o colchete esquerdo ([) para diminuir e o colchee direito (]) para ampliar o tamanho do pincel, para desenhar algumas gotas de brilho nos balões.

Paintbrush Tool Blob Brush Shift B Highlights

Passo 7

Depois, adicione destaques aos números.

Utilize a Ferramenta Blob Brush (Shift-B), mas ao invés de um preenchimento branco, use tons de cores claras e aplique Screen: Blending Mode no painel Transparency.

Blob Brush tool Transparency Screen Blending Mode Highlights

Passo 8

Vamos desenhar alguns confetes!

Desenhe o confete utilizando a Ferramenta Brush (B). Utilize o pincel Oval 5pt da biblioteca Artistic_Calligraphic e utilize um Traço de 2-3pt de Espessura.

Tente desenhar confetes espirais com diferentes cores e espessuras de traços.

Paint Brush Tool Artistic Calligraphic Brush Stroke

Passo 9

Adicione mais confetes utilizando a Ferramenta Ellipse (L)Ferramenta StarFerramenta Rectangle (M), e utilize diferentes cores e tamanhos de forma. Nota: Não desenhe elementos pequenos.

Depois Organize para a frente ou para trás: Object > Arrange > Bring to Front (Shift-Command-]) ou Object > Arrange > Send to Back (Shift-Command- [).

Parece colorido!

USe ellipse Star Rectangle tool Arrange Front Back Color

Passo 10

Em seguida, precisamos que os números saltem um pouco mais.

Utilize a Ferramenta Selection (V) para selecionar os números dentro dos balões: 10, 9, 7, 5, 4, 3 e 1. Duplique a seleção por Shift-Option-Arrastando um pouco para baixo.

Dê a seleção uma cor dourada amarelada #CCB842. Depois defina o Blending Mode para Multiply, no painel Transparency.

Você vai precisar Organizar um passo para trás: Object > Arrange > Send Backward (Comando- [).

Selection Duplicate Blending Mode Multiply Arrange Balloons

Passo 11

Finalmente, utilize a Ferramenta Selection (V) para Agrupar (Comando-G) cada balão com suas respectivas partes, centralize-o na prancheta, dimensione-o, e modifique qualquer coisa que você ache que esteja desajustado.

Arquivo> Salvar (Comando-S).

Group Selection Center Artboard Modify Balloons

4. Como Exportar e Compartilhar

Passo 1

Quando você tiver finalizado o trabalho, você precisa Exportar seus arquivos.

File > Export > Export As, e selecione o local para o arquivo. Certifique-se de escolher um formato PNG, e selecione Use Artboards para Exportar.

Defina as configurações de PNG Options:

  • Resolution: Screen (72 ppi)
  • Background Color: Transparent
  • OK
PNG Options Export transparent background files

Passo 2

Agora que você tem criado o seu conjunto de adesivo, é hora de fazer o upload dele.

Dirija-se ao Sticker Market, e Registre-se em uma Conta de Criadores e aguarde a verificação. Este é um processo relativamente rápido, em comparação com outros sites. Depois de verificado, preencha os seus dados.

Siga as Orientações de upload de adesivos. Faça o Upload do conjunto, preencha a descrição, o preço e as tags e Salve.

StickerMarket Misschatz Creator Upload Set Celebration Stickers

Passo 3

Na próxima página, selecione o tipo de Action e Emotion para cada adesivo. Preencha os detalhes e Salve para envio.

sticker market details tags sticker set save

Espere pela aprovação, e seus adesivos vão estar prontos para o público comprar.

stickermarket celebration countdown sticker set sell

10, 9, 8, 7, 6, 5, 4, 3, 2, 1 ..... Parabéns !!!

Espero que você tenha se divertido seguindo este tutorial e você tenha aprendido algumas dicas úteis.

Eu amaria ver o que você criou! Por favor sinta-se à vontade para compartilhar os designs do seus adesivos conosco.

Contagem regressiva, se divirta e compartilhe com seus amigos em bate-papo como WhatsApp, Viber, Line, iMessage e muito mais em Android ou iPhone!

Final Balloon Countdown Sticker Set Stickermarket
Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.