Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que...

92

Transcript of Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que...

Page 1: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade
Page 2: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade
Page 3: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Governador

Vice Governador

Secretária da Educação

Secretário Adjunto

Secretário Executivo

Assessora Institucional do Gabinete da Seduc

Coordenadora da Educação Profissional – SEDUC

Cid Ferreira Gomes

Domingos Gomes de Aguiar Filho

Maria Izolda Cela de Arruda Coelho

Maurício Holanda Maia

Antônio Idilvan de Lima Alencar

Cristiane Carvalho Holanda

Andréa Araújo Rocha

Page 4: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade
Page 5: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

1 Vestuário - Desenho Computadorizado

DESENHO COMPUTADORIZADO

Page 6: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

2 Vestuário - Desenho Computadorizado

1. IMAGEM DIGITAL

2. IMAGEM VETORIAL

3. O QUE É O WEBDESIGN?

4. DESENHO TÉCNICO NO COREL DRAW

ANEXO

BIBLIOGRAFIA

Page 7: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

3 Vestuário - Desenho Computadorizado

1. IMAGEM DIGITAL

Uma imagem digital é a representação de uma imagem bidimensional usando números binários codificados de modo a permitir seu armazenamento, transferência, impressão ou reprodução, e seu processamento por meios eletrônicos. Há dois tipos fundamentais de imagem digital. Uma é do tipo rastreio (raster) e outra do tipo vetorial. Uma imagem digital do tipo raster, ou bitmap, ou ainda matricial, é aquela que em algum momento apresenta uma correspondência bit-a-bit entre os pontos da imagem raster e os pontos da imagem reproduzida na tela de um monitor. A imagem vetorial não é reproduzida necessariamente por aproximação de pontos, antes era destinada a ser reproduzida por plotters de traçagem que reproduziam a imagem por deslocamento de canetas-tinteiro.

Tipicamente, as imagens raster são imagens fotográficas, e as imagens vetoriais são desenhos técnicos de engenharia. Os quadrinhos ilustrados se assemelham em qualidade a imagens raster, mas são impressos em plotters que passaram a imprimir à maneira das impressoras comuns por jato de tinta.

2. 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 Imagem raster

Uma imagem vetorial é redimensionável sem perda de qualidade, já a definição de uma imagem raster é comprometida com a ampliação.

Page 8: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

4 Vestuário - Desenho Computadorizado

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:

Tipo de Curva = Circunferência Raio = 1 cm Preenchimento = amarelo Contorno = azul

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!

Page 9: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

5 Vestuário - Desenho Computadorizado

Tipo de Curva = Circunferência Raio = 3 cm Preenchimento = amarelo Contorno = azul

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).

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

Page 10: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

6 Vestuário - Desenho Computadorizado

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:

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

Page 11: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

7 Vestuário - Desenho Computadorizado

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

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

Page 12: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

8 Vestuário - Desenho Computadorizado

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

Page 13: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

9 Vestuário - Desenho Computadorizado

Como Vetorizar Imagens (ver anexo II)

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 com a ferramenta Pen (sem tablet)

Page 14: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

10 Vestuário - Desenho Computadorizado

Imagem de rastreio e imagem vetorial

Imagem de rastreio

A imagem de rastreio, ou raster, é a representação em duas dimensões de uma imagem como um conjunto finito de pontos definidos por valores numéricos, formando uma matriz matemática ou malha de pontos, onde cada ponto é um pixel.

Tipicamente, cada ponto de uma imagem é decomposto em uma tripla de cores e cada proporção relativa é transformada em valores numéricos que permitem que eles sejam recuperados. No modelo conhecido como RGB, por exemplo, a imagem é decomposta nas cores vermelho, verde e azul, estabelecendo para cada uma dessas cores um valor entre o máximo possível de reprodução daquela cor e o mínimo, ou seja, a ausência total dela. A soma dos três valores resulta num ponto colorido da imagem final.

A primeira imagem digital foi feita por Russell Kirsch, no NBS, agora conhecido como National Institute of Standards and Technology (NIST).

Definição e resolução de imagens de rastreio

A imagem de rastreio tem esse problema ao se aumentar as dimensões da imagem, os pixels vão-se distribuir por uma área maior, logo tornando a imagem mais indefinida. E claro que iremos ter de guardar cada pixel.

A qualidade de uma imagem digital se dará sobre dois aspectos, a quantidade de pixel por polegada (resolução da imagem), e o número de pixels na horizontal e na vertical (tamanho da imagem em centímetros).

Por exemplo: Se uma imagem possui 1.000 pixels x 1.000 pixels, significa dizer que possui um milhão de pixels, ou 1M como é mais comum nas propagandas de máquinas digitais, mas isso não necessariamente quer dizer que está imagem é de alta qualidade, porque ainda falta a relação com a quantidade de pixels por polegada (PPIs) da imagem.(não confundir com DPIs)

Para uma boa definição é preciso que a imagem tenha 300PPIs (pixels per inch, ou, pixels por polegada), isso permite que se faça uma cópia de alta qualidade em papel fotográfico, o tamanho desta cópia (10x15 - 15x18) vai depender de quantos pixels a imagem possui na vertical e quantos na horizontal.

Estrutura

Page 15: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

11 Vestuário - Desenho Computadorizado

A maioria dos formatos de imagens digitais são precedidos por um cabeçalho que contém atributos (dimensões da imagem, tipo de codificação, etc.), seguido dos dados da imagem em si.

Um arquivo de imagem JPEG que é originada por câmeras fotográficas digitais não é um arquivo de imagem na acepção da palavra. A imagem contida no JPEG sofre compressão com perda de dados, ou seja, a imagem original não é recuperável em 100%, o que não ocorre com uma imagem bitmapeada.

O arquivo JPEG acrescenta dados numa região de metadados com informações sobre a data e hora da tomada da foto e, dependendo da câmera, até mesmo sobre o local por onde foi obtida a fotografia. Acrescenta ainda as características físicas da fotografia (sensibilidade ISO, velocidade de obturação, abertura do diafragma, etc) e, mais, contém uma miniatura da imagem para efeito de visualização e catalogação das fotos armazenadas na própria câmera fotográfica.

Formatos de ficheiros de imagem

JPEG - Joint Photographic Experts Group

A extensão em DOS é "JPG". É o formato mais utilizado e conhecido atualmente. Quase todas as câmaras dão esta opção para guardar as imagens. Arquivo muito utilizado na Internet e em multimidia, por ter uma compactação excelente, algo fundamental ao meio, e por suportar até 16.777.216 cores distintas.

TIFF - Tagged Image File Format

Arquivo padrão para impressão industrial (offset, rotogravura, flexogravura); também muito usado como opção nas câmaras fotográficas. É um formato de arquivos que praticamente todos os programas de imagem aceitam. Foi desenvolvido em 1986 pela Aldus e pela Microsoft numa tentativa de criar um padrão para imagens geradas por equipamentos digital. O TIFF é capaz de armazenar imagens true color (24 ou 32 bits) e é um formato muito popular para transporte de imagens do desktop para bureaus, para saídas de scanners e separação de cores. O TIFF permite que imagens sejam comprimidas usando o método LZW e permite salvar campos informativos (caption) dentro do arquivo. No Photoshop, use o comando File Info do menu File para preencher tais campos informativos

GIF - Graphics Interchange Format

Criado para ser usado extensivamente na Internet. Suporta imagens animadas e 256 cores por frame. Foi substituído pelo PNG.

BMP - Windows Bitmap

Page 16: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

12 Vestuário - Desenho Computadorizado

Normalmente usado pelos programas do Microsoft Windows. Não utiliza nenhum algoritmo de compressão, daí esse formato apresentar as fotos com maior tamanho.

SVG - Scalable Vector Graphics

É um formato vetorial, criado e desenvolvido pelo World Wide Web Consortium.

PNG - Portable Network Graphics

É um formato livre de dados utilizado para imagens, que surgiu em 1996 como substituto para o formato GIF, devido ao facto de este último incluir algoritmos patenteados. Suporta canal alfa, não tem limitação da profundidade de cores, alta compressão (regulável). Permite comprimir as imagens sem perda de qualidade, ao contrário de outros formatos, como o JPG.

PCD - Kodak Photo CD

Este é um formato proprietário lançado pela Kodak, em 1992 como parte um sistema de digitalização e armazenamento de imagens para suprir a demanda no início da popularização das imagens digitais. Dessa forma, um rolo de filme era capturado por um scanner em imagens com 36 bits (12 bits por cor) e transformado em arquivos digitais por uma estação de tratamento chamada Photo Imaging Workstation (PIW). As imagens então são gravadas em um CD usando uma estrutura especial (livro bege), porém compatível com os leitores comuns de CD. O produto não alcançou massa suficiente para se estabelecer no mercado e foi descontinuado pela Kodak. O formato, porém ainda é lido e aceito pelos principais programas de edição de imagens.

DWG - AutoCAD drawing

Arquivos de texto no padrão ASCII utilizados para armazenar dados de programas CAD.

RAW - Família de formatos de arquivo RAW

RAW refere-se à família de formatos de imagem RAW que são originados pela maioria das câmeras digitais profissionais. O formato RAW não é padronizado nem documentado, e difere de fabricante para fabricante.

Visualizadores de imagens digitais

As imagens GIF, JPEG e PNG podem ser vistas simplesmente usando um web browser porque eles são formatos padrões na Internet.

Outros formatos de imagem digital podem ser abertos por visualizadores comerciais que reconhecem uma grande variedade de arquivos de imagem

Page 17: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

13 Vestuário - Desenho Computadorizado

(tanto vetoriais como rastreadas); XnView e o IrfanView são dois visualizadores que disponibilizam versões gratuitas para uso não comercial.

Os formatos RAW em sua maioria são formatos proprietários, não seguindo uma padronização. Sua visualização requer visualizadores fornecidos pelos próprios fabricantes das câmeras que originam o arquivo e que tornam o arquivo RAW públicamente visualizável transformando o arquivo em formato BMP, JPEG, TIFF ou outro, após sua manipulação.

Quais as diferenças entre pixels e vetores?

Conheça um pouco destes elementos utilizados para compor imagens presentes no cotidiano dos designers e usuários.

Em toda criação de imagem, o designer deve sempre estar atento ao tipo de

projeto que está realizando. Em alguns casos é necessário apelar para a

utilização de vetores, em outros os pixels são mais interessantes.

Ainda que seja fácil diferenciar os dois tipos de imagens, entender como cada

uma é composta não é tão simples. A partir dessa premissa, decidimos montar

um artigo para detalhar um pouco de cada método e mostrar quando é mais

interessante usar um ou outro.

Conheça a imagem bitmap

Se você já usa o computador há algum tempo, deve ter notado que existem

muitos formatos de imagem. Entre elas estão os famosos JPEG, o PNG e o

GIF. Os usuários do Windows ainda são familiarizados com o formato BMP

(apelidado de bitmap por alguns).

Acontece que imagem bitmap não é apenas aquela com extensão BMP. Os

formatos supracitados também são classificados com imagens bitmap, contudo

eles recebem nomes diferentes por contarem com um método de compressão

(por isso esses formatos apresentam tamanho reduzido).

Page 18: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

14 Vestuário - Desenho Computadorizado

Nota: exemplo de imagem bitmap compactada no formato JPEG

A tradução de bitmap (termo inglês) é algo como mapa de bits, o que

representa extrema semelhança com a forma como a imagem bitmap é

composta. Basicamente esse tipo de imagem tem sua estrutura formada por

pixels.

Os pixels em todos os lugares

Com certeza você já viu, ouviu e leu essa palavra em muitos lugares. Nos

computadores os pixels são usados para definir o “tamanho” (dimensões para ser mais exato) das imagens. Nas câmeras digitais, eles são úteis para indicar

o “nível de qualidade”.

Apesar de ser extremamente útil para tais tarefas, o pixel tem sua

fundamentação na composição das imagens, por isso você sempre o vê

relacionado com algum tipo de arquivo visual. Mas afinal, o que é o pixel?

O termo pixel tem origem do inglês, sendo composto pelas palavras picture

(imagem) e element (elemento). O pixel é a menor parte de uma imagem

bitmap e ele pode ser visualizado graças à informação de cor que guarda.

Page 19: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

15 Vestuário - Desenho Computadorizado

Fonte: Wikimedia Commons

Um pixel pode ser preto, monocromático ou colorido, sendo que o padrão para

os pixels com cor é o formato RGB (o mesmo usado nos monitores). Aí é que

está a facilidade da imagem bitmap. Este é um dos motivos pelo qual ela é

adotada na web e em quase todos os segmentos.

Sendo assim, fica claro que o pixel não é apenas a parte fundamental da

imagem bitmap, mas a junção de diversos pixels é que forma esse tipo de

imagem. Vale lembrar que os arquivos compostos por pixels são muito

utilizados, principalmente porque são ideais para manipulação em programas

de edição (como o Adobe Photoshop).

E qual o defeito dos pixels? O problema é que o pixel é um pequeno quadrado

e tem dimensões físicas, o que gera um problema na hora de aplicar zoom ou

redimensionar a imagem.

Page 20: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

16 Vestuário - Desenho Computadorizado

Para aplicações nas quais é necessário qualidade, os utilizadores devem usar

imagens com altura e largura astronômicas. Assim existem mais pixels em

cada centímetro e torna-se possível realizar impressões e outras tarefas em

tamanhos grandes.

O vetor é perfeito

Enquanto a imagem bitmap está diretamente atrelada a um pequeno quadrado

(o pixel), a vetorização parte para um caminho bem diferente. Com os vetores

podemos representar linhas, pontos, curvas, polígonos e outros elementos

básicos da geometria.

Tudo bem, mas com os pixels também é possível fazer linhas, polígonos e

outros elementos matemáticos, não é? Sim, é perfeitamente possível, mas a

diferença está no modo de composição.

Page 21: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

17 Vestuário - Desenho Computadorizado

Fonte: Wikimedia Commons

Por exemplo: uma curva que faça parte de uma imagem bitmap será composta

por pixels, o que significa que ela é o agrupamento de pequenos quadrados,

que dão a ilusão de perfeição quando vistos à distância.

Com os vetores temos uma curva em sua complexidade total e em seu real

conceito. Uma curva não pode ter defeitos e somente com a vetorização

atingimos tal perfeição. Acontece que os vetores não são pequenos quadrados,

mas são fórmulas matemáticas interpretadas pelos programas, que quando

devidamente calculadas serão transformadas em elementos visuais.

Page 22: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

18 Vestuário - Desenho Computadorizado

Page 23: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

19 Vestuário - Desenho Computadorizado

Detalhe: a curva acima é conhecida como curva de Bézier e é muito utilizada

em programas vetoriais.

E qual o defeito do vetor? Obviamente o vetor não é perfeito. Apesar de ser o

que existe de melhor para a criação de imagens, o vetor tem seu problema na

hora da manipulação. Ao contrário dos pixels que sofrem alterações com

facilidade e são todos agrupados, cada vetor possui propriedades próprias.

Apesar de existir a possibilidade de agrupar vetores, nada vai transformá-los

em pequenos quadrados que sofrerão modificações conforme a cor em cada

região (ao menos isso não ocorre enquanto eles são vetores).

Qual a principal vantagem? Utilizar um aplicativo de vetorização (como o

CorelDRAW) é a ideia mais interessante para a criação de qualquer imagem.

Ao desenhar com vetores é possível alcançar a perfeição das formas e modelar

conforme for preciso.

Page 24: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

20 Vestuário - Desenho Computadorizado

Detalhe: caso você salve a imagem acima no seu PC e decida ampliá-la,

notará distorções, pois o formato atual dela é JPG, visto que foi convertida para

a web.

Os vetores não sofrem alterações quando redimensionados (esticados) e o

zoom aplicado em imagens de vetores não distorcem as delimitações de cada

vetor. Sendo assim, os designers aproveitam o vetor para criar logomarcas,

para desenhos diversos e para ampliação de imagens (até mesmo as bitmaps)

já existentes.

É possível transformar pixel em vetor? E o contrário?

Sim. É perfeitamente possível realizar qualquer uma dessas transformações.

Os aplicativos de vetorização possuem sistemas avançados para rastrear os

pixels e criar vetores automáticos a partir de imagens bitmaps. Apesar de isso

nem sempre resultar em vetores perfeitos, alguns utilizadores aproveitam o

recurso para economizar tempo.

Page 25: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

21 Vestuário - Desenho Computadorizado

Fonte: Wikimedia Commons

O processo contrário também pode ser realizado no programa de vetorização.

Assim que você termina seu desenho vetorial, pode utilizar uma ferramenta

para exportar a imagem para uma imagem composta por pixels.

Os aplicativos conseguem salvar nos mais diversos formatos e o usuário pode

definir as dimensões que deseja (afinal, os vetores podem ser ampliados e

nunca perdem a qualidade) para sua imagem bitmap.

3. O QUE É O WEBDESIGN?

Dessa maneira, pode-se encaixar o webdesign dentro do design gráfico, uma vez que trabalha com a criação de projetos e desenvolvimento de interfaces gráficas de acordo com um briefing passado pelo cliente. De maneira geral, o webdesigner deve estar preparado para criar projetos, layouts, banners e até mesmo alguns scripts e ajustes na estrutura do produto web no qual ele estiver trabalhando. O trabalho do webdesigner não se resume a criar apenas as interfaces. Muitos deles podem desenvolver aplicações web, afinal, muito do webdesign passa por linguagens de marcação e programação. Entretanto, é importante não confundir as atribuições desses profissionais com as dos desenvolvedores web. Os webdesigners têm como maior preocupação desenvolver uma interface sólida que garanta o perfeito entendimento do conteúdo e a qualidade de navegação. Os focos são bastante diferenciados, porém nada impede ambos de acumularem as funções.

Page 26: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

22 Vestuário - Desenho Computadorizado

Quais programas eles usam? Para ser um bom webdesigner você precisa saber linguagens de marcação como HTML, XML, XHTML, linguagens de folhas de estilo (CSS, XSL), assim como algumas formas de script como JavaScript, PHP e ASP. Não é necessário saber as essências dessas linguagens, porém é bom tê-las bem trabalhadas para casos em que o projeto envolva fazer alterações estruturais em templates e outros usos. Já que haverá a necessidade de saber usar PHP e ASP, é importante saber como trabalhar com bancos de dados MySQL e PostgreSQL.

Em termos de software, o webdesigner irá utilizar técnicas do design aplicadas em softwares como o Adobe Photoshop, Illustrator e Fireworks para gerar imagens; Adobe Dreamweaver para trabalhar com CSS e linguagens de marcação; e Corel Draw para trabalhar com imagens em vetor. Esses programas oferecem precisão e facilidade para a compreensão de ferramentas, filtros e controles que garantem um bom aproveitamento da técnica aprendida na faculdade. Contudo, existem alternativas gratuitas aos editores de imagem, como por exemplo o GIMP. Alguns sites exigem animações interativas; para isso, o Adobe Flash é uma das ferramentas chave!

Entretanto, ao contrário do que algumas pessoas podem pensar, o webdesigner é um dos profissionais que mais precisa estar atualizado. O mercado de trabalho para estes especialistas é abrangente e requer estudo das teorias de cores, formas, além de noções de fotografia, história da arte e até mesmo marketing. Afinal é preciso conhecer muito bem o público que irá acessar aquele site ou aplicativo para poder adequar o design para as características que agrada a eles. Áreas de atuação

Page 27: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

23 Vestuário - Desenho Computadorizado

As áreas de atuação são bastante variadas. Basta que a empresa possua um setor de web para que esse profissional seja requisitado. Além disso, o webdesigner pode atuar como profissional autônomo ou freelancer, de modo que seus projetos serão independentes de uma empresa, porém dependem da vontade dos clientes. Dessa forma, o projeto de webdesign passa pelas seguintes etapas:

Análise de contexto Propósito Análise de público Adequação ao conteúdo Compatibilidade e restrições (navegadores, fontes etc)

Todos esses pontos estão interligados de uma maneira bastante forte. Inicialmente é fundamental levantar todas as informações inerentes ao público-alvo e as diretrizes de comunicação que melhor o atendem. Em seguida é definida a estrutura do site e as tecnologias que serão empregadas para viabilizar o desenvolvimento do projeto. Um dos aspectos a ser considerado é que, por ser uma mídia em constante mudança, a web exige especial atenção no que se refere a resolução, navegadores e padrões de linguagem. Segue-se então a etapa de criação da interface, montagem dos HTMLs, folhas de estilo e demais recursos, seguida pela fase da implementação do projeto e execução de testes. Assim, se você quer ser webdesigner, deve saber que é preciso trabalhar com um resumo daquilo que o projeto deverá conter. A partir daí, é preciso fazer uma série de análises, testes e estudos a respeito das cores utilizadas, fontes, formas e vários outros aspectos.

Essa dedicação se faz bastante

Page 28: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

24 Vestuário - Desenho Computadorizado

necessária nos últimos tempos, afinal as convergências tecnológicas vêm exigindo uma flexibilidade tanto das linguagens de programação, quanto da interface que acompanha este sistema. Por isso, depois de ter analisado o mercado e observado que as palavras de ordem são flexibilidade, disposição e conhecimento é possível fazer quase qualquer tipo de trabalho para o qual você seja designado. De nada adianta pensar em plataformas e não aplicar formas de torná-las integradas e participativas.

Como está o mercado de trabalho?

Atualmente, o webdesigner deve saber atuar em meios bastante variados, afinal em pouco tempo a internet deixará de ser exclusividade de computadores. A entrada de smartphones no mercado fez com que o usuário tenha a web próxima a ele não importa onde esteja. Dessa mesma forma, o webdesigner deverá ser um profissional pronto para aprender novas linguagens e absorver novas tendências. Do contrário, o estilo e as criações ficam obsoletos, afastando este profissional do mercado. Por isso, a adaptação às várias mídias é praticamente a nova lei aos webdesigners. Em termos de rotina de trabalho, a demanda depende bastante do lugar em que o webdesigner trabalha. Porém, o mercado tem sido ameaçado pelo que os designers chamam de “sobrinhos”. Esses “sobrinhos” nada mais são do que um usuário que até possui alguns conhecimentos de utilização de software e que começam a fazer sites para amigos e familiares. Mais tarde eles passam a fazer parte de uma parcela “não especializada”, que consegue roubar clientes dos designers profissionais por oferecerem um preço menor.

Page 29: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

25 Vestuário - Desenho Computadorizado

Contudo, a prática dos amadores fica em um nível em que o cliente também não exige um produto exatamente profissional. Mas ainda assim os “sobrinhos” são concorrentes. Porém, quando se trata de empregos em agências multidisciplinares - que abordam a comunicação de uma maneira completa com especialistas em web, rádio, televisão, redação e marketing - os webdesigners têm um bom momento para conseguir um lugar ao sol. A média nacional de salários pagos a webdesigners fica em torno de R$ 1.100,00 para um webdesigner pleno. Os valores pagos a um profissional nível “master" pode chegar a R$ 1.417,00, de acordo com o Banco Nacional de Empregos. Contudo, dependendo do projeto a ser realizado, o profissional pode chegar a receber mais que o dobro desses valores, caso o cliente peça interfaces elaboradas e vários recursos. Por isso, sempre existe a alternativa de trabalhar de maneira independente, com projetos isolados.

Se você deseja se tornar um webdesigner, já tem algumas dicas de como atuar no mercado e, principalmente, a informação de que não basta apenas saber como operar os softwares. É preciso ter muito estudo e basear-se em fundamentos como cores, texturas, ponto e linha, coisa que os “sobrinhos” normalmente não têm. Por isso, se você quer se tornar um webdesigner, é importante ter a formação exigida.

4. DESENHO TÉCNICO NO COREL DRAW INTRODUÇ Ã O À S FERRAMENTAS DO PROGRAMA COREL DRAW

Page 30: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

26 Vestuário - Desenho Computadorizado

INTRODUÇ ÃO O Corel Draw é um programa de design gráfico pertencente a Corel. O Corel Draw é um aplicativo de ilustração e layout de página que possibilita a criação e a manipulação de vários produtos, como por exemplo: desenhos artísticos, publicitários; logotipos; capas de revistas, livros, CDs; imagens de objetos para aplicação nas páginas de Internet, botões, ícones, animações gráficas, etc. TELA DE APRESENTAÇÃO Quando o Corel Draw for carregado pela primeira vez, aparecerá a tela de boas-vindas que poderá ser oculta no próximo carregamento, bastando para isto, desmarcar a caixa de verificação Exibir esta Tela Bem-vindo ao iniciar, em seguida, clique sobre o ícone Novo gráfico, para iniciarmos o nosso estudo.

Page 31: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

27 Vestuário - Desenho Computadorizado

DESENHANDO FIGURAS SIMPLES Fazer um desenho a mão livre no Corel Draw é tão difícil quanto fazer um desenho utilizando lápis e papel, mas tirando os desenhos de forma livre, o Corel Draw apresenta diversos recursos que estão ao alcance de todos. Abaixo encontramos a barra de ferramentas para desenhos com diversos botões e suas respectivas funções. Em seguida, utilizaremos algum as ferramentas para criarmos figuras simples.

Page 32: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

28 Vestuário - Desenho Computadorizado

Selecione a Ferramenta Mão Livre - dê um clique sobre o botão esquerdo do mouse. Arraste o ponteiro sobre a página para traçar uma linha, em seguida, solte o botão. Para obter linhas retas, dê um clique na posição inicial, logo após, leve o ponteiro até a posição final e dê outro clique ou, mantenha a tecla Ctrl pressionada para obter traços retos a cada 15 graus. Trace algumas linhas retas e curvas para se familiarizar com esta ferramenta. Verifique o botão, que representa a Ferramenta Mão Livre , ele exibe um pequeno triângulo no canto inferior direito. Ao dar um cliq ue sobre este triângulo, é exibida uma barra com outras ferramentas, esta barra é conhecida como menu desdobrável.

Page 33: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

29 Vestuário - Desenho Computadorizado

Linhas Curvas

Linhas Retas

Podemos apagar um ou mais desenhos usando a Ferramenta Seleção . Dê um clique sobre esta ferramenta, em seguida, clique sobre a linha de um desenho para selecioná-lo, e pressione a tecla Delete. Para apagar vários desenhos ao mesmo tempo, arraste o ponteiro de forma a envolver todas as linhas para selecioná-las, em seguida, pressione a tecla Delete.

Alças de Seleção

Desenhando Linhas Curvas No menu desdobrável da ferramenta Mão Livre, selecione a ferramenta Bézier - específica para criação de linhas curvas, e dê um clique em algum ponto da página para marcar o início da linha, clique em outro ponto mantendo pressionado o botão do mouse, neste momento é traçada uma linha, arraste o ponteiro do mouse ao redor deste ponto e

Page 34: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

30 Vestuário - Desenho Computadorizado

verifique a curvatura desta linha - quanto mais você afasta o ponteiro do ponto, maior será a curva. Depois de encontrar a curvatura desejada, solte o botão do mouse e clique em outro ponto, verifique que é mantida a seqüência da curvatura. Para interromper, clique sobre qualquer outra ferramenta. Note que a barra de Propriedades é exibida de acordo com a ferramenta selecionada. Na barra de Propriedades encontraremos recursos para a mudança de estilo, tamanho, giro e espelhamento. Desenhando Figuras Geométricas Nas ferramentas para desenhos, encontramos três ferramentas específicas para a criação de retângulos, elipses e polígonos respectivamente. Selecione a Ferramenta Retângulo , posicione o ponteiro do mouse sobre a página e o arraste para criarmos o retângulo - mantenha a tecla Ctrl pressionada para obter quadrados (mesma altura e largura).

Page 35: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

31 Vestuário - Desenho Computadorizado

Para criar elipses selecione a Ferramenta Elipse, e repita os mesmos procedimentos da ferramenta retângulo. Mantenha a tecla Ctrl pressionada para obter círculos. A Ferramenta Polígono possui três formas predefinidas que são exibidas através do menu desdobrável. Use estas formas para criar polígonos, espirais e grades. As características dos polígonos poderão ser altera das através da Barra de Propriedades. Através dela poderão ser alterados a posição, tam anho, escala, e ângulo do objeto. É possível ainda deslocar o objeto utili zando o recurso espelhamento, diminuir ou aumentar o número de pontas e alternar entre polígono e estrela. Utilizando a Ferramenta Seleção A Ferramenta Seleção permite selecionar um ou mais objetos. Mas com esta ferramenta também podemos mover e redimensionar os objetos. Para movimentar o objeto, basta selecioná-lo e move-lo para a posição desejada. Para alterar o tamanho, utilize os

Page 36: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

32 Vestuário - Desenho Computadorizado

quadrinhos que aparecem ao longo do objeto. Arraste para o interior para diminuir ou exterior para aumentar o objeto. Para selecionar vários objetos de forma aleatória, mantenha a tecla Shift pressionada enquanto clica sobre cada um dos objetos. Desfazer e Refazer Os comandos Desfazer e Refazer podem ser encontrados tanto no menu Editar, quanto na Barra de Ferramentas. A opção Desfazer, volta a última ação enquanto o comando Refazer refaz a última ação desfeita. Para testar estes co mandos, utilize a ferramenta retângulo para criar um objeto. Utilize o comando D esfazer para excluí-lo e em seguida o comando Refazer para desenha-lo de novo. Aplicando Cor aos Objetos Utilize a ferramenta Texto para criar um desenho como o do exemplo abaixo. Selecione o objeto que será colorido e, napaleta de cores clique sobre a cor de preenchimento desejada utilizando o botão esquerdo do mouse. Para selecionar a cor de contorno clique sobre a cor desejada na paleta de cores utilizando o botão direito do mouse. Dessa forma podemos concluir que o botão esquerdo d o mouse escolhe a cor de preenchimento e o botão direito escolhe a cor de co ntorno. Podemos escolher a cor vizinha de uma determinada cor mantendo o mouse pressionado por alguns segundos sobre a cor na paleta de cores. Será exibido um quadro com as variações da cor escolhida.

Page 37: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

33 Vestuário - Desenho Computadorizado

Outro recurso que podemos utilizar através da paleta de cores é amistura de cores que pode ser utilizado de forma interativa. Para utiliza-la, selecione um objeto que já esteja preenchido (tem que estar preenchido), em seguida, mantendo a tecla Ctrl pressionada clique sobre outra cor que fará a mistura com a existente no preenchimento do objeto. Você poderá repetir este procedimento com outras cores até chegar a cor desejada. Ferramenta Zoom Nós podemos utilizar a ferramenta zoom para ampliar ou reduzir o tamanho que o desenho é exibido na tela. Isto é útil para facilitar a criação de desenhos complexos ou obter uma visão geral da página. Quando selecionamos esta ferramenta o ponteiro do mouse passa para o formato de uma lupa. Um clique com o botão esquerdo amplia o desen ho na posição do ponteiro. Para reduzir ao tamanho anterior clique sobre o botão Reduzir na barra de Propriedades.

Page 38: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

34 Vestuário - Desenho Computadorizado

GRAVANDO, FECHANDO E ABRINDO UM DOCUMENTO Salvando o Documento Lembre-se de salvar seus arquivos se desejar trabalhar neles mais tarde ou simplesmente mantê-los. Ao utilizar o comandoSalvar, é possível salvar um desenho com um nome de arquivo já existente. Utilizando o comandoSalvar como, é possível especificar um novo nome de arquivo e um local no qual armazenar o arquivo. Dando um nome diferente ao arquivo quando for salvá-lo, você cria uma cópia do desenho já existente enquanto mantém o original intacto. O arquivo original é fechado deixando a nova cópia aberta. Para salvar um arquivo que ainda não foi salvo esco lha a opção Salvar no menu Arquivo, na caixa de diálogoSalvar Desenho forneça o um nome para o arquivo e o local onde el e será salvo em seguida pressioneSalvar.

Page 39: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

35 Vestuário - Desenho Computadorizado

Fechando e Abrindo um Documento Para fechar um arquivo que já foi salvo anteriormente, selecione a opção Fechar do menu Arquivo. Para iniciar um novo documento a partir do zero, selecione a opção N ovo no menu Arquivo ou clique sobre o botão Novo na barra de ferramentas. Uma página em branco será exibida para o início do trabalho. Para abrir um arquivo que já foi salvo anteriormente, selecione a opção Abrir no menu Arquivo ou clique sobre o botão Abrir na barra de ferramentas. Na caixa de diálogo Abrir Desenho que aparecerá, selecione o arquivo que será aberto pressione o botão Abrir. CONFIGURANDO E IMPRIMINDO PÁGINAS Configurando Páginas Toda a vez que um novo gráfico (documento) é iniciado é exibida uma pagina em branco baseada em um layout padrão. As configurações da pá gina tais como, dimensão, orientação e cor já estão predefinidas. As configurações de layout podem ser alteradas facilmente e as modificações serão aplicadas a toda s as páginas. Para alterar as configurações da página, selecione a opção Configurar páginano menu Layout, ou dê um duplo clique na borda da página. A caixade diálogo Opções oferece uma variedade de configurações que poderemos utiliz ar para escolher o tipo de página mais adequado.

Page 40: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

36 Vestuário - Desenho Computadorizado

O layout da página também poderá ser alterado através da barra dePropriedades, nela encontram-se recursos para alterar o tamanho da página, tipo de papel, largura, altura e orientação. Utilizando o menu Layout, você poderá acrescentar ou excluir páginas. As ginaspá acrescentadas terão o mesmo layout da página atual. Para inserir uma ou mais páginas, selecione a opção Inserir páginado menu Layout. Na caixa de diálogo exibido, entre com a quantidade depáginas a inserir e a posição (antes ou após a página atual). Outra forma de inserir páginas é através dos botõesde controle de página, como pode ser visto na figura abaixo.

Page 41: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

37 Vestuário - Desenho Computadorizado

Para excluir uma ou mais páginas, use a opção Excluir páginado menu Layout. Na caixa de diálogoExcluir que aparecerá indique a página ou intervalo de páginas que serão excluídas. Obs.: Todos os objetos pertencentes a uma página excluída, serão excluídos junto com ela. Para evitar que os objetos sejam excluídos junto com a página mova-os para fora dos limites da página. Estes objetos estarão disponíveis para todas as páginas. Outra maneira de excluir uma página é através do tãobo direito do mouse acionado sobre a guia da página desejada. O mesmo pode ser feito para alterar o nome das páginas, com mostra a figura.

Page 42: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

38 Vestuário - Desenho Computadorizado

IMPRIMINDO PÁGINAS O Corel Draw imprime as imagens em qualquer impressora instalada no computador. Para imprimir o arquivo, selecione a opção Imprimir do menu Arquivo ou, pressione o botão Imprimir da barra de ferramentas, ambas exibirão a caixa de diálogo Imprimir, na guia Geral escolha a impressora, a quantidade de cópias e o a rquivo que será impresso. Clique em Ok para iniciar a impressão. Para escolher outras opções de impressão, temos as guias Layout, Separações , Pré-impressão e Miscelânea . A guia Layout, por exemplo, pode ser utilizada para alterar o tamanho e a posição da impressão. A opção Imprimir páginas em ladrilho permite imprimir imagens maiores que a página. (em várias páginas) Você pode utilizar a opção Visualizar Impressão para fazer ajustes finais, manualmente e ter uma visualização de como a imagem ficará depois de impressa. Nas outras guias encontraremos opções para Separação de cores , que são recursos utilizados por gráficas para gerar a impressão final. Na guia Pré-impressão temos as opções impressão de Negativo e de forma Espelhada, impressão do Número de páginae Marcas de corte - para estas opções serem impressas, é necessário que o tamanho da página, definida na configuração da impressora, seja maior que a configuração de página do Corel Draw. Na guia Miscelânea , existem opções para, imprimir todas as cores em preto ou tonalidades de cinza, e configuração de pe rfil de cores.

Page 43: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

39 Vestuário - Desenho Computadorizado

DESENHANDO E TRANSFORMANDO Até aqui vimos como criar linhas e figuras geométricas simples. A partir de agora, vamos avançar um pouco mais o nosso estudo e conhecer os diversos recursos aplicados aos desenhos. USANDO A FERRAMENTA FORMA Com a Ferramenta Forma, podemos modificar a aparência das figuras, bastando para isto, arrastar o ponteiro quando estiver sobre um dos nós exibidos no contorno da figura. Desenhe um retângulo utilizando a ferramenta retângulo, em seguida selecione a ferramenta Forma e arraste um dos nós do retângulo em direção ao centro da figura, note que os cantos da figura vão sendo arredondados na mesma proporção. Com a ferramenta Elipse, poderemos obter Fatias arrastando o ponteiro para o interior do círculo, após selecionar o nó. Para criar Arcos, arraste o ponteiro na parte exterior do círculo, após selecionar o nó. Aplicando os recursos da ferramenta Forma sobre um polígono, obteremos uma impressionante quantidade de formas. Arraste um dos nós para o interior, exterior e ao redor da figura para ver o resultado.

Page 44: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

40 Vestuário - Desenho Computadorizado

No menu adjunto da ferramenta Forma, encontraremos mais três ferramentas, aFaca, a Borracha e Transformação Livre . Bem, os nomes das ferramentas estão bem relacionados com o que elas oferecem, use a Faca para cortar um objeto dando um clique em seus nós ou contorno. Para apagar parte de objet os, use a Borracha dando um clique ou arrastando sobre o contorno do objeto. A ferramenta Transformação Livre praticamente permite girar a figura, basta dar um clique num ponto situado em qualquer lugar, e arrastar o ponteiro de forma a obter o efeito desejado.

Page 45: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

41 Vestuário - Desenho Computadorizado

PREENCHIMENTOS E CONTORNOS Preenchimentos Especiais Até aqui nós aprendemos a aplicar cor de preenchimento e contorno nos objetos, utilizando a paleta de cores. Más além destas coresuniformes, o Corel Draw permite que apliquemos diferentes tipos de texturas, degradês,e espessuras de linhas. Para iniciarmos o estudo destes novos tipos de preenchimentos e contornos vamos utilizar um a ferramenta retângulo. Após criar o retângulo clique no menu desdobrável da Ferramenta Preenchimento. Observe que o menu desdobrável daferramenta preenchimento dá acesso a outros tipos de preenchimentos, vamos analisar cada um deles:

- Abre a caixa de diálogo Preenchimento uniforme, onde poderemos definir uma nova cor através de diferentes tipos de paletas decores. Dois dos quatro botões de tipos de paletas, contém um menu desdobrável, para exibi-lo, mantenha pressionado o botão por alguns segundos sobre eles e escolha uma nova variação de padrão de cores, são milhares de combinações possíveis.

Page 46: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

42 Vestuário - Desenho Computadorizado

- Esta ferramenta da acesso a caixa de diálogo Preenchimento Gradiente que permite a escolha de diversas opções para o preenchimento progressivo de cores predefinidas. Faça a combinação que preferir entre estas opções e pressione OK para conferir o resultado.

- Este botão permite a seleção de cores padrão, que podem ser baseadas em um Bitmap (outra imagem), em padrões de duas cores ou totalmente coloridos.

Page 47: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

43 Vestuário - Desenho Computadorizado

- O Corel Draw oferece diferentes tipos de texturas, que poderão ainda ser personalizadas ao seu gosto. Como resultado você terá uma infinidade de combinações de estilos diferentes. Na biblioteca de texturas, selecione um dos vários tipos disponíveis. Caso você altere uma textura clique sobre o botão visualizar para ver o resultado. Os botões que possuem o desenho de um cadeado permitem bloquear e desbloquear um determinado efeito. Um efeito desbloqueado sofre alterações aleatórias que vão interferir na aparência final da textura. A caixa de diálogo Preen. de textura, permite que a textura seja posicionada em ladrilhos, para isso pressione o botão Colocação em ladrilhos. Na nova caixa de diálogo que surge você pode escolher entre as opções de dimensionar, posicionar, girar e inclinar o preenchimento, aumentando ainda mais as possibilidades de utilização. Quando concluir clique em Ok para aplicar o preenchimento.

Page 48: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

44 Vestuário - Desenho Computadorizado

- Este botão da acesso a caixa de diálogo TexturaPostScript (PS), este é um tipo de textura específica para impressoras PostScript, entre tanto, o Corel Draw realiza a conversão desta textura possibilitando a impressão em qualquer tipo de impressora. Como as Texturas PostScript (PS) são muito complexa s, o Corel Draw preenche o objeto com símbolos PS para efeitos de exibição, estes símbolos serão substituídos pela textura no momento da impressão.

- Clique sobre este botão para remover o preenchimento do(s) objeto(s) selecionado(s).

- Este botão dá acesso a cortina de cores. Utilize esta cortina para definir um padrão de cor, arrastando o ponteiro do mouse sobre o quadro de cores.

- Este botão abre a cortina preenchimento especial . A cortina Preenchimento especial, na verdade é uma forma mais prática da aplicação de preenchimentos e oferece os preenchimentos gradiente, padrão e textura que j á foram vistos anteriormente. O botão com o desenho de um conta gotas, serve para copiar para a cortina preenchimento especial o mesmo preenchimento de um determinado objeto.

Page 49: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

45 Vestuário - Desenho Computadorizado

Contornando os Preenchimentos Vimos anteriormente que para mudar a cor de contorno de um objeto, era preciso primeiro selecioná-lo e depois clicar com o botão direito do mouse sobre a cor desejada na paleta de cores. Agora, vamos conhecer outros contornos que podem ser aplicados com a Ferramenta Contorno. Desenhe um retângulo, e em seguida clique no menu desdobrável desta ferramenta. Utilize o menu desdobrável para alterar a espessurado contorno do retângulo. Um clique sobre o botão Caneta de contorno da acesso a caixa de diálogo de mesmo nome. Utilize esta caixa de diálogo para alterar a cor do contorno, escolher um novo estilo de contorno e um dos três tipos de cantos. No caso de o objeto ser uma linha, poderemos escolher o tipo de extremidade e acrescentar setas.

Page 50: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

46 Vestuário - Desenho Computadorizado

COMANDOS INTERATIVOS

Preenchimento Interativo O preenchimento interativo, como o próprio nome já diz, permite que você aplique preenchimento diretamente ao objeto ao mesmo tempo que observa os resultados. Selecione a Ferramenta Preenchimento Interativo na barra de ferramentas, e arraste a seta de preenchimento sobre a área do objeto selecionado, na direção que desejar, para obter o efeito de degradê. Utilize a Barra de Propriedades, para personalizar ainda mais o preenchimento, altere as cores, a intensidade do degradê e o tipo de preenchimento.

Page 51: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

47 Vestuário - Desenho Computadorizado

Transparência Interativa

Esta ferramenta atua de forma parecida com a ferramenta Preenchimento interativo, a diferença é que ela pode ser aplicada tanto sobre objetos desenhados no próprio Corel Draw, quanto em imagens do tipo Bitmap. Os objetos afetados por esta ferramenta tornam-se gradativamente transparentes, utilize as setas de transparência para alterar a direção, e a barra de propriedades para alterar o formato e o tipo de transparência. Ferramenta Mistura Interativa Como o próprio nome já diz esta ferramenta mistura dois objetos deixando entre eles vários objetos intermediários. Para isso é necessário que tenhamos dois objetos, o inicial e o final. No exemplo abaixo o objeto inicial é um retângulo e o final um círculo. Selecione a Ferramenta Mistura Interativa dê o primeiro clique sobre o retângulo e o segundo sobre o círculo. A Ferramenta Distorção Interativa aplica sobre o objeto um efeito de “Empurrar/Puxar”. Clique com esta ferramenta sobre o objeto e arraste os nós para dentro ou para fora até encontrar o efeito desejado. A barra de propriedades oferece ainda mais duas opções, Dente-de-Serra e Turbilhão. De maneira semelhante a Ferramenta Forma, a Ferramenta Envelope Interativa distorce objeto a medida que arrastamos os seus nós .

Page 52: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

48 Vestuário - Desenho Computadorizado

A Ferramenta Extrusão Interativa , cria a ilusão de profundidade dando aos objetos u m aspecto tridimensional. Arraste o ponto de fuga ou o indicador de profundidade para conseguir outros resultados. A Ferramenta Sombra Interativa, como o próprio nome já diz aplica sombra a um objeto. A Barra de Propriedades oferece outras opções para a personalização da sombra, como deslocamento, opacidade e cor. EFEITOS SOBRE O OBJETO Qualquer objeto, tanto os criados pelo Corel Draw como os incorporados de outra fonte, podem ter a aparência modificada através de uma rotação ou distorção realizada com o mouse. A partir de agora, além de aprendermos a aplicar estas modificações, vamos ver como duplicar e organizá-los dentro da página. Girando e Inclinando Objetos Para girar um objeto, primeiro selecione a Ferramenta Seleção na barra de ferramentas. Dê um clique no objeto para selecioná-lo e mais um clique para que apareçam as alças de rotação. Utilize estas alças para girar o objeto até encontrar a posição desejada. O Centro de Rotação que aparece no centro do objeto pode ser movido para qualquer lugar, o objeto será girado em torno deste centro.

Page 53: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

49 Vestuário - Desenho Computadorizado

Para rotacionar o objeto, basta posicionar o ponteiro sobre uma das alças de rotação (ponteiro fica no formato de uma seta circular) e arrastar ao redor do centro de rotação , este centro de rotação poderá ser movido para qualquer ponto do objeto. Para distorcer um objeto o procedimento é o mesmo da rotação, mas ao invés de utilizarmos as alças de rotação vamos utilizar as alças de distorção que poderão ser movidas na horizontal ou vertical. Espelhando Objetos O espelhamento inverte a orientação do objeto tanto na horizontal como na vertical. No menu Organizar escolha o comando Transformar..., Usar escala e espelhar. A cortina Escala e Espelho aparecerá. Utilize esta cortina para escolher entre espelhamento horizontal e vertical.

Page 54: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

50 Vestuário - Desenho Computadorizado

Agrupando e Desagrupando Objetos Os arquivos criados pelo Corel Draw estão no formato vetorial, são elementos gráficos que podem ser editados e alterados. Uma figura vetorial pode ser composta por vários objetos, os objetos podem ser organizados em diversas camadas e depois agrupados para facilitar a sua movimentação. Estes objetos podem depois ser desagrupados transformando-se novamente em vários objetos que podem ser trabalhados independentemente. No exemplo acima podemos desagrupar e separar os objetos que formam o desenho. Depois podemos reagrupá-los novamente para que forme um único objeto. Para desagrupar, selecione o objeto agrupado e na barra de propriedades clique sobre o botão Desagrupar ou, escolha a opção Desagrupar (Ctrl + U) no menu Organizar. Para agrupar, primeiro selecione todos os objetos que serão agrupados, em seguida clique sobre o botão Agrupar na barra de propriedades ou, escolha o comando Agrupar (Ctrl + G) no menu Organizar. Observe que depois que os objetos forem agrupados eles passam a fazer parte de um único objeto, ao clicar sobre um deles, todos serão selecionados. Você pode selecionar um único objeto a partir de objetos agrupados, pressionando e mantendo pressionada a tecla Ctrl enquanto faz a seleção. Duplicar e Clonar O comando Duplicar faz uma cópia idêntica do objeto duplicado e a posiciona logo acima do objeto que a deu origem. Poderíamos alcançar o mesmo resultado copiando e colando o objeto, mas por ser apenas um comando e não mexer com a Área de Transferência o comando Duplicar acaba sendo mais prático e eficiente. Para duplicar um ou mais objetos, basta selecioná-los e, em seguida, pressionar as teclas Ctrl+D ou, escolher o comando Duplicar do menu Editar. Caso o desenho seja composto por vários objetos desagrupados, é recomendado que os agrupe antes de duplicá-los, isto pode evitar confusão em desenhos muito complexos.

Page 55: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

51 Vestuário - Desenho Computadorizado

O Comando Clone é semelhante ao comando Duplicar, a diferença é que um objeto clonado fica vinculado ao objeto que o deu origem, ou seja, qualquer mudança no objeto original é aplicada também ao objeto clonado.

Alinhando e Distribuindo É possível organizar os objetos de forma controlada nos sentidos horizontal e vertical. E ainda distribuí-los ordenadamente, de forma que a distância entre eles seja igual. Para alinhar e distribuir dois ou mais objetos, primeiro selecione-os e depois escolha o comando Alinhar e distribuir... no menu Organizar. Na caixa de diálogoAlinhar e distribuir que aparece, você poderá escolher entre as opçõesde alinhamento, clique na guia Distribuir para definir como os objetos serão distribuídos. Clique no botão Visualizar para ver o resultado e em Ok para finalizar a operação. Faça várias combinações de alinhamento e distribuição até famil iarizar-se bem com estes comandos.

Page 56: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

52 Vestuário - Desenho Computadorizado

Ordenando Objetos Quando você cria um objeto novo ele é posto acima osd outros objetos, talvez seja necessário que ele fique atrás ou entre os outrosbjetos. Para solucionar este problema podemos reordenar os objetos. Para testarmos este comando, crie três desenhos diferentes e sobrepostos, conforme figura a seguir. Em seguida, use os comandos Para a frente, Para trás, Avançar um , Recuar um, Na frente e Atrásdo menu Organizar... Ordenar, para alterar a ordem dos objetos sobre a página. Utilize a ferramentaSeleção para selecionar o objeto que sofrerá a ação do comando. Combinando Objetos A combinação de dois ou mais objetos gera um único objeto, que passará a ter a cor de preenchimento e contorno igual a do último objeto selecionado. Selecione os objetos que serão combinados e escolha o comando Combinar no menu Organizar.

Page 57: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

53 Vestuário - Desenho Computadorizado

Para fazer a operação inversa e separar objetos com binados, escolha o comando Quebrar no menu Organizar. As cores de preenchimento e contorno permanecerão iguais. EDITANDO TEXTO O Corel Draw oferece todos os recursos comuns de criação e edição de textos entre eles podemos destacar alguns recursos especiais que permitem que as letras sejam alteradas independentemente e até combinadas com figuras geométricas. FERRAMENTA TEXTO No Corel Draw encontramos dois tipos de entrada de texto: Texto Artístico e Texto Parágrafo, as duas formas estão disponíveis na barra de Propriedades, após selecionar a ferramenta Texto. O Texto Artístico é um pequeno trecho de texto, que aceita uma quantidade maior de efeitos, o seu tamanho máximo limita-se a 250 caracteres. Para a entrada deste tipo de texto documento, selecionamos a ferramenta apropriada e damos um clique no ponto inicial desejado. O cursor é exibido para você darinício a digitação do texto. Após a digitação, se desejar, poderá expandir ou esticar o texto digitado, arrastando um dos quadradinhos que envolve o texto. Qualquer palavra estranha ao dicionário, será sublinhada em vermelho, mais adiante veremos maiores detalhes.

Page 58: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

54 Vestuário - Desenho Computadorizado

ANEXOS

Anexo I

Tutorial Corel Draw X6 – Criando um anuncio Por Kesio Alex

Antes de criarmos qualquer anuncio, devemos traçar o perfil do público leitor do veículo que este será impresso. Nesse caso, o veículo é uma revista direcionada exclusivamente à escolas. Desta forma, será feito um apelo visual através das imagens dos produtos que, supostamente esse tipo de público poderia ser interessar.

1º Passo: Crie um novo documento (Ctrl+N), insira um retângulo (F6) e no box Tamanho dos objetos configure suas propriedades para 60x82mm;

2º Passo: Importe (Ctrl+I) uma imagem para ser utilizada de fundo, dimensione-a em 60x82mm, selecione os 2 objetos e efetue um alinhamento digitando C (alinhamento pelo centro na vertical) e E(alinhamento pelo centro na horizontal);

Page 59: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

55 Vestuário - Desenho Computadorizado

3º Passo: Com a Ferramenta texto (F8), no box Lista de fontes selecione a fonte Arial Black e escreva EQUIPAMENTOS.

4º Passo: Vá em Texto>Formatação de parágrafos. Na janela de encaixe Formatação de parágrafos, digite -15 para Espaçamento de caractere;

Page 60: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

56 Vestuário - Desenho Computadorizado

5º Passo: Selecione o texto digitado e com o Shift pressionado selecione o retângulo e alinhe-o ao centro (C) e ao topo (T). Se necessário, redimensione o texto e deslize-o para baixo. Veja a figura;

6º Passo: Novamente com a ferramenta Texto digite o endereço do site e posicione-o centralizado;

7º Passo: Insira um novo retângulo com 18x18mm e no box Arredondamento digite 10. Certifique-se que o ícone Arredondar cantos simultaneamente esteja pressionado;

Page 61: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

57 Vestuário - Desenho Computadorizado

8º Passo: Com o retângulo recém criado selecionado, digite 4 vezes no + para fazer cópias deste objeto, os alinhe, coloque uma borda preta de 1 ponto e pinte-os de branco;

9º Passo: Importe 6 imagens, dimensione-os e alinhe-os conforme figura. Lembrando que para alinhar um objeto pelo outro, você deve selecionar o objeto que servirá como base para o alinhamento, com o Shift pressionado

Page 62: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

58 Vestuário - Desenho Computadorizado

selecione o outro objeto que será alinhado e digiteC e E. O objeto ficará perfeitamente alinhado ao centro. Veja 5 objetos alinhados com essa técnica:

10º Passo: Importe (Ctrl+I) o logotipo posicione-o a esquerda inferior e, com a mesma fonte utilizada no título (EQUIPAMENTOS) digite o telefone 11 2242-6011, onde o 11 fique com um tamanho na metade do valor do restante;

11º Passo: Pinte-o de vermelho para destacá-lo e pronto!

Page 63: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

59 Vestuário - Desenho Computadorizado

Anexo II

Tutorial Anterior: Muito além do Photoshop - DRC - 22/09/07

Vetorizando sua foto (Falso Vetor). Descrição: Efeito que simula a vetorização real através do Photoshop. 01. Para criar este falso vetor com uma foto será necessário um bom domínio do Photoshop e da ferramenta Pen Tool, caso você não saiba como usá-la clique aqui, para ter um resultado bem detalhado serão necessárias algumas horas ou até dias de trabalho, por isso algumas vezes vale mais a pena realizar este tipo de trabalho em softwares que trabalham com vetores, no fim o resultado pode ser identico porém com o Photoshop você terá um bitmap que ao contrário do vetor não irá permitir um redimensionamento sem perda de qualidade. Pressione Ctrl+O e abra a foto escolhida para ser trabalhada, para este tutorial iremos usar a imagem abaixo.

Page 64: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

60 Vestuário - Desenho Computadorizado

02. Pressione Ctrl+Shift+Alt+N para criar uma nova layer, defina sua cor de Foreground com a cor #D9BA8D, pressione a letra P do teclado para selecionar a Pen Tool para criar a pele vá clicando e contornando todas as áreas de pele que estejam visíveis, na imagem abaixo começamos a contornar o braço.

03. Na parte dos dedos não se preocupe em fazer divisões exatas ou como na imagem que estamos usando os dedos se confundem e somem nos cabelos por isso não se preocupe em fazer esta parte com muita exatidão pois eles serão cobertos pelos cabelos mais a frente.

Page 65: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

61 Vestuário - Desenho Computadorizado

04. Ao terminar de contornar todas as áreas de pele da imagem clique com o botão direito dentro do contorno e escolha a opção Fill Path, note que em algumas áreas como as áreas próximas a roupas e cabelos não estão bem desenhadas, mas não se preocupe pois mais a frente isto irá desaparecer.

05. Pressione Ctrl+Shift+Alt+N para criar uma nova layer, desta vez faremos o contorno do rosto, não se preocupe com olhos, boca e nariz neste momento, faça apenas o contorno como foi feito anteriormente com o corpo e preencha a seleção com a cor #E2C59B caso esteja usando a imagem do tutorial.

Page 66: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

62 Vestuário - Desenho Computadorizado

06. Pressione Ctrl+Shift+Alt+N para criar uma nova layer, desta vez faremos o contorno do vestido, escolha a cor desejada mas escolha uma cor escura (com excessão da cor preta), pois mais adiantes usaremos cores mais claras para criar os detalhes do vestido e o preto para criar as áreas de sombra, neste tutorial usamos a cor #196339, proceda como nos passos anteriores

Page 67: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

63 Vestuário - Desenho Computadorizado

07. Pressione Ctrl+Shift+Alt+N para criar uma nova layer, desta vez faremos a parte dos cabelos, para o cabelo da foto usada neste tutorial foi usada a cor #784234, que é a cor de base para cabelos pretos, caso seja feito em um cabelo loiro não comece com o amarelo e sim com um tom marrom, pois o que estamos fazendo agora é apenas a base, repita o mesmo procedimento realizado nos passos anteriores, sua imagem deverá ficar como a imagem abaixo.

Page 68: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

64 Vestuário - Desenho Computadorizado

08. Com a base pronta agora é hora de adicionar as sombras, quanto mais sombra mais realista a imagem irá ficar, quanto menos sombra menos realista e com mais cara de Cartoon sua imagem irá ficar, comece duplicando a foto original pressionando Ctrl+J, faça isso 4 vezes, 1 para o corpo, 1 para o vestido, 1 para o rosto e 1 para o cabelo, e deixe as layers como na foto abaixo.

Page 69: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

65 Vestuário - Desenho Computadorizado

09. Agora pressione Ctrl+Alt+G (Ctrl+G na versão CS do Photoshop), ou vá em Layer> Create Clipping Mask, aplique nas layers que contenham a foto usada, sua paleta de layers deve ficar como a da imagem abaixo.

Page 70: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

66 Vestuário - Desenho Computadorizado

10. Clique com a tecla Ctrl sobre as miniaturas das layers que contém os contornos feitos para ativar a seleção, em seguida vá em Select> Inverse ou pressione Ctrl+Shift+I, clique na layer da foto que está acima desta layer e pressione Delete, faça isto com todos os contornos feitos, com isto estaremos deletando da foto usada as partes que não são necessárias. 11. Agora clique na layer que contém a imagem do corpo e depois vá em Image> Adjustments> Desaturateou pressione Ctrl+Shift+U, isto irá deixar a foto preto e branca, em seguida vá em Image> Adjustments> Posterize, defina um valor entre 8 e 9 e pressione Ok, faça isto em todas as layers de foto que estamostrabalhando (corpo, rosto, cabelo e vestido), porém cada parte do corpo possui um valor diferente no filtroPosterize, isto vai muito da foto escolhida e de quanto de detalhes queremos trabalhar na foto. 12. Clique na foto do corpo e pressione Ctrl+Shift+Alt+N para criar uma nova layer e pressione Ctrl+Alt+G (Ctrl+G no Photoshop CS) ou vá em Layer> Create Clipping Mask, pressione a letra D do teclado para definir sua cor de Foreground como preta (#000000), pressione a letra P do teclado para selecionar a Pen Tool e crie seleções nas áreas escuras (sombras) do corpo primeiro pegando a cor preta com o tom de cinza mais próximo, a cor de base que foi feita antes aqui está representada pelo cinza claro, por isso todas as outras tonalidades serão trabalhadas mais adiante.

Page 71: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

67 Vestuário - Desenho Computadorizado

13. Retire a visualização da layer que acabou de ser trabalhada e pressione Ctrl+Shift+Alt+N para criar mais uma layer, aplique outro Clipping Mask pressionando Ctrl+Alt+G (Ctrl+G no Photoshop CS) ou indo em Layer> Create Clipping Mask, pressione a letra P para selecionar a Pen Tool e desta vez selecione a cor preta junto com mais 2 tonalidades de cinza, repita o processo de crição de layer e seleção ao redor da cor até ter selecionado todas as cores, sempre que for criar uma nova layer retire a visibilidade da layer anterior, no tutorial foram criadas 4 layers de seleções em preto, porém isso pode variar dependendo da imagem ou nível de detalhe no filtro Posterize, agora defina sua cor de Foreground em branca (#ffffff), pressione Ctrl+Shift+Alt+N para criar uma nova layer e depois pressione Ctrl+Alt+G (Ctrl+G no Photoshop CS) ou vá em Layer> Create Clipping Mask, pressione a letra P do teclado para selecionar a Pen Tool e crie uma seleção nas áreas claras da imagem, no tutorial foram feitas duas layers pegando do tom mais claro para um escuro e depois do claro para dois tons mais escuros, depois de feito isso ative a visualização de todas as layers (com excessão da layer da foto do corpo) e mude o modo de blend das layers que acabamos de criar para Soft Light.

Page 72: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

68 Vestuário - Desenho Computadorizado

Sua imagem deve estar parecida com a imagem abaixo.

Page 73: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

69 Vestuário - Desenho Computadorizado

14. Diminua a opacidade das layers que acabamos de trabalhar (seleções de preto e branco do corpo) para 30%, clique com a tecla Ctrl pressionada na miniatura da primeira layer de sombra (seleção em preto) para ativar a seleção ao redor, pressione Ctrl+Shift+Alt+N para criar uma nova layer e vá em Select> Modify> Contract e defina um valor de 3 pixels, clique em Ok, pressione a letra G do teclado para selecionar a Paint Bucket Tool e preencha a seleção com a cor preta, mude o modo de blend da layer para Soft Light e defina o valor de 30% para Opacity, faça isto para cada layer em preto e branco (do corpo) que acabamos de trabalhar, sua imagem irá ficar assim.

Page 74: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

70 Vestuário - Desenho Computadorizado

15. Agora iremos trabalhar o vestido, o processo é o mesmo, pressionar Ctrl+Shift+Alt+N para criar uma nova layer, Ctrl+Alt+G (Ctrl+G no Photoshop CS) ou vá em Layer> Create Clipping Mask, pressionar a letra P do teclado para selecionar a Pen Tool e ir criando as seleções sempre em novas layers e retirando a visibilidade da layer anterior, ao final mudar o modo de blend da layer para Soft Light com opacidade de 30%.

Page 75: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

71 Vestuário - Desenho Computadorizado

16. O próximo passo é trabalhar o rosto, como o mesmo processo que fizemos anteriormente, por enquanto trabalhe a penas o rosto sem mexer nos olhos e lábios

Page 76: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

72 Vestuário - Desenho Computadorizado

17. Agora trabalharemos o cabelo, que é a parte mais complicada e demorada, para começar faça todo o processo que foi aplicado em outras partes do corpo e descrito anteriormente.

Page 77: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

73 Vestuário - Desenho Computadorizado

18. Adicione mais detalhes na cor branca e na cor preta para deixar os cabelos mais realistas criando inclusive a direção do penteado para dar mais realismo como pode ser observado na imagem abaixo.

Page 78: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

74 Vestuário - Desenho Computadorizado

19. O último passo para o cabelo é criar alguns fios que saem para dar mais realismo, pressione Ctrl+Shift+Alt+N para criar uma nova layer, pressione a letra G do teclado para selecionar a Paint Bucket Tool e pinte esta nova layer com a cor cinza clara, coloque esta layer abaixo das outras para criar um fundo cinza, este fundo servirá apenas para criar um contraste e ajudar na visualização dos traços, novamente crie uma nova layer acima da layer do cabelo pressionando Ctrl+Shift+Alt+N, não crie um Clipping Mask para esta layer, defina sua cor de Foreground com a cor #5E2E24, pressione a letra P do teclado para selecionar a Pen Tool e desenhe pequenos fios saindo do cabelo como mostrados nas fotos abaixo.

Page 79: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

75 Vestuário - Desenho Computadorizado

20. Abaixo você pode ver as áreas que foram criadas selecionadas e depois como ficou.

Page 80: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

76 Vestuário - Desenho Computadorizado

21. O próximo passo será criar os elementos do rosto, começando pelas sombrancelhas, pressione Ctrl+Shift+Alt+N para criar uma nova layer acima da layer do rosto, defina sua cor de Foreground para #5E2E24, pressione a letra P do teclado para selecionar a Pen Tool e crie a seleção ao redor da sombrancelha, depois clique com o botão direito do mouse e escolha a opççao Fill Path e pressione Ok.

Page 81: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

77 Vestuário - Desenho Computadorizado

22. Pressione Ctrl+Shift+alt+N para criar uma nova layer, pressione a letra P do teclado para selecionar a Pen Toole crie uma seleção ao redor da parte branca do olho direito, preencha com a cor #A18D97, nunca com a cor branca pura.

23. Pressione Ctrl+Shift+Alt+N para criar mais uma layer e retire a visualização da outra layer do olho, pressione a letra P do teclado para selecionar a Pen Tool e crie uma seleção ao redor da íris, preencha a seleção com a cor #343C31, novamente pressione Ctrl+Shift+Alt+N para criar uma nova layer e retire a visualização da layer que estavamos trabalhando (a layer da íris), pressione a letra P do teclado para selecionar a Pen Tool e desenhe ao redor da pupila, preencha a seleção com a cor preta, ative a visualização das 2 outras layers do olho para ver como está ficando.

Page 82: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

78 Vestuário - Desenho Computadorizado

24. Pressione Ctrl+Shift+Alt+N para criar uma nova layer onde faremos os cílios, crie a seleção e preencha com a cor preta, logo após pressione novamente Ctrl+Shift+Alt+N para criar uma nova layer e posicione esta layer abaixo das outras layers do olho, pressione a letra P do teclado para selecionar a Pen Tool e desenhe as áreas de sombra do olho, ao final preencha a seleção com a cor preta, mude o modo de blend da layer para Soft Light, ao final teremos 3 layers com sombras e áreas escuras e 2 de áreas claras, deixe as layers de áreas claras com modo de blend Soft Light e opacidade em 100%, as áreas de sombra (pretas) ficam com modo de blend em Soft Light e opacidade em 80%.

25. Clique na layer que contém a parte branca do olho e pressione Ctrl+Shift+Alt+N para criar uma nova layer e depois pressione Ctrl+Alt+G (Ctrl+G no Photoshop CS) ou vá em Layer> Create Clipping Mask, defina sua cor de Foreground em branca (#ffffff), pressione a letra P do teclado para selecionar a Pen Tool e desenhe duas áreas como as mostradas na foto abaixo, preencha com a cor branca e defina o valor de 70% para a opacidade da layer.

26. Pressione Ctrl+Shift+Alt+N para criar outra layer e depois pressione Ctrl+Alt+G (Ctrl+G no Photoshop CS) ou vá em Layer> Create Clipping Mask, pressione a letra P do teclado para selecionar a Pen Tool e desenhe duas áreas como as da foto abaixo, preencha as seleções com a cor preta e mude o modo de blend da layer para Soft Light.

Page 83: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

79 Vestuário - Desenho Computadorizado

27. Agora clique na layer da íris e depis pressione Ctrl+Shift+Alt+N para criar uma nova layer, pressione Ctrl+Alt+G (Ctrl+G no Photoshop CS) ou vé em Layer> Create Clipping Mask, pressione a letra B do teclado para selecionara Brush Tool, defina um tamanho de 3 pixels, e desenhe um contorno ao redor da área verde usando a cor preta, pressione Ctrl+Shift+Alt+N para criar uma nova layere pressione Ctrl+Alt+G (Ctrl+G no Photoshop CS) ou vá em Layer> Create Clipping Mask, pressione a letra B do teclado para selecionar a Brush Tool novamente e com a cor branca desenhe alguns pontos em volta da área verde do olho, mude o modo de blend da layer paraSoft Light com 70% de opacidade.

28. Pressione Ctrl+Shift+Alt+N para criar uma nova layer acima da layer da pupila, pressione a letra B do teclado para selecionar a Brush Tool com tamanho de 1 pixel na cor branca, desenhe um ponto como o da foto abaixo.

29. Neste momento sua imagem deve estar parecida com a imagem abaixo.

Page 84: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

80 Vestuário - Desenho Computadorizado

30. Para o olho esquerdo basta duplicarmos o olho direito, para isso criamos um layer set (uma pequena pasta contendo todas as layers do olho), para criar a layer set clique no ícone de uma pasta que fica no rodapé da paleta de layers, isto irá criar uma pequena pasta na sua paleta de layers, clique e arraste todas as layers do olho para dentro desta pasta, feito isto clique com o botão direito do mouse sobre a pasta e escolha a opção Duplicate Layer Set, clique na pasta que foi criada e vá em Edit> Transform> Flip Horizontal, pressione a letra V do teclado para selecionar a Move Tool e mova o olho para a posição correta, pressione Ctrl+T para acertar o ângulo correto do olho em relação ao rosto.

Page 85: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

81 Vestuário - Desenho Computadorizado

31. Agora faremos os lábios, escolha uma cor qualquer, para este tutorial usamos um vermelho escuro (#A7545B), pressione Ctrl+Shift+Alt+N para criar uma nova layer e depois pressione a letra P do teclado para selecionar a Pen Tool, crie o contorno dos lábios e preencha na cor escolhida, novamente pressione Ctrl+Shift+Alt+N para criar outra layer, pressione Ctrl+Alt+G (Ctrl+G no Photoshop CS) ou vá em Layer> Create Clipping Mask e crie uma seleção ao redor das áreas escuras dos lábios.

32. Crie também a divisão dos lábios, ao final mude o modo de blend da layer para Soft Light com opacidade em 55%.

Page 86: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

82 Vestuário - Desenho Computadorizado

33. Crie mais algumas camadas repetindo os passos feitos em outras partes do corpo até achar que conseguiu um bom resultado.

34. Para o nariz, pressione Ctrl+Shift+Alt+N para criar uma nova layer e pressione a letra P do teclado para selecionar a Pen Tool, crie uma seleção ao redor das narinas e definições do nariz e preencha com a cor preta, mude o modo de blend da layer para Soft Light.

35. Abaixo a imagem no final.

Page 87: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

83 Vestuário - Desenho Computadorizado

36. Com algumas variações de Background.

Page 88: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

84 Vestuário - Desenho Computadorizado

BIBLIOGRAFIA

BARBIERI, C. Business intelligence: modelagem e tecnologia. Rio de Janeiro: Axcel Books do Brasil, 2001. BERTGES, L. A. A tecnologia da informação. Disponível em: http://www.powerline.com.br/~bertges/LIVRO_i.htm. Acesso em 19 nov 2006. CASAS, L. A. A. Ensino assistido por computador: Modelagem de um gerador de materiais educativos computadorizados num ambiente multimídia. Dissertação (Mestrado em Engenharia de Produção) Universidade Federal de Santa Catarina, Florianópolis, 2002. CRUZ; 1998. In: REZENDE, D. A. Tecnologia da informação aplicada à inteligência empresarial: alinhamento estratégico e análise da prática nas organizações. São Paulo: Atlas, 2002. DAVENPORT, T. H.; PRUSACK, L. Ecologia da informação. São Paulo: Futura, 1998. EDWARDS, B. Desenhando com o lado direito do cérebro. São Paulo: Ediouro, 2000. HALL, S. A identidade cultural na pós-modernidade. Rio de Janeiro: DP&A, 1998. JOÃO, B. N. Das competências essenciais às estratégias baseadas no conhecimento. In: Encontro anual da ANPAD, 25, 2001. Campinas. Anais... Campinas: Anpad, 2001. MANZONI JR., R. A inteligência é a alma do negócio. Computerworld, mar. Especial Business Intelligence. 1999. MARKUS, M. L.; BENJAMIN, R. I. The magic bullet theory in IT-enabled transformation. Sloan Management Review. Winter, 1997. OLIVEIRA, L. C. et al. A tecnologia da informação como instrumento do posicionamento estratégico. In: Encontro Anual da ANPAD. 25, 2001. Campinas. Anais... Campinas: Anpad, 2001. OSTROWER, F. Acasos e criação artística. 9ª ed. Rio de Janeiro: Campus, 1990. PARSONS, G. L. Information technology: a new competitive weapon. Sloan Management Review. V.1, nº 25, p. 3-14, Fall 1983. REZENDE, D. A. Tecnologia da informação aplicada à inteligência empresarial: alinhamento estratégico e análise da prática nas organizações. São Paulo: Atlas, 2002.

Page 89: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Escola Estadual de Educação Profissional [EEEP] Ensino Médio Integrado à Educação Profissional _________________________________________________________________________________________

85 Vestuário - Desenho Computadorizado

RIEGELMAN, N. Colours for Modern Fashion – Drawing Fashion with Colored Markers. USA: Heads Media, 2006. TAPSCOTT, D. Economia digital. São Paulo: Makron Books, 1997. VINCENT-RICARD, F. As espirais da moda. Rio de Janeiro: Paz e terra, 1996.

Page 90: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade
Page 91: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade

Hino do Estado do Ceará

Poesia de Thomaz LopesMúsica de Alberto NepomucenoTerra do sol, do amor, terra da luz!Soa o clarim que tua glória conta!Terra, o teu nome a fama aos céus remontaEm clarão que seduz!Nome que brilha esplêndido luzeiroNos fulvos braços de ouro do cruzeiro!

Mudem-se em flor as pedras dos caminhos!Chuvas de prata rolem das estrelas...E despertando, deslumbrada, ao vê-lasRessoa a voz dos ninhos...Há de florar nas rosas e nos cravosRubros o sangue ardente dos escravos.Seja teu verbo a voz do coração,Verbo de paz e amor do Sul ao Norte!Ruja teu peito em luta contra a morte,Acordando a amplidão.Peito que deu alívio a quem sofriaE foi o sol iluminando o dia!

Tua jangada afoita enfune o pano!Vento feliz conduza a vela ousada!Que importa que no seu barco seja um nadaNa vastidão do oceano,Se à proa vão heróis e marinheirosE vão no peito corações guerreiros?

Se, nós te amamos, em aventuras e mágoas!Porque esse chão que embebe a água dos riosHá de florar em meses, nos estiosE bosques, pelas águas!Selvas e rios, serras e florestasBrotem no solo em rumorosas festas!Abra-se ao vento o teu pendão natalSobre as revoltas águas dos teus mares!E desfraldado diga aos céus e aos maresA vitória imortal!Que foi de sangue, em guerras leais e francas,E foi na paz da cor das hóstias brancas!

Hino Nacional

Ouviram do Ipiranga as margens plácidasDe um povo heróico o brado retumbante,E o sol da liberdade, em raios fúlgidos,Brilhou no céu da pátria nesse instante.

Se o penhor dessa igualdadeConseguimos conquistar com braço forte,Em teu seio, ó liberdade,Desafia o nosso peito a própria morte!

Ó Pátria amada,Idolatrada,Salve! Salve!

Brasil, um sonho intenso, um raio vívidoDe amor e de esperança à terra desce,Se em teu formoso céu, risonho e límpido,A imagem do Cruzeiro resplandece.

Gigante pela própria natureza,És belo, és forte, impávido colosso,E o teu futuro espelha essa grandeza.

Terra adorada,Entre outras mil,És tu, Brasil,Ó Pátria amada!Dos filhos deste solo és mãe gentil,Pátria amada,Brasil!

Deitado eternamente em berço esplêndido,Ao som do mar e à luz do céu profundo,Fulguras, ó Brasil, florão da América,Iluminado ao sol do Novo Mundo!

Do que a terra, mais garrida,Teus risonhos, lindos campos têm mais flores;"Nossos bosques têm mais vida","Nossa vida" no teu seio "mais amores."

Ó Pátria amada,Idolatrada,Salve! Salve!

Brasil, de amor eterno seja símboloO lábaro que ostentas estrelado,E diga o verde-louro dessa flâmula- "Paz no futuro e glória no passado."

Mas, se ergues da justiça a clava forte,Verás que um filho teu não foge à luta,Nem teme, quem te adora, a própria morte.

Terra adorada,Entre outras mil,És tu, Brasil,Ó Pátria amada!Dos filhos deste solo és mãe gentil,Pátria amada, Brasil!

Page 92: Página inicial - Secretaria da Educação - Governador...imagens vetoriais e programas que trabalham com imagens bitmaps (mapas de bits). O que vamos exemplificar não é realidade