NdVO.blog.

br
Portugus
English

Desenhando com o Inkscape

Este tutorial foi feito para iniciantes sem nenhum conhecimento prvio do programa, e tem o
objetivo de mostrar-lhes que, com alguns conhecimentos bsicos de Inkscape possvel atingir resultados
timos.
Apesar de ser para iniciantes, nosso objetivo no mostrar isoladamente cada funo, e sim como
de fato os desenhos so feitos. Por isso o material pode ser um pouco denso - no tenha medo de errar, de
saltar uma etapa ou de voltar vrias.
Ns dividimos este tutorial em duas etapas nas quais iremos desenhar, no Inkscape, a
personagem 'Assassina' do jogo Ataque a Torre (que voc pode baixar aqui). Nesta primeira parte do
tutorial, vamos pegar uma imagem escaneada e transform-la em um grco vetorial em cores. Voc pode
baixar aqui o desenho escaneado e aqui um arquivo .svg com o resultado nal.

Primeiramente, abra o Inkscape. Abra tambm uma janela do navegador de arquivos e arraste a
imagem da assassina para dentro do Inkscape. Ele perguntar se voc quer embutir ou dar link imagem
[imagem A].
Clique em link e OK. (Quando voc usa link, qualquer alterao que zer imagem ser
atualizada automaticamente ao seu arquivo de inkscape. Tanto link quanto embutir tem suas vantagens e
desvantagens, que veremos em outro tutorial).
A imagem aparecer [imagem B]. A pgina padro no centro da janela no aparecer no desenho,
e voc pode ignor-la.
Vamos nos preparar para iniciar o trabalho. Primeiramente, queremos que a imagem escaneada
aparea na tela, sem prejudicar nosso desenho. Para isso, abra o menu 'Camadas>Gerenciador de
camadas', ou pelo atalho 'Control Shift L', que chama o painel no lado direito da imagem B.

Todo desenho composto por camadas transparentes sobrepostas, e cada camada pode possuir
incontveis objetos. Ao dividir nosso desenho em camadas, poderemos editar partes dele enquanto
deixamos outras partes intocadas.

Para criar uma camada, clique no boto "+" no painel de Camadas. Clique duas vezes nos nomes
das camadas para alter-los. Aqui as chamei de "scan" e "vetorial" [imagem A].
Selecione a camada de cima, "scan", e, em Opacidade, diminua para algo perto de 40%. Isso
signica que todo obeto dentro desta camada car semi-transparente, e assim, poderemos ver enquanto
desenhamos por trs da imagem escaneada.
(Note que sua imagem no cou transparente como a mostrada em B - ainda. Isso porque a
imagem est na camada errada. Para elev-la camada superior selecione o objeto e v no menu
'Camadas>Mudar para a camada acima'.)
Ainda h mais uma coisa. Se a imagem escaneada car por cima, no conseguiremos selecionar
os objetos abaixo dela. Por isso, iremos trav-la, clicando no pequeno cadeado ao lado da camada. Feito
isso, ser impossvel selecionar qualquer objeto naquela camada, e poderemos trabalhar em paz nos
objetos abaixo.
Para trabalharmos na camada de baixo, selecione-a no painel.

Vamos comear. Selecione a ferramenta 'Elipse', esquerda, e desenhe a cabea da personagem.

Voc acaba de criar sua primeira forma, mas para que seja til, vamos mexer nela um pouco.
Abra o painel 'Preenchimento e Contorno' com o atalho 'Control Shift F'. Este painel oferecer
muitas das opes que voc mais usar no Inkscape.
Na primeira aba, 'Preenchimento' [imagem B], voc poder mudar a cor da reas da imagem (seu
preenchimento). Tente.
Na segunda aba, 'Cor do contorno' [imagem C], voc poder trocar a cor do contorno da imagem.
Todo objeto vetorial ter um preenchimento e um contorno, mesmo que voc no possa v-los. Se seu
crculo no tem um contorno, selecione-o, segure o 'Shift' e clique em alguma das cores da paleta na parte
inferior da janela. Tente alterar as cores de Trao.
A Terceira Aba, 'Contorno' [imagem D], permitir que voc altere vrias carctersticas do trao.
Neste tutorial, ns apenas alteraremos o primeiro campo, Espessura.

Para comearmos a trabalhar, precisamos que os objetos quem transparentes e sem contornos.
Assim poderemos ver objetos escondidos e teremos preciso.
V a paleta de cores na parte inferior [imagens A e B]? um atalho para mudar as cores de
preenchimento e trao.
Selecione o crculo e clique em uma cor escolha, e voc dever mudar a cor de seu
preenchimento.
Selecione o crculo, segure o 'Shift' e clique sobre uma cor, e voc dever mudar a cor de seu
contorno.
Se voc quiser remover um preenchimento ou trao, selecione o objeto e clique (ou 'Shift clique')
no quadrado mais a squerda da paleta - o que cortado por um X. Este quadrado representa
transparncia.
Deixe o crculo com uma cor qualquer e retire seu contorno.
Agora, mantendo o crculo selecionado, v ao painel de 'Preenchimento e Contorno' [imagem C].
Diminua a Opacidade do objeto para cerca de 40% - isso o deixar semi-transparente e nos permitir
trabalhar mais facilmente.

Ao trabalhar com Inkscape, voc ir constantemente desenhar guras simples (quase sempre

retngulos), e em seguida deform-las para que adquiram a forma desejada.

Na imagem A, acima, esto destacadas duas ferramentas.
A primeira, o 'Seletor', usado para selecionar e mover objetos. A segunda, 'Editor de ns',
usada para deform-los.
Desenhe um retngulo para que o moldemos na forma do capuz da Assassina.
Se voc selecionar o 'editor de ns' (a segunda ferramenta) e mover os ns do retngulo, ver que
o nico resultado que suas quinas caro arredondadas [imagem A]! Isso acontece com as formas padro
da barra de ferramentas (crculos, retngulos, polgonos, textos) porque elas so Objetos especiais, que
podem ser deformados de formas pr-defenidas. Isso pode ser til mais tarde, mas por enquanto no o
que queremos.
O Inkscape chama as formas editveis de Caminhos, e como ns queremos editar o Retngulo,
teremos que convert-lo em um caminho. Para isso, selecione-o e clique em 'Caminho>Converter em
caminho'. Ou, de preferncia, use o atalho 'Control Shift C'.
Tente agora usar a ferramenta de edio, e veja que poder mover os ns, editando as formas dos
caminhos.
(Para economizar seu tempo, o Inkscape memoriza o raio dos cantos dos retngulos, e os
prximos retngulos que desenhar utilizaro o mesmo raio. Para que seus novos retngulos parem de vir
arredondados, basta usar a ferramenta de edio para devolver a quina a de um retngulo).

Agora devemos deformar o retngulo para que assuma a forma do capuz. Cada caminho
composto por vrios Ns (os vrtices das formas), como voc pode ver enquanto estiver utilizando o 'editor
de ns'.
Para criar um novo n, basta clicar duas vezes em uma aresta do caminho. Utilize quantos ns
forem necessrios para desenhar o capuz.
Voc precisar, no entanto, de curvas para faz-lo. Para consegu-las basta clicar e segurar sobre
um dos lados da forma, e arrast-lo. A linha reta se curvar e voc ver duas alas com as quais voc
poder editar melhor a curva [Imagem A].
Todo n pode ser ou 'cspide' ou 'suave', opes mostradas na Imagem C, e voc pode
transformar um n de um para outro. Ns cspides permite ngulos, enquanto ns suaves garantiro a
continuidade das retas.
A imagem D mostra o que acontece se voc mover um n cspide: ele se liga aos vizinhos por
linhas retas.
A imagem E mostra o que acontece se voc mover um n suave: ele se liga aos vizinhos por linhas
suaves e sinuosas. Dessa maneira possvel modelar formas orgnicas e arredondadas da nossa assassina.

A imagem A mostra o capuz j modelado, mas voc no precisa desanimar se seu capuz deixa a
desejar. preciso alguma experincia para fazer um bom desenho, e todos ns temos diculdade no incio.
Continue o tutorial e voc estar perito em pouco tempo.
Crie um novo retngulo, transforme-o em caminho com 'Control Shift C' e molde-o na forma de
uma tiara [imagens B e C].
Crie um novo retngulo, tranforme-o em caminho e molde-o na forma do cabelo [imagens D e E].
Agora uma boa hora para dizer que seu desenho obedecer, o mximo possvel, o padro de
profundidade da imagem. Isso quer dizer que a tiara car sobre o capuz, que car sobre o cabelo, que
car sobre a pele. Por isso a parte de cima do cabelo, que car sob o capuz, no precisa ser modelado.
(O motivo para mantermos essa ordem que facilitar as coisas quando formos criar sombras e
reexos. Quando voc tiver mais experincia, poder ignorar esse conselho e lidar com objetos que
desaam a ordem. Mas por enquanto, tentaremos obedec-la).

Ns continuaremos utilizando em diferentes partes do rosto o mesmo processo j visto: desenhe

um retngulo, transforme-o em caminho e modele-o usando a ferramente 'editor de ns'.
As imagens A e B mostram o desenho da parte posterior do capuz, que car atrs do rosto. As
imagens B e C mostram o desenho do contorno do olho, e D e E mostram o desenho do olho. A imagem F
retrata o segundo olho e G mostra a costura do capuz.

Agora faremos a linha da costura do capuz. Como j falamos, todos os Caminhos tero (ou
podero ter) uma linha de contorno. Ns usaremos a ferramenta 'caneta bzier', mostrada na Imagem A,
para desenhar diretamente um contorno (trao).
Clique na 'caneta bzier' e depois d dois cliques separados na tela, e voce ter formado uma reta
[imagem B]. Continue clicando e voc formar uma reta contnua formada por vrios segmentos [imagem
C]. Para encerrar a 'caneta bzier', clique com o boto direito.
Como mostrado nas Imagens D e E, voc poder editar a espessura e caractersticas do contorno
no painel de 'Preenchimento e Contorno' (acessvel por 'Control Shift F').

Use a ferramenta 'caneta bzier' para traar a linha da costura do capuz, e modele-a atravs da
ferramenta 'editor de ns'.
Abra o painel 'Gerenciador de camadas' ('Control Shift L') e clique no pequeno olho ao lado da
camada superior, ocultando-a [Imagem B]. Depois, selecione todos os objetos que desenhou e abra o painel
de' Preenchimento e Contorno' ('Control Shift F'). V em Opacidade e coloque 100%, de modo que nada
que transparente [Imagem D].
Sua imagem deve se parecer com a Imagem E.

Agora hora de posicionar os objetos. Use as teclas 'Page Up' e 'Page Down' para mov-los em
profundidade, de modo a determinar qual estar por cima e qual estar por baixo. As teclas 'Home' e 'End'
movero o objeto selecionado ao topo ou ao fundo, respectivamente. (Mas note que estas teclas s
ordenaro objetos dentro de uma mesma camada.)
A ordem dos objetos deve ser: parte de trs do capuz, pele, contornos dos olhos, olhos, cabelo,
capuz, linha do capuz, costuras do capuz e tiara [imagem A].
Depois, use o painel de Preenchimento e Trao ('Control Shift F') para alterar as cores dos
objetos. [Imagens B e C].

Aps isso, hora de adicionar os contornos. Selecione os objetos, depois segure o 'Shift' e clique
na cor que desejar da paleta inferior [Imagem A].
Depois v no painel de 'Preenchimento e Contorno' ('Control Shift C') e, na terceira aba,
'Contorno', aumente a espessura das linhas [Imagens B e C].
Ao adicionar contornos, no os deixe todos com a mesma espessura! Contraste o que d
dinamismo a um desenho, e voc ter uma arte muito mais dinmica e interessante se variar as espessuras
dos traos: quanto mais importante e quanto mais na frente o objeto, maior a espessura de seu trao.
Tambm interessante marcar a silhueta com contornos mais espessos.
Quando terminar, conra o resultado abrindo o painel 'Gerenciador de camadas' ('Control Shift
L'). Torne a camada superior visvel [Imagens D e E].

Voc agora est pronto para continuar o desenho do corpo da Assassina com as ferramentas que
j conhece.
Mas h ainda uma ltima dica. A Imagem A mostra um detalhe da linha do casaco da Assassina
que no pode ser feito com o contorno do caminho. Esse tipo de detalhe pode ser resolvido de vrias
maneiras, mas a mais fcil trat-lo como a outras partes do desenho: faa um retngulo, converta-o em
caminho e deforme-o conforme a imagem. Depois pinte-o com a mesma cor do contorno do casaco. Como a
imagem C mostra, voc ir se deparar com esse tipo de detalhe constantemente.

Agora compare seu desenho com a imagem escaneada, e veja quo longe voc chegou com
comandos simples de Inkscape.
Voc est de parabns por chegar at aqui, mas este no o m. A Assassina est vetorizada e
colorida, mas ainda no parece prossional. Na segunda parte deste tutorial, vamos mostrar como deix-la
mais interessante atravs do uso de sombras.

1 Comment

ndvo

Recommend 1

Login

Sort by Best

Share

Join the discussion

Anderson Rodrigues 2 years ago

Excelente artigo... parabns...

Reply Share

ALSO ON NDVO

O Problema Dos Softwares

Proprietrios

importar arquivo grande com

phpmyadmin

1 comment 3 years ago

1 comment 3 years ago

Aurelino ferreira de arruda que o

Fernanda Moribayashi Obrigada pela

windows est lanando o windows 10 - o

linux - tambm tem um softwer - ambos

dica.Caso esteja usando MAMP crie o

diretrio de upload em MAMP\bin

Problema no Fstab
2 comments 3 years ago

Nelson Vlw. Qualquer coisa estamos

a.

como copiar renomear e mover

arquivos
3 comments 3 years ago

Nelson Valeu pela lembrana

Lucas.Normalmente ns chamamos algo

de "mover" somente quando alm de

Public Domain
All content is published under the Public Domain.
You may use it as you please for any purpose regardless of permissions or references.