Ferramentas E Tutoriais
Um guia passo a passo para projetar ilustrações personalizadas sem qualquer habilidade de desenho
Vejo que muitas empresas hoje usam ilustrações ou imagens de estoque. Embora essas opções sejam baratas, a mensagem da marca é diluída porque o visual não é exclusivo do produto.
rubi ou rubi sobre trilhos
Em um mundo onde 74 por cento das mídias sociais e profissionais de marketing B2B usam recursos visuais em suas promoções, a forma como você se destaca visualmente é fundamental.
Se sua marca for prolífica, as pessoas aprenderão a linguagem visual associada a ela. Assim que eles virem as mesmas ilustrações associadas a outro produto, a identidade da sua marca se enfraquecerá.
Com ilustrações personalizadas, os elementos da identidade de uma marca podem se unir em torno de uma perspectiva e personalidade compartilhadas. Eles se comunicam com os clientes em um nível intuitivo e ajudam as marcas a contar sua história de maneira duradoura.
No entanto, muitos designers evitam trabalhar como ilustradores pelo medo de que eles não tenham habilidades de desenho. Estamos aqui para mostrar como qualquer designer pode desenvolver belas ilustrações, sem precisar de desenho.
Veremos três estilos de ilustração populares e aplicaremos etapas muito simples para desenvolver sua própria arte a partir do zero. Você pode acompanhar e aplicar o que aprenderá para criar peças de excelente aparência para seu próximo projeto.
Recrie a famosa ilustração do espaço.
A designer e ilustradora Nina Georgieva é a pioneira por trás dessa famosa peça Dribbble, e agora, o estilo se tornou uma tendência própria.
Inspirando-se em Georgieva, criaremos nossa própria ilustração espacial, seguindo algumas etapas fáceis.
Isso é o que você vai conseguir no final.
1. Comece com as estrelas.
Usando a 'ferramenta estrela' do Illustrator, crie uma estrela de quatro pontas. Em seguida, torne-o 75% transparente.
Enquanto estiver selecionado, duplique-o no local pressionando Ctrl + C e, em seguida, Ctrl + F.
Reduza a forma na frente.
Em seguida, adicione um efeito brilhante; selecione a forma maior; e aplique um efeito “Desfoque Gaussiano” do painel “Aparência”.
Finalmente, você pode armazenar a forma de sua estrela dentro do painel “Símbolos” para usá-la posteriormente na composição.
2. Crie a forma da nuvem.
Empilhe retângulos com várias larguras.
Una-os com o painel “Pathfinder”.
Termine dando à forma inteira um valor alto de “raio de canto”.
3. Faça a textura do planeta a partir das nuvens
Começando com a forma de nuvem, crie o efeito de textura do planeta como mostrado acima.
Empilhe muitas formas de nuvens juntas e certifique-se de ter uma sucessão de curvas para fora e para dentro para criar um padrão ondulado.
4. Ajuste a textura.
Simplifique o padrão ondulado antes de aplicá-lo à forma do planeta.
Remova os pontos extras de um lado da textura e alise-o.
5. Crie um planeta texturizado.
Sobreponha o padrão ondulado com um círculo e crie uma divisão usando a opção “Divide” dentro do painel “Pathfinder”.
Exclua a forma extra criada fora do círculo e crie um efeito de iluminação aplicando diferentes valores de cinza a cada lado do planeta.
6. Adicione uma atmosfera ao planeta.
Crie dois círculos maiores e cole-os atrás do planeta com Ctrl + X e depois Ctrl + B.
Alinhe-os corretamente.
Adicione transparência aos novos círculos e um efeito de desfoque ao terceiro círculo (dentro do painel “Aparência”).
Agrupe (Ctrl + G) e armazene o resultado dentro do painel “Símbolo”.
7. Duplique e pinte os planetas.
Copie várias formas de planeta do painel ”Símbolos” e recolori-os usando duas cores diferentes para cada lado.
Use a “Direct Selection Tool (A)” para selecionar e a “Eyedropper Tool (I)” para escolher e aplicar uma cor.
8. Dimensione e posicione seus planetas
Mova os planetas em posições diferentes com a “Ferramenta de Seleção (V),” e dê a eles vários tamanhos arrastando os cantos brancos que aparecem quando selecionados (mantenha a tecla “Shift” para escala proporcional).
9. Adicione os anéis.
Desenhe alguns círculos de linha ao redor dos planetas para fazer os anéis.
Para colar planetas menores na frente dos anéis, selecione-os e pressione Ctrl + X (cortar) e Ctrl + F (colar na frente).
10. Adicione algumas nuvens e estrelas no céu.
Voltando ao painel “Símbolo”, arraste e solte algumas nuvens e formas de estrelas.
Duplique, dimensione e posicione-os como desejar em seu espaço.
Aqui está o resultado final.
Brinque com a escala, a posição e as cores para torná-lo realmente seu.
Adicione um pouco de tipografia e voila, você terá um novo plano de fundo de área de trabalho personalizado.
Recrie o estilo de ilustrações do blog do ApeeScape
O blog do ApeeScape é uma fonte valiosa de ideias e inspiração criada pelos principais talentos em todo o mundo. Assim como o que você está lendo agora, a maioria dos artigos traz ilustrações para apoiar o conteúdo. Usamos formas geométricas simples e cores brilhantes para representar objetos.
Vamos ver como você pode aplicar este estilo para criar suas próprias ilustrações de comida.
Isso é o que você vai conseguir no final.
1. Desenhe uma batata frita simples.
Para criar uma fritada, comece com um retângulo longo e adicione vários pontos nas bordas com a “Pen Tool (P)”.
Ajuste a forma movendo os pontos ao redor, usando a 'Ferramenta de seleção direta (A)'.
2. Crie o recipiente de maionese.
Crie três círculos com tamanhos decrescentes, de trás para frente.
O círculo externo é o recipiente, o do meio (em branco) é a maionese, e o círculo interno menor (com um traço colorido) é para o efeito de iluminação.
Corte o círculo interno pela metade e certifique-se de que o “Cap” e o “Corner” do painel “Stroke” sejam redondos.
documento de design técnico para aplicativo móvel
3. Faça o ketchup e a mostarda.
Duplique o copo de maionese para criar mostarda e ketchup.
Basta aplicar cores diferentes ao molho e iluminar, conforme sugerido acima.
4. Adicione a alface em forma de onda.
Com a “Pen Tool (P)”, trace uma linha reta e adicione vários pontos a ela.
Distribua o espaçamento horizontal no painel “Alinhar”.
Arraste para baixo os pontos de alteração e arredonde cada canto ao máximo, até que esteja completamente liso.
5. Crie uma fatia de pão.
Crie um oval longo; sobreponha-o à forma de onda e crie uma divisão usando a opção “Divide” do painel “Pathfinder”.
Remova a forma extra obtida com a ferramenta “Divide” e, em seguida, colore novamente a fatia de pão.
6. Faça o pão do hambúrguer.
Espelhe a fatia de pão verticalmente e adicione um ponto de inflexão à camada superior.
Arredonde essa borda para fazer um pão de hambúrguer liso.
o que é uma empresa s vs c corporação
7. Termine o hambúrguer.
Pinte a alface de verde.
Em seguida, crie diferentes “retângulos arredondados” para carne, queijo e tomate, usando as cores marrom, amarelo e vermelho, respectivamente.
Mova as coisas para colocar o hambúrguer em uma camada adequada.
8. Crie um cachorro-quente do hambúrguer.
Começando com a ilustração do hambúrguer, remova os tomates e o queijo, pinte novamente a alface com maionese e mostarda e duplique o pão de baixo para um cachorro-quente mais simétrico.
9. Desenhe a forma de pizza.
Comece com a camada superior do hambúrguer, mova as pontas inferiores para baixo e aproxime-as.
Duplique a forma do triângulo, reduza a escala e torne-a amarela para uma base extravagante.
10. Adicione as formas de tomate.
Sobreponha um grande círculo vermelho com círculos internos menores e use a opção “Minus Front” do painel “Pathfinder”.
Coloque várias fatias de tomate com diferentes tamanhos e posições na forma de pizza.
11. Crie algumas fatias de carne.
Desenhe uma forma marrom orgânica com a “ferramenta Caneta (P)”, duplique e dimensione-a em cima da pizza.
12. Adicione coberturas extras.
Adicione pinceladas menores, coloridas e arredondadas em espaços vazios para finalizar as coberturas de sua pizza.
13. Crie o canudo.
Estrela com um longo retângulo branco.
Adicione dois pontos com a “Pen Tool (P)” e mova as bordas superiores para dobrar o canudo.
Copie e cole o ponto do meio na aresta direita e, a seguir, aplique um traço vermelho, sem preenchimento.
Mova a linha vermelha no meio do retângulo branco.
14. Crie o formato da lata de refrigerante.
Desenhe um polígono de oito lados; adicione a lata; mova os quatro primeiros pontos para cima; e dimensionar (S) as bordas superior e inferior para fora para torná-la mais parecida com uma lata.
Adicione retângulos arredondados na parte superior e inferior para criar as bordas.
15. Ajuste o formato da lata e dimensione o canudo.
Mova os pontos para ajustar as formas e, em seguida, dimensione a lata e o canudo em proporções relacionáveis.
16. Finalize com o desenho ondulado na lata.
Desenhe uma forma orgânica e ondulada para o desenho na lata.
Em seguida, crie uma divisão com o painel “Pathfinder” e exclua as formas externas extras.
Aqui está o resultado final.
Recrie uma ilustração inspirada no jogo Monument Valley
Monument Valley é um jogo campeão de vendas criado pelo estúdio UsTwo. Ele ganhou dezenas de prêmios, incluindo o melhor jogo para iPad da Apple em 2014, e seu estilo de ilustração é inspirado na bela arte geométrica de Escher.
Agora você aprenderá como criar facilmente o mesmo estilo visual que tornou este jogo um grande sucesso.
como compilar código c ++
Isso é o que você vai conseguir no final.
Você só usará planos e cubos como blocos de construção para toda a ilustração.
A paleta de cores tem quatro cores para água, grama, madeira e construção - cada uma em três tons para simular a luz natural.
1. Crie um plano isométrico.
Comece com um quadrado e siga estas três etapas para criar uma forma isométrica. Preste atenção porque você repetirá esse processo toda vez que precisar de outra forma isométrica.
Vamos chamá-lo de “Efeito Isométrico:”
Vá para Effect> 3D> Extrude & Bevel Selecione “Isometric Top” dentro da lista suspensa “Position” - dentro do painel de opções que aparece. Defina “Extrude Depth” para zero na primeira opção “Extrude & Bevel”.
Agora você tem um plano isométrico.
Para brincar melhor com a forma, vá em Object> Expand Appearance.
Isso permitirá que você mude a cor do avião e mova os pontos livremente.
Vamos chamá-lo de “Efeito de expansão”.
2. Trace as faces da ilha.
Para criar as três faces da forma da ilha, crie um quadrado e dois retângulos alongados.
Repita o “Efeito Isométrico” em cada um.
Para a etapa dois, aplique “Isometric Top”, “Isometric Left” e “Isometric Right” respectivamente.
3. Complete e pinte a base da ilha.
Aplique o “Efeito Expandir” e pinte cada rosto com diferentes tons de verde, com o mais brilhante sempre no topo.
4. Crie faces de cubo em perspectiva.
Aplique o “Efeito Isométrico” em três quadrados, com a isométrica esquerda, superior e direita na etapa dois. Isso fornece as três faces de que você precisa para obter um cubo isométrico.
Observe que cada objeto em sua ilustração usará apenas três faces. Essa é a beleza da perspectiva isométrica.
5. Componha um cubo.
Libere as formas com o “Efeito Expandir”, reúna os rostos e aplique três tons de cinza para simular a iluminação.
Dica: A sombra mais clara está sempre no topo; o mais escuro, à direita; e o tom médio, à esquerda. Aplicar isso a cada forma em sua ilustração criará uma impressão de luz natural.
6. Inicie a base da árvore.
Siga os mesmos passos do cubo isométrico e, desta vez, alongue as faces esquerda e direita antes de conectar o todo.
Em seguida, aplique três tons de marrom para representar a madeira.
7. Termine a árvore.
Reduza a casca da árvore; duplicar um cubo; e pinte seus rostos de verde como a forma do terreno.
8. Use um cubo para criar os blocos de construção
Duplique um cubo e pinte-o de rosa para o material de construção.
Brinque com escala; mova os pontos inferiores para baixo para criar uma base de torre; e reduzi-lo para criar um pilar.
9. Monte as torres.
Alinhe a base da torre e o cubo rosa.
Deixe algum espaço entre eles e posicione três pilares dentro dessa lacuna.
Para um alinhamento perfeito, certifique-se de definir “Ajustar ao ponto” e “Guias inteligentes” na opção de menu “Exibir”.
10. Construa uma ponte sobre as torres.
Selecione o ponto superior e direito de um plano superior e faça snap em pontos com o plano equivalente na torre gêmea.
Simplesmente duplique e redimensione um plano do lado direito para criar uma borda para a ponte da torre.
11. Crie escadas.
Copie e cole três faces de uma torre; alinhe as bordas para criar um bloco; e mova os pontos inferiores para criar um degrau de uma escada.
Duplique e posicione as etapas várias vezes.
12. Feche as escadas.
Alinhe os pontos dos lados esquerdos para fechar as lacunas das escadas.
13. Vire as escadas.
Selecione suas escadas concluídas e use a “Ferramenta Refletir (O)” para criar um segundo bloco voltado para a esquerda.
Certifique-se de alterar as cores das faces esquerda e direita para respeitar o efeito de iluminação - tom mais escuro à direita, tom médio à esquerda e tom mais claro na parte superior.
14. Ligue as escadas.
Anexe alguns cubos às escadas para criar alpondras e ligue-os às torres.
15. Crie um efeito de profundidade da água.
Duplique e reduza a superfície azul claro.
Coloque-o em várias posições e adicione um tom de azul ainda mais escuro para finalizar o efeito de profundidade do mar.
16. Comece o convés usando aviões existentes
Assim como com as escadas e a ponte da torre, comece pelas faces existentes, alinhe os pontos corretamente para fechar a forma e termine aplicando tons de madeira marrom.
17. Adicione pilares ao convés.
Selecione a casca da árvore, depois duplique, reduza a escala e posicione para criar os pilares do convés.
Aqui está o resultado final.
Você pode adicionar pontos escuros maiores no mar ou quadrados isométricos coloridos menores no plano da ilha para simular grama e flores.
No geral, divirta-se, mova as coisas e construa algumas torres legais, usando os blocos de construção simples que você acabou de aprender.
o princípio gestalt de proximidade se refere à maneira como nós
Em conclusão
Como vimos com esses três guias, você não precisa de muitas habilidades de desenho para criar algumas ilustrações bonitas.
Tudo que você precisa manter em mente são estes três princípios:
- Comece com uma ideia ou conceito claro em mente - o que você está retratando?
- Inspire-se com obras de arte e estilos existentes - roube como um artista.
- Observe e traduza elementos complexos em formas geométricas básicas nas quais você pode trabalhar - mantenha a simplicidade.
Divirta-se criando suas próprias ilustrações e carregue sua nova obra de arte no Dribbble e em qualquer outro lugar da web. Aproveitar!
• • •
Leituras adicionais no ApeeScape Design Blog:
- eCommerce UX - Uma Visão Geral das Melhores Práticas (com Infográfico)
- A importância do design centrado no ser humano no design de produtos
- Os melhores portfólios de UX Designer - Estudos de caso e exemplos inspiradores
- Princípios heurísticos para interfaces móveis
- Design Antecipatório: Como Criar Experiências Mágicas do Usuário
