Prof.

Celso Cardoso Neto

OBJETIVOS
Conhecer os conceitos bsicos da computao grfica e processamento
de imagens

EMENTA
Computao Grfica.
Processamento de Imagens.
Uso de Software.
Corel Draw 11 / X3
Photoshop 7 / CS
Flash MX / MX / 8

UNIDADE
UNIDADE
UNIDADE
UNIDADE
UNIDADE
UNIDADE
UNIDADE

I:
II :
III :
IV :

CONCEITOS BSICOS
PARADIGMAS DE ABSTRAO
OBJETOS GRFICOS
MODELAGEM DA GEOMETRIA DOS OBJETOS E
CONSTRUO DA CENA EM 3D
V : VISUALIZAO DE CENA
VI : ILUMINAO DE CENA
VII : PRTICA EM LABORATRIO

BIBLIOGRAFIA BSICA
1)
2)
3)

GOMES, J. e VELHO, L. Computao Grfica: Imagem. IMPA-SBM, 1994. (*3)

AZEVEDO, Eduardo. Computao Grfica, Rio de Janeiro: Campus, 2005 (*0)
GOMES, J. e VELHO, L. Computao Grfica: Volume I. Srie Computao e
Matemtica, SBM/IPA, 1998

BIBLIOGRAFIA COMPLEMENTAR
3)
4)
5)
6)

GOMES, Jonas; VELHO, Luiz. Computao grfica: imagem. Rio de Janeiro: IMPA/SBM,
1994 (*3
MAESTRI, George. Animao digital de personagens. Sao Paulo: QUARK EDITORA,
1996 (*3)
Manuais de Software
Sites na Internet

AVALIAES

1. V1 ------------------ 30/09/2010
2. V2 ------------------ 02/12/2010
3. 2A. CHAMADA 09/12/2010
4. VS ----------------- 16/12/2010
5. VT -----------------

TAREFAS E PROVA

Sites na Internet
http://www.inf.ufsc.br/~awangenh/CG/apostilas/apostilaport.pdf
http://pt.wikipedia.org/wiki/Computa%C3%A7%C3%A3o_gr%C3%A1fica
http://www.sobresites.com/computacaografica/
http://gbdi.icmc.usp.br/documentacao/apostilas/cg/
http://www.inf.pucrs.br/~pinho/CG/Aulas/Intro/intro.htm
http://www.3darts.com.br/
http://profs.ccems.pt/Margarita/exercicios.htm
http://www.xuti.net/index.php?option=com_content&task=view&id=51&Itemid=32
http://www.azmt.com.br/treinamento/index.php
http://pt.wikipedia.org/wiki/CorelDraw
http://pt.wikipedia.org/wiki/Photoshop
http://pt.wikipedia.org/wiki/Autocad
http://pt.wikipedia.org/wiki/3D_Studio_Max
http://pt.wikipedia.org/wiki/Macromedia

rea da Cincia da Computao que estuda a gerao,

manipulao e interpretao de modelos e imagens de
objetos utilizando computador.
Tais modelos vm de uma variedade de disciplinas como
FSICA, MATEMTICA, ENGENHARIA, ARQUITETURA, etc...
A computao grfica a rea da computao destinada
gerao de imagens em geral em forma de representao de
dados e informao, ou em forma de recriao do mundo real. Ela
pode possuir uma infinidade de aplicaes para diversas reas.
Desde a prpria informtica ao produzir interfaces grficas para
software, sistemas operacionais e sites na Internet, quanto para
produzir animaes e jogos.

imagens

SNTESE DE
IMAGENS

Descries
(especificao
geomtrica)

PROCESSAMENTO
DE IMAGENS

imagens

ANLISE DE
IMAGENS

Na ltima dcada, somou-se a rea da Visualizao de Dados

(VISUALIZAO COMPUTACIONAL), que usa tcnicas de
COMPUTAO GRFICA para representar informao, de forma a facilitar o
entendimento de conjuntos de dados numricos de alta complexidade
reas de aplicao:
Visualizao de imagens mdicas
Meteorologia
Dados financeiros
Visualizao de programas
Dinmica dos fludos ...
Nelas, o que existe em comum a representao grfica (superfcies,
partculas, cones) que so geradas automaticamente a partir de um conjunto
de dados.
A VISUALIZAO COMPUTACIONAL partilha das caractersticas da
SNTESE, do PROCESSAMENTO e da ANLISE dos dados.

LINKS DE ALTA
VELOCIDADE

COMPUTADOR
HOSPEDEIRO
(DADOS ARMAZENADOS)

DISPOSITIVOS
GRFICOS DE
ENTRADA E SADA

Qual o programa mais adequado s minhas necessidades ?

TIPO

COREL

ADOBE

MACROMEDIA

Vetorial

CorelDraw

Illustrator

Freehand

Bitmap

PhotoPaint

Photoshop

Xres

Editorao

Venture

PageMaker (InDesign)

QuarkExpress

Animao

Lumire

Premier

Flash

VETORIAL

BITMAP
(MATRICIAL)

EDITORAO e
DIAGRAMAO

DXF (*)

GIF / PNG (*)

TXT (*)

WMF (*)

JPEG (*)

DOC / RTF (*)

AI (*)

TIFF (*)

PRN (*)

DWG

EPS

QXD / QXT

CDR

BMP (*)

PMD / P65

---

TGA

---

---

PSD

---

---

CPT

---

(*) SO EXTENSES UNIVERSAIS, GERALMENTE IMPORTADAS E

EXPORTADAS POR QUALQUER PROGRAMA

ATENO !!!
SE A EXTENSO DESCONHECIDA, FICA MUITO
DIFCIL IDENTIFICAR SE A IMAGEM VETORIAL
OU BITMAP, AT MESMO PORQUE,
GERALMENTE, AS IMAGENS VETORIAIS SO
CONVERTIDAS EM MATRICIAIS ANTES DE
SEREM IMPRESSAS.

Uma imagem BITMAP formada por pontos (pixels)

Uma imagem VETORIAL formada por coordenadas (x,y)
O CorelDraw utiliza imagens VETORIAIS, pois elas permitem a
criao de objetos, logotipos, plantas humanizadas, layouts, ...
O PhotoShop trabalha com imagens BITMAP, adquiridas por meio
de uma cmera ou scanner (digitalizadas). Posteriormente, faz-se
o melhoramento das imagens, utilizando-se de ferramentas do
programa.
Imagens VETORIAIS so definidas matematicamente como uma
srie de pontos unidos por linhas. Por exemplo, para formar uma
linha reta, deve haver pelo menos duas coordenadas: (x,y) inicial
e (x,y) final.

Os programas baseados em VETORES so ideais para ilustrao,

visto que cada objeto uma unidade independente.
possvel mover e alterar suas propriedades repetidas vezes e
ainda assim manter a sua nitidez e resoluo originais, sem afetar
os demais objetos do desenho.
Os objetos criados no dependem de resoluo, o que significa
que eles aparecem na resoluo mxima do dispositivo de sada
(impressora ou monitor).
O CORELDRAW um aplicativo que permite incorporar BITMAPS
aos desenhos e exportar os BITMAPS criados, mas um
programa para trabalhar principalmente com IMAGENS
VETORIAIS, assim como o PHOTOSHOP especfico para
IMAGENS BITMAP (MATRICIAIS)

O Adobe Photoshop trabalha exclusivamente

com edio de imagens BITMAP.
Com o Adobe Photoshop pode-se alterar fotografias e outros tipos
de arte final digitalizada, retocar, aplicar efeitos, inserir textos e
corrigir qualquer tipo de imagem.
No entanto, o Adobe Photoshop no possui as melhores ferramentas para
impresso. Muitas das vezes necessrio exportar o trabalho para o
PageMaker ou Illustrator e o CorelDraw.

DXF muito utilizada pelo Autocad na exportao de arquivos

para outros programas.
WMF boa alternativa para importao para outros programas,
utilizada principalmente nas figuras do Word.
AI extenso principal do Adobe Illustrator e tambm a mais
conhecida porta de entrada e sada para a plataforma Macintosh,
utilizada na transferncia de arquivos para outros programas.
DWG extenso principal do AutoCad.
CDR extenso principal do CorelDraw

GIF / PNG utilizadas para Internet quando se quer transformar uma das cores da
imagem em transparncia. O PNG utiliza 24 bits e o GIF utiliza 256 cores.
JPG a mais utilizada extenso da Internet. Utiliza 24 u 16 bits e permite a escolha
do nvel de compactao (tamanho do arquivo e as cores). Seus arquivos
aparecem rapidamente nos browsers da Web quando compactados.
TIFF extenso muito utilizada para impresso, por ter 32 bits de cores e por obter
uma boa resoluo.
EPS - extenso muito utilizada para impresso. Seu peso em bits extremamente
grande, por isso menos utilizada que o TIFF.
BMP extenso padro do Windows. Perdeu espao para o JPG, que reduz muito
o tamanho do arquivo.
TGA extenso de arquivo utilizada para texturas.
PSD extenso padro do Photoshop. Sua caracterstica principal a utilizao de
vrias camadas (layers), diferentemente das outras extenses, que so chamadas
chapadas (possuem apenas uma camada).
CPT tem as mesmas caractersticas do PSD, mas extenso padro do Corel
PhotoPaint.

TXT extenso de somente texto (sem formatao) e pode ser aberta por qualquer
programa que trabalhe com texto.
DOC / RTF so extenses padro do Word e podem ser abertas por boa parte
dos programas. A extenso RTF o segundo padro do Word e possui as mesmas
caractersticas do .DOC
PMD / P65 extenses padro do PageMaker. So arquivos fechados que s
podem ser editados no prprio PageMaker.
QXD / QXT extenses padro do QuarkPress.

SO MUITO UTILIZADOS PARA IMPRESSO EM UM COMPUTADOR DIFERENTE

DO QUE FOI FEITO O TRABALHO. POR ISSO, ESSE TIPO DE EXTENSO MUITO
UTILIZADO PARA ENCAMINHAMENTO PARA REVISTAS OU PARA BUREAUS DE
IMPRESSO.

PDF formato de arquivo fechado utilizado pelo programa Adobe Acrobat. Muito
utilizado na Internet pelo fato do texto no ser editvel, ainda que possa ser
copiado.
Obs: J h programas que convertem PDF em arquivo no Word.

PRN extenso usada principalmente pelo Word para fechamento de arquivo.

Pode ser transformada em PDF pelo Acrobat Distiller.

1- RGB
cores primitivas: vermelho, verde e azul
Utilizado para imagens mostradas no monitor
2- CMYK
cores primitivas: ciano, magenta, amarelo e preto

a quantidade de cores varia de acordo com a impressora

rosa, solferino, fcsia, prpura e mesmo vermelho so alguns dos nomes
como o magenta era conhecido antigamente. a cor prpura primrio ou
vermelho-violetado

http://www.mundocor.com.br/cores/cores_nomes.htm
3- Lab Color
abrange as faixas de cores RGB e CMYK
Obs: Muitas vezes uma cor que pode ser visualizada na tela no pode ser
impressa, por no estar dentro do limite do modelo. Exemplo disso a cor
nen, que est dentro do modelo RGB mas fora do modelo CMYK.

Curiosidades:

http://www.mundocor.com.br/cores/index.asp

Diferentemente das VETORIAIS, as imagens BITMAP dependem

muito da RESOLUO do monitor, da impressora e do scanner, que
podem influenciar diretamente na qualidade da imagem.
Um monitor pode trabalhar com diversas configuraes. A mais comum
de 800 X 600 (800 pixels na horizontal e 600 pixels na vertical), com 72 dpi
(dots per inch pontos por polegada) de resoluo. Existem outras:
1024 X 768

1152 X 864

1280 X 720

1280 X 768

1280 X 960

1280 X 1024

O que ir definir a resoluo do monitor a quantidade de pontos por

polegada ou centmetro que forma a imagem. Assim, a qualidade da
imagem depender diretamente desta informao.
Para imagens na Internet pode-se usar a resoluo de 72 dpi. J para
uma imagem a ser impressa, melhor usar uma resoluo de 300 dpi.

Existem outras configuraes para a tela do computador, como por

exemplo, a de 1024 X 768 pixels, com 96 dpi de resoluo.

Quando se tem uma imagem em um arquivo, no possvel

aumentar a sua resoluo no Photoshop.
Somente com o scanner possvel realizar esta tarefa, com a
imagem sendo novamente digitalizada no scanner, configurado
agora com a resoluo desejada.
Ao diminuir a resoluo de uma imagem (dpi), diminui-se o
nmero de pixels (tamanho da imagem). No entanto, diminuir o
nmero de pixels, no ir diminuir a resoluo.

Exemplo:

Voc tem que imprimir a capa de um folder de uma empresa

com qualidade profissional.

A capa tem o tamanho de papel A4 (21 cm X 29,7 cm).

O arquivo em branco no Photoshop ter o mesmo tamanho e

resoluo de 300 dpi (resoluo para imprimir na grfica)

Colocando duas imagens iguais neste arquivo, uma com 300

dpi e outra com 72 dpi, veja o que acontece ...

A imagem com
resoluo menor
(72 dpi) teve o
seu tamanho
diminudo para
manter uma
qualidade
proporcional a
uma imagem de
300 dpi

A RESOLUO DA IMPRESSORA a distncia em polegadas

entre dois pontos, portanto, quanto menor a distncia entre eles,
melhor a resoluo.
A impressora de 720 dpi tem uma boa resoluo, mas
aconselhvel utilizar uma que tenha 1400 ou 2880 dpi.
Quando a resoluo da impressora baixa, a imagem vista no
monitor no condiz com a imagem impressa.
Por exemplo, a foto de uma pessoa impressa em uma impressora
de baixa resoluo pode apresentar pontos avermelhados.
recomendvel converter em BITMAP todos os trabalhos
VETORIAIS para que no haja erros na impresso e para diminuir
o tempo de impresso do trabalho.

A imagem 3D mistura imagens VETORIAIS e BITMAPS.

Os objetos na criao e na modelagem so VETORIAIS
(possuem altura, largura e profundidade), podendo-se ter
viso completa de todos os seus ngulos.
Quando renderizada (pintada), a imagem se torna
BITMAP e so utilizados os pontos do monitor como
referncia.
Observe as figuras dos prximos slides. Neles as imagens
no so reais, todas foram criadas com polgonos e a
grande maioria ajustada ou modificada no PhotoShop.

Na figura de baixo, a luz

do abajour foi criada e a
imagem foi escurecida.

Verses: 9, 10, 11, 12 e X3

Programa mais completo j criado para a arte
grfica baseada em vetores.
Com o CorelDraw, pode-se criar verdadeiras
obras de arte, utilizando-se das poderosas
ferramentas de desenho e pintura.
Com o CorelDraw, pode-se desde logotipos at sofisticadas pginas
para a Internet, dependendo apenas da criatividade.
Pacote do CorelDraw esto includos:

CorelDraw PHOTO-PAINT software destinado ao

tratamento de imagens, semelhante ao PhotoShop da
Adobe
CorelDraw R.A.V.E. programa voltado para a criao de
animaes para a Web, semelhante ao Flash, da Macromedia

Verses: 9, 10, 11, 12 e X3

O tambm incorpora alguns utilitrios
interessantes para os artistas grficos:
CorelDraw Capture utilitrio para capturar qualquer imagem que
esteja na tela do computador, como tambm gravar aes da tela
como arquivos de animao.
CorelDraw TEXTURE permite simular texturas naturais, como
nuvens, mrmore e madeira, combinando at 7 (sete) camadas de
materiais definidas pelo usurio.
CorelDraw TRACE utilitrio que permite converter imagens no
formato bitmap em imagens vetoriais.
Bitstream Font Navigator utilitrio que serve para encontrar fonts
de uma forma rpida e fcil, assim como organiz-las em grupos
gerenciveis, exibir e imprimir amostras das mesmas.
Canto Cumulus Desktop LE utilitrio utilizado para organizar
arquivos grficos e de mdia em um catlogo que pode ser
indexado para que se possa localizar imagens, desenhos, clipart,
fotos prontas e filmes Apple Quick Time de forma rpida e fcil.

Verses: 9, 10, 11, 12 e X3

O QUE SE PODE FAZER COM O

Panfletos criar propagandas para empresas, escolas ou instituies.

Logomarcas
Folders divulgao de feiras, seminrios e eventos em geral.
Cartes de visitas uso das ferramentas de desenho e pintura do
CorelDraw.
Etiquetas fins comerciais ou pessoais, de diversos padres e
tamanhos, como etiquetas para preos, fitas de vdeo e de udio, CDs e
DVDs, correspondncias ...
Pginas para a web uso de recursos como botes de opo, caixas de
seleo, listas de opes, botes de enviar, menus pop-up ...
Capas para revistas, livros, CDs, trabalhos acadmicos, outras
publicaes dp gnero.

Verses: 7, CS e CS2
Programa de edio de imagens em bitmap.
Com o ADSOBE PHOTOSHOP, pode-se alterar
fotografias e outros tipos de arte final digitalizada.
possvel retocar, aplicar efeitos, inserir textos e corrigir
qualquer tipo de imagem.
um software para tratamento de imagens
Para se obter um bom desempenho e qualidade de trabalhos, preciso:
Utilizar a camada (LAYER) corretamente;
Uma boa seleo no recorte de objetos, sem deixar falhas ou
sobras;
Conhecer as ferramentas, comandos e teclas de atalho das funes
principais;
Utilizar corretamente as ferramentas nas situaes e momentos
propcios

Verses: MX e 8
Software desenvolvido pela Macomedia para a
criao de filmes para pginas na Internet.
Recurso poderosos de desenvolvimento de aplicativos,
multimdia e vdeo permitem a criao de sofisticadas
interfaces de usurio, publicidade on-line, cursosde
aprendizagem eletrnica e front-ends de aplicativos
empresariais.
considerado pelos Web Designers e desenvolvedores como o melhor e
mais prtico software para a criao de Web sites existentes no
mercado.

Verses: MX e 8
O QUE SE PODE FAZER COM O

Com a infinidade de recursos que o Flash possui, pode-se desenvolver

no s animaes para pginas da Web como tambm poderosos filmes
de desenhos animados independentes, sem falar nos jogos das mais
diversas categorias, como tambm tutoriais para cursos com diversas
finalidades.
Exemplos:
Pginas atraentes e dinmicas suas pginas ficaro bem mais atrativas
utilizando os recursos de animao disponveis no Flash.
Filmes interativos - pode-se criar filmes interativos para divulgar um
produto, uma alestra sobre um evento, um documentrio, uma aula, um
fluxograma, um organograma, entre outros, e execut-los independente
dos browsers.
lbuns de famlia - pode-se utilizar fotos escaneadas e at filmes
domsticos de uma viagem, um casamento, um aniversrio, que podero
ser convertidos para a forma digital e criar verdadeiros lbuns de famlia.

Verses: MX e 8
O QUE SE PODE FAZER COM O

Jogos - atravs da linguagem ActionScript, criada especialmente para o

Flash, pode-se desenvolver uma boa quantidade de categorias de jogos,
como: tabuleiro, labirinto, ao, estratgia, ..., tanto para a Internet como
independentes.
Banners - o Flash permite-lhe criar uma infinidade de faixas interativas e
animadas para deixar seu site bem mais atraente. Na sua grande maioria,
so faixas publicitrias das empresas que patrocinam os sites.
Botes e cursores animados com os recursos do Flash pode-se criar
uma infinidade de tipos de botes e cursores animados para cada
finalidade.

Boa Sorte !