Tutorial do Illustrator: Receitas de fluxo de trabalho e design afiado

Cartografia (desenho de mapas de localização) com Illustrator - Parte 4.

Todos os vídeos do tutorial Tutorial do Illustrator: Receitas de fluxo de trabalho e design nítidas

Como anunciado na última parte, iremos desenhar a área verde aqui. Em seguida, criaremos o fundo e por último criaremos a água. Isso pode parecer bastante complicado, considerando que teremos que desenhar cada detalhe com a ferramenta de caminho. Mas não se preocupe, há uma ferramenta especial que torna isso muito simples. Mas mais sobre isso mais tarde.

Desenhar área verde

Primeiro, vamos começar com a área verde. Para isso, vamos até o nosso Painel de Camadas, desbloqueamos a área verde e bloqueamos o restante para evitar alterações acidentais nas outras camadas.

Cartografia (desenho de mapas de localização) com o Illustrator - Parte 4

Vamos marcar isso e escolher um Contorno relativamente visível. Isso significa, uma cor forte com 2 pt de espessura (no meu caso, é um verde qualquer - a cor exata do gramado será definida posteriormente). Desativamos a área e pegamos a ferramenta de caminho para começar a traçar as áreas verdes. Isso é bastante rápido. Não é uma grande área. Podemos até passar por baixo do rio Spree, pois todas as ruas estão acima da área verde. Como estamos desenhando sobre a área residencial ao olhar para o Painel de Camadas, devemos criar o gramado o mais preciso possível.

Cartografia (desenho de mapas de como chegar) com Illustrator - Parte 4

E depois preenchemos a área correspondente:

Cartografia (desenho de mapas de localização) com o Illustrator - Parte 4

Preencher área verde

Em seguida, queremos dar uma cor à área verde. Vamos ao Painel de Camadas, marcamos todas as camadas primeiramente. Em seguida, desativamos o Contorno com o qual criamos anteriormente as bordas e selecionamos a área de gradiente. Isso abrirá o Painel de Gradiente. Clicamos duas vezes no controle deslizante esquerdo e lá clicamos na seta direita. No menu suspenso, mudamos para RGB...

Cartografia (desenho de mapas de localização) com Illustrator - Parte 4

... pois só então podemos inserir o seguinte valor hexadecimal: Cor: #cbcc98.

Cartografia (desenho de mapas de localização) com o Illustrator - Parte 4

Clicamos duas vezes no controle deslizante direito, também o alteramos para RGB...

Cartografia (desenho de mapas de direção) com o Illustrator - Parte 4

... e lhe damos a cor: #dbe6b6 ...,

Cartografia (desenho de mapas de localização) com Illustrator - Parte 4

... pressionamos a tecla Enter e temos uma bela área verde.

Cartografia (desenho de mapas de rota) com Illustrator - Parte 4

Para que nossa área não tenha uma transição tão suave de escuro para claro, no Painel de Gradiente, definimos um Ângulo: 94°. Assim teremos um gradiente natural bonito, que não parecerá tão artificial.

Cartografia (desenhar mapas de localização) com o Illustrator - Parte 4.

Estrutura do gramado

Em seguida, queremos dar mais aparência ao gramado, neste caso uma Estrutura. Vamos para o Painel de Aparência e abrimos ...

fx> (Efeitos do Photoshop) Filtro de textura>Adicionar textura.

Cartografia (desenho de mapas de direção) com o Illustrator - Parte 4

Textura: Arenito
Escala: 200 %
Altura do relevo: 3
Luz: Cima à direita

Com a Altura do relevo de 3, o Relevo é menos pronunciado do que em nossa área residencial e, portanto, ideal para um gramado.

Cartografia (desenho de mapas de localização) com Illustrator - Parte 4

Clicamos em OK e nosso filtro foi aplicado.

Cartografia (desenho de mapas de localização) com o Illustrator - Parte 4

Não queremos dar uma Sombra ao gramado. Pois um gramado é sempre muito plano e, portanto, não precisa de relevo, como seria o caso de um prédio alto, por exemplo.

Oportunidades de prados

Oportunidade 1

Quero mostrar-lhes outra possibilidade para criar prados, duplicamos a área verde e ocultamos a área verde inferior.

Cartografia (desenho de mapas de direção) com Illustrator - Parte 4

Ao acessarmos o painel Estilos Gráficos e clicarmos no ícone inferior esquerdo, que abre as bibliotecas, podemos ver que ainda podemos carregar mais estruturas.

Cartografia (desenhar mapas de direção) com Illustrator - Parte 4

Vamos ver o que temos lá ... Lá encontramos um símbolo chamado Cartografia RGB - Planície quando passamos o mouse sobre ele.

Cartografia (desenho de mapas de localização) com o Illustrator - Parte 4.

Se selecionarmos esse símbolo, a estrutura será aplicada imediatamente e teremos assim uma textura de prado. Como vocês podem ver, com bordas distorcidas que fluem suavemente para a área residencial ou para a terra. Fica muito bonito também.

Cartografia (desenho de mapas de localização) com Illustrator - Parte 4

Oportunidade 2

Aqui temos outra possibilidade, chamada Relva RGB, ao selecionar isso, também podemos ativar essa estrutura.

Cartografia (desenho de mapas de localização) com o Illustrator - Parte 4

Essas opções são apenas para demonstrar mais possibilidades, caso não queiram criar suas próprias estruturas para representar áreas residenciais, prados, subsolo etc.

Cartografia (desenho de mapas de localização) com o Illustrator - Parte 4

Chão

Agora, além da água, precisamos de um fundo adequado. Vamos para a camada de Fundo e a desbloqueamos. Podemos bloquear a área verde agora.

Cartografia (desenho de mapas de localização) com Illustrator - Parte 4

Selecionamos o campo de cor e escolhemos uma cor de areia adequada.

Cor: #f1efd8

Cartografia (desenho de mapas de direção) com o Illustrator - Parte 4.

Pressionamos Enter e já temos nossa cor de areia adequada. Em seguida, pegamos a Ferramenta Retângulo e desenhamos um retângulo grande sobre toda a superfície do mapa, que imediatamente aparece na cor correta.

Cartografia (desenhar mapas de localização) com o Illustrator - Parte 4

Vamos adicionar um pouco de textura. Já que o chão é mais parecido com areia e, portanto, não é inteiramente liso. Por isso, vamos para o painel Aparência ...

Aparência > fx > (Efeitos do Photoshop) Filtro Granulação > Grão.

Cartografia (desenho de mapas de direção) com Illustrator - Parte 4

A janela de diálogo se abre.

Textura: Arenito
Escala: 100 %
Altura do relevo: 4
Iluminação: Superior direita

Como queremos um chão mais fino, ajustamos a Escala para 100% e a Altura do relevo para 4, para que fique um pouco mais evidente. Assim, temos uma bela textura de pedra.

Cartografia (desenho de mapas de acesso) com o Illustrator - Parte 4

Clique em OK e o filtro será aplicado. E já temos novamente uma maravilhosa textura.

Cartografia (desenho de mapas de localização) com o Illustrator - Parte 4.

Isso faz com que pareça muito mais natural do que apenas ter uma superfície lisa. Porque nenhuma superfície é realmente lisa e geralmente parece muito artificial.

Corpos de água

E então podemos começar imediatamente com os corpos de água. Para isso, vamos para o painel de camadas e ocultamos tudo o que está cobrindo o mapa. Queremos ver a água. Em seguida, vamos para a camada de corpos de água, desbloqueamos e exibimos clicando na caixa vazia, onde imediatamente um ícone de olho aparece.

Cartografia (desenho de mapas de localização) com Illustrator - Parte 4

E se observarmos com atenção a água e como ela está estruturada aqui, veremos que já temos muitas curvas e pequenos desvios. Às vezes, a linha também fica um pouco mais fina nos desvios muito estreitos. E realmente temos aqui muitos tipos diferentes e traçados de como devemos modelar a contorno. Ou seja, se seguirmos cada trecho com a ferramenta de caminho, podemos realmente passar um bom tempo nisso. Mas há outra maneira de preencher essas áreas de forma relativamente rápida. E fazemos isso com a ferramenta Pincel Gotas.

Com a ferramenta Pincel Gotas, pintamos áreas sem ter que adicionar pontos individuais. Simplesmente pintamos na área e quando terminamos,...

Cartografia (desenho de mapas de trajeto) com o Illustrator - Parte 4

... vemos que temos uma área do caminho sem termos definido pontos de ancoragem anteriormente.

Cartografia (desenho de mapas de localização) com o Illustrator - Parte 4

Ao clicarmos duas vezes na ferramenta Pincel Gotas, podemos definir o tamanho:

Tamanho: 5 Pt

Cartografia (criação de mapas de navegação) com o Illustrator - Parte 4

Em seguida, ampliamos o mapa e escolhemos uma cor adequada para ver claramente o que estamos fazendo. Um azul mais escuro é suficiente. E pegamos o tamanho que parece mais adequado no momento. Portanto, podemos voltar para 1 Pt. É mais fácil talvez começarmos com um tamanho menor no início e contornar as bordas primeiro. Depois de termos o contorno, preenchemos o interior facilmente. E se as bordas ainda estiverem um pouco tortas - no início, não tem problema. Porque podemos corrigi-las depois. Vou mostrar a vocês no próximo passo.

Cartografia (desenho de mapas de localização) com o Illustrator - Parte 4.

A vantagem é que para aqueles que já possuem uma mesa digitalizadora, é especialmente fácil redesenhar isso aqui. Assim como normalmente com caneta e papel, ao traçarmos, podemos contornar e depois pintar as áreas. E é incrível como realmente podemos pintar rapidamente esses difíceis traçados de linhas grossas para finas. E, dependendo da situação, para acelerar um pouco, podemos sempre ajustar a contorno e - por exemplo, rapidamente pintar o lago de carpas. Pressionando a tecla de espaço, posso facilmente deslizar ao longo.

Correção

E ao olharmos agora para o contorno que desenhamos, vemos que não está perfeito.

Cartografia (desenho de mapas de localização) com o Illustrator - Parte 4

Há um canto aqui e ali mais um cantinho. A água não flui angularmente. :) E para isso, há uma solução maravilhosa, ou seja, pressionamos a tecla Ctrl e clicamos no caminho. Então vemos todos os pontos de caminho que foram criados. E percebemos facilmente que são muitos. Para suavizá-los, pressionamos a tecla Alt- e temporariamente alternamos para a ferramenta Adicionar Ponto. E ao passarmos várias vezes pelos contornos, os pontos de caminho desnecessários são excluídos e o caminho é retificado. Assim, podemos levar a corrente a fluir maravilhosamente. :D

Alt (mantido pressionado): (alternar temporariamente para) ferramenta Adicionar Ponto.

Cartografia (desenho de mapas de direção) com o Illustrator - Parte 4

E temos aqui um resultado maravilhoso.

Cartografia (desenho de mapas de localização) com o Illustrator - Parte 4

Pressione a tecla Ctrl uma vez e clique fora para que possamos avaliar melhor o resultado. E este é realmente um curso de rio muito convincente. Faremos isso agora com o restante dos corpos de água.

Com o curso uniforme do rio, basta apenas um contorno adequado, com o qual se possa traçar o rio de uma só vez. Agora vocês podem ver aqui que nós desenhamos o curso d'água sobre as ruas.

Cartografia (desenho de mapas de direção) com Illustrator - Parte 4

Mas isso não importa, pois nossa camada de água está abaixo da camada das ruas. Quando todas as camadas estão visíveis, podemos ver como tudo se encaixa maravilhosamente aqui.

Cartografia (criação de mapas de direção) com o Illustrator - Parte 4

E com o resto já podemos ver nosso resultado intermediário:

Cartografia (desenho de mapas de rotas) com o Illustrator - Parte 4

No próximo passo, vamos colorir adequadamente o curso d'água e no espaço verde - imaginemos que temos uma floresta lá - vamos criar os símbolos de floresta correspondentes. Além disso, criaremos a legenda das principais ruas.