Imagem Vetorial

Diferenças entre Imagens Vetor e Bitmap

vetor - vector - vetorizado - vetorização - vetorizando - bitmap - raster - rasterização - rasterizado

Este artigo tem caráter informativo, o acesso é gratuito, e é parte integrante do Curso de Design Gráfico Online e do Curso de Web Design Online da CiaByte. Para treinamento em competências e habilidades, se você ainda não é nosso aluno, recomendamos um dos nossos cursos interativos online, com suporte e orientação de professores (não gratuitos). Os valores são acessíveis e o retorno é VOCÊ profissionalizado(a) e certificado(a).

 

Imagem Vetorial

 

Imagem Vetorial x Imagem Bitmap (Raster)

Para você compreender as diferenças entre imagens vetoriais e imagens bitmaps, vamos transportar você à escola...
Lembra-se de quando você estudou ciências na escola, e lhe foi apresentado o átomo? Na verdade, você via um átomo, tampouco ele é de fato como foi descrito. Por outro lado, foi apresentado um modelo, um "faz de conta" que, apesar de não ser o átomo de verdade, permitiu que você compreendesse e pudesse trabalhar com átomos. De modo análogo, explicaremos a diferença entre imagens vetoriais e imagens bitmap, e programas que trabalham com imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade absoluta (você precisaria de um bocado de matemática), mas demonstra claramente a diferença entre os dois sistemas.

 

 

Imagem vetorial

Como na física, onde um vetor é uma entidade definida pelos atributos direção, módulo e sentido, podemos dizer que, na comunicação visual, os vetores (imagens vetoriais) são objetos definidos, também, por seus atributos.
Assim, de modo simplificado, o objeto abaixo (imagem vetorial) poderia ser definido da seguinte maneira:

Vetor - imagem vetorial a partir da fórmula de uma circunferência com 1 cm

Observe que, para guardar esse círculo, não precisamos gravar a imagem propriamente dita, que seriam os pixels (gastaria muita memória).
Se guardarmos os atributos, como "Circunferência", preenchida de "amarelo", contornada por "azul" e com raio de "1 cm", qualquer computador poderia reproduzi-la! Esta é a principal característica de uma imagem vetorial.

Cada vez que o Illustrator (ou outro software vetorial como CorelDRAW, ou o PowerPoint, por exemplo) for carregar uma imagem vetorial, ele lerá, do disco, os atributos e REDESENHARÁ a imagem, claro, obtendo uma idêntica à original!

Ainda, pensando nessa linha, se decidíssemos aumentar o raio para 3 cm, apesar de gastarmos mais espaço de tela, não gastaríamos mais espaço no disco. Afinal, o círculo (os pixels que o compõem) não será gravado no disco. Apenas os atributos!

 

Vetor - imagem vetorial a partir da fórmula de uma circunferência com 3 cm

 

Imagem Bitmap ou Imagem Raster (Mapa de Bits)

Uma fotografia digitalizada é um exemplo claro de imagem bitmap. Dificilmente você terá o mesmo efeito apenas com objetos vetoriais. Por isso, o CorelDRAW (e outros do gênero), que é um programa vetorial, aceita a importação de imagens bitmaps, de modo que você possa criar trabalhos misturando os dois tipos de imagens (bitmap e vetorial).

 

Imagem Bitmap pixel a pixel

 

Você também pode usar essa mistura de tipos na criação de ícones. A imagem vetorial dá mais perfeição ao resultado. Ao final, transformando em bitmap, você poderá criar ícones e favicons.

Claro que o CorelDRAW não trabalha estas imagens do mesmo modo que programas específicos o fazem, como o Corel Photo-Paint, o Photoshop e o próprio Paint do Windows.

Bitmaps são imagens que, apresentadas no monitor, são divididas em pequenos quadradinhos, cada um, com uma cor. Esses quadradinhos chamam-se pixels. Quando se grava na modalidade bitmap, grava-se o conteúdo de cada pixel. Num programa que manipula bitmaps, como o Paint do Windows ou o Photoshop, você pode alterar a cor até mesmo de um único pixel!

Apesar das vantagens para se trabalhar com fotos, ícones, ou outros desenhos, existem algumas desvantagens para os arquivos do tipo bitmap:

 

No redimensionamento do bitmap

O sistema perde quando precisamos redimensionar imagens. Como os pixels não são redimensionáveis, perdemos pixels ao reduzirmos o tamanho da imagem. De modo oposto, ao ampliarmos uma imagem bitmap, são acrescentados pixels (o programa INVENTA os pixels que são acrescentados). Por isso, por mais sofisticada que seja a interpolação de pixels, imagens bitmaps com tamanho alterado não apresentam qualidade muito boa, especialmente, quando ampliamos.

 

No armazenamento em disco

Imagine o quanto se consome de disco, numa circunferência com raio de 30 cm, se tivéssemos que armazená-la conforme o exemplo seguinte:

 

Imagem raster - bitmap - o que é pixel

 

Quadrado da linha 01, coluna 01 = branco
Quadrado da linha 01, coluna 01 = branco
.............................
.............................
Quadrado da linha 18, coluna 12 = azul
Quadrado da linha 18, coluna 12 = amarelo
Quadrado da linha 18, coluna 12 = amarelo
.............................
.............................

 

 

Exemplo de ampliação de uma Imagem Vetorial

 

Imagem vetorial ampliada

 

Observe como fica perfeita a ampliação de uma imagem vetorial. O lápis foi construído (e ampliado) num programa de vetores (CorelDRAW) e não tem o acabamento de uma foto.

 

 

Exemplo de ampliação de uma Imagem Bitmap

 

Imagem Bitmap Ampliada

 

Um bitmap pode conter muito mais detalhes e parecer perfeito. No entanto, ao redimensionarmos, poderemos ter perda de qualidade. Na figura, o lápis menor é um bitmap obtido de um desenho vetorial (original). Ao ampliar a o lápis num programa bitmap, como o Paint, por exemplo, note que a qualidade do resultado vai diminuindo.

 

 

 

 

De Vetor para Bitmap

Como Rasterizar Imagens

 

Imagem Vetorial Rasterizada

 

Chamamos de rasterização ao processo de transformação de uma imagem vetorial em uma imagem bitmap, também conhecida como raster. Neste caso, teremos uma imagem rasterizada.

Em geral, isto é possível importando imagens, originalmente vetoriais, em programas que trabalham com imagens bitmap.

O Photoshop permite esse processo e, provavelmente, você utilizará muitas vezes, como, por exemplo, para apresentar logotipos (usualmente concebidos como vetor) em páginas de internet, como imagem jpg, gif ou png.

Os programas que trabalham com vetores, como o CorelDRAW, o InDesign e o Illustrator, também costumam permitir a exportação para bitmap.

 

Exemplo: a imagem ao lado é uma estilização em linha produzida no Illustrator e, posteriormente, rasterizada, ou seja, transformada em imagem bitmap. Aqui, no formato .png.


 

 

De Bitmap para Vetor

Como Vetorizar Imagens

 

Imagem vetorizada - estilizada

 

Existem aplicativos, como o Vector Magic e o Magnigraph, que vetorizam automaticamente uma imagem bitmap, transformando-a em vetor por um processo conhecido como auto-tracing. Funciona bem, em especial para elementos com contornos bem definidos.

Designers, no entanto, trabalham muito com o que chamamos de vetorização manual. Como que decalcando um desenho (quando você coloca uma transparência sobre a imagem original e desenha uma nova) e utilizando ferramentas adequadas de programas como o Illustrator ou o CorelDRAW, obtém-se uma imagem vetorizada mais perfeita e detalhada. Com este processo, você pode tanto obter uma ilustração realista (onde imagem vetorizada e imagem bitmap parecem idênticas), ou uma simplificação (ilustração estilizada), como o morango da figura.

Uma tarefa comum para designers, é a vetorização de logos antigos, cuja digitalização produziu um bitmap. Transformando o logo antigo em vetor, temos a possibilidade de redimensina-lo sempre com perfeição, além de poder aplica-lo nos mais diversos materiais. Claro, recomenda-se que logos novos sejam concebidos com programas vetoriais (após, é claro, uma série de rafes à mão).

 

Vetor por Observação

Designers também costumam desenhar a partir da observação de um objeto real. Esse desenho pode ser feito com lápis e papel e depois escaneado e vetorizado (Illustrator ou CorelDRAW) ou diretamente desenhado dentro do Illustrator ou CorelDRAW com o auxílio de uma Tablet (pequena mesa digitalizadora).

 

Exemplo: lápis desenhado no InDesign com a ferramenta Pen (sem tablet)

 

Vetor obitdo por observação

 

 

Curso de Design Gráfico e Web

Depoimento de Aluna

Acessar academia de informática