O documento discute conceitos básicos de multimídia, incluindo modelos de cores, formatos de arquivos de imagem e como alterar atributos de imagem. Também explica teorias da cor em sistemas digitais, como o espectro eletromagnético, visão fotópica e esotópica, modelos aditivo e subtrativo de cores e sistemas de cores como RGB, CMYK e HSV.

1. Aplicações Informáticas B

2. Conceitos básicos de multimédia
 Reconhecer os diferentes modelos de cor
 Caraterizar os atributos elementares das imagens
 Caraterizar os formatos de ficheiros de imagem
 Saber utilizar programas de desenho e pintura
 Saber alterar os atributos da imagem

3. Bases sobre a teoria da cor em
sistemas digitais
A cor está associada à perceção, pelo sistema de visão do
ser humano, da luz emitida, difundida ou refletida pelos
objetos.
A cor de um objeto depende das caraterísticas das fontes
de luz que o iluminam, da reflexão da luz produzida pela
sua superfície e, por último, das caraterísticas sensoriais
do sistema de visão humano, os olhos, ou de câmaras
digitais.
A não existência de luz implica que nada se veja e,
portanto, significa a não existência de cor.

4. A cor de um material é
determinada pelos
comprimentos de onda dos
raios luminosos que as
moléculas que as constituem
refletem, isto é, um objeto terá
determinada cor se não
absorver justamente os raios
correspondentes à frequência
daquela cor.

5. Espetro Eletromagnético
A luz contém uma variedade de ondas eletromagnéticas com diferentes
comprimento de onda.
Apenas uma pequena faixa da radiação é captada pelos nossos olhos,
varia entre os 400 e os 700 nanómetros nm (nanómetro=10−9 metro) e
é designada pelo Espectro Visível.

6. Visão Escotópica/Fotópica
A interpretação das cores é feita pelo cérebro humano depois de a luz
atravessar a íris e ser projetada na retina.
Desta forma , os olhos são os sensores de toda a visão e esta pode ser
do tipo:
• Visão Escotópica é assegurada por um único tipo de bastonetes
existentes na retina. Estes são sensíveis ao brilho e não detetam a
cor, ou seja são sensíveis às alterações de luminosidade;
• Visão Fotópica é assegurada por um conjunto de três tipos de cones
existentes na retina. Estes são sensíveis à cor. O número de cones
na retina distribui-se da seguinte forma: 64% são do tipo vermelho
(Red), 32% do tipo verde (Green) e 2% do tipo azul (Blue).
Como os bastonetes e os cones constituem dois tipos de sensores
diferentes que apreendem a intensidade de luz e as diferenças de cor,
é usual associá-los, respetivamente, aos conceitos de luminância e
crominância.
Estes conceitos estão relacionados com as diferentes formas de
representar as cores.

7. Aditivo e Subtrativo
Os modelos de cor fornecem
métodos que permitem especificar
uma determinada cor.
É necessário distinguir modelo
aditivo de subtrativo, a saber:
Modelo Aditivo Modelo Subtrativo
Luz emitida e projetada num ecrã Luz refletida
Mistura de cores emitidas por fonte
de luz
Mistura de cores de pintura ou
impressão

8. Modelo Aditivo
Neste modelo a ausência de luz ou
de cor corresponde à cor preta,
enquanto que a mistura dos
comprimentos de onda ou das cores
vermelha, verde e azul indicam a
presença da luz ou a cor branca.
Este modelo explica a mistura dos
comprimentos de onda de qualquer
luz emitida.

9. Modelo Subtrativo
Neste modelo, ao contrário do
modelo aditivo, a mistura de cores
cria uma cor mais escura, porque
são absorvidos mais comprimentos
de onda, subtraindo-os à luz.
A ausência de cor corresponde ao
branco e significa que nenhum
comprimento de onda é absorvido,
mas sim todos refletidos.

10. Cores Primárias
As cores primárias são o
vermelho, o amarelo e o azul.
São chamadas assim porque não
se pode obtê-las com a mistura
de nenhuma cor, já com a
mistura dessas três cores
podemos criar todas as outras.

11. Cores Secundárias
Cores secundárias ou binárias são
as cores que obtemos se se
misturarem duas cores primárias,
por exemplo:
Verde + Azul = Ciano
Azul + Vermelho = Magenta
Vermelho + Verde = Amarelo
Amarelo + Azul = Verde
Azul + Vermelho = Violeta
Vermelho + Amarelo = Laranja

12. Cores Terciárias
São obtidas pela mistura
de uma primária com uma
ou mais secundárias.

13. Circulo Cromático
O disco cromático não é um
instrumento científico de
classificação de cores, mas é
muito útil no entendimento da
teoria das cores. Geralmente
usado para estudar as cores, o
disco cromático pode ser
desenvolvido em qualquer
material.

14. Sistemas de cores - RGB
O que é o RGB?
É a abreviatura do sistema
de cores aditivas formado
pelas três cores: Vermelho
(Red), Verde (Green) e Azul
(Blue).
É o sistema aditivo de cores,
ou seja, de projeções de luz,
como monitores, ecrãs de
televisão e videoprojetores.

15. Caraterísticas:
Qualquer cor no sistema digital é representada por um
conjunto de valores numéricos, cada uma das cores no
sistema RGB pode ser representada por um dos seguintes
valores: decimal de 0 a 1, inteiro de 0 (mais escuro) a 255
(mais claro). Nos programas de edição de imagem, esses
valores são habitualmente representados por meio de
notação hexadecimal, indo de 00 (mais escuro) até FF
(mais claro) para o valor de cada uma das cores.
Correspondência entre valores
Decimal 0 0,2 0,4 0,6 0,8 1
Inteiro 0 51 102 153 204 255
Percentagem 0 20 40 60 80 100
Hexadecimal 00 33 66 99 CC FF
Sistemas de cores - RGB

16. Sistemas de cores - RGB
Um Byte permite 256 combinações possíveis - de 0 a 255, sendo o 0 a
ausência de cor e 255 a cor na sua totalidade. A transformação de
cores em bits através do RGB é simples:
Um Byte para o vermelho
Um Byte para o verde
Um Byte para o azul
Em RGB:
Preto: 0 0 0; Branco: 255 255 255; Amarelo: 255 255 0; Cyan: 0 255
255; Magenta: 255 0 255

17. Exemplo de várias cores:
Cor Valor Decimal Valor Inteiro
Preto (0,0,0) (0,0,0)
Vermelho (R) (1,0,0) (255,0,0)
Verde (G) (0,1,0) (0,255,0)
Azul (B) (0,0,1) (0,0,255)
Branco (R+G+B) (1,1,1)=(1,0,0)+(0,1,0)+(0,0,1) (255,255,255)
Amarelo (1,1,0)= (1,0,0)+(0,1,0)+(0,0,0) (255,255,0)
Castanho (0.6,0.4,0.2) (153, 102, 51)
Sistemas de cores - RGB

18. Sistemas de cores – RGB
Resolução e Tamanho
Uma imagem é uma representação discreta, isto é, constituída por
píxeis (PÍXEL – PIcture ELement) . O píxel, normalmente um quadrado
é a unidade elementar de brilho e cor que constitui uma imagem digital.
Resolução de uma imagem: Quantidade de informação que a imagem
contém por unidade de comprimento, isto é, o número de píxeis por
polegada, ppi (pixels per inch). A resolução pode também ser definida,
de forma imprópria, pelo tamanho, ou seja, pelo número de píxeis por
linha e por coluna. O nível de detalhe de uma imagem digital determina
os requisitos de armazenamento da mesma, quanto maior a resolução
de uma imagem maior será o tamanho do ficheiro de armazenamento.

19. Sistemas de cores – RGB
Resolução e Tamanho
O nível de detalhe de uma imagem depende da informação de cada
píxel. Cada píxel é codificado de acordo com a cor e o brilho que
representa, isto é, ocupa em memória um número de bits que varia
de acordo com o número de cores, tons de cinza e brilho definido
para a determinada imagem.

20. Sistemas de cores – RGB
Profundidade de cor
Indica o número de bits usados para representar a cor de um píxel
numa imagem. Este valor é também conhecido por profundidade do
píxel e é definido por bits por píxel (bpp).

21. Profundidade de cor
(n.º bits)
N.º de cores
produzidas
Qualidade da cor Padrão gráfico
1 21=2
Preto e Branco
(bit 0 ou 1)
Monocromática
2 22=4 Cores de 2 bits
CGA
(Color Graphics
Adapter)
4 24=16 Cores de 4 bits
EGA
(EnhancedGraphics
Adapter)
8 28=256
Escala de cinzas ou
cores de 8 bits
VGA
(Video Graphics
Adapter)
16 216=65 536
Cores de 16 bits
(high color)
XGA
(Extended Graphics
Array
24
28x28x28=224
=16 777 216
Cores de 24 bits
(True Color)
SVGA = SuperVGA
32 232 =4 294 967 296 Cores de 32 bits SVGA = SuperVGA
A tabela mostra a relação entre o número de bits e o número de cores que
podem ser produzidas e ainda os padrões gráficos utilizados em monitores e
placas gráficas

22. Sistemas de cores – RGB
Indexação de cor
Consiste em representar as cores dos píxeis por meio de índices de uma
tabela (Lookup Table - LUT) e que, em alguns formatos de imagem, é
armazenada juntamente com a mesma num único ficheiro. As cores são
conhecidas como cores indexadas, porque estão referenciadas pelos
número de índices que são usados pelo computador para identificar cada
cor
As cores indexadas
reduzem o tamanho dos
ficheiros de imagens. As
indexadas estão limitadas
a 256 cores, podendo ser
qualquer conjunto de 256
cores de 16,7 milhões de
24 bits de cor.

23. Paleta de cor
Designação utilizada para qualquer subconjunto de cores do total
suportado pelo sistema gráfico do computador. Uma paleta de cores pode
também ser chamada de mapa de cor, mapa de índice, tabela de cor,
tabela indexada. Cada cor dentro da paleta é identificado por um número
(índice).
A utilização das paletas
permite diminuir o tamanho
dos ficheiros de imagem,
porque são apenas
armazenadas em memória
as cores utilizadas.

24. Sistemas de cores - CMYK
É um modelo constituido por Cyan, Magenta, Yellow em
que foi acrescentada a cor preta (Black). É um padrão de
três cores “primárias”, que combinadas formam cores
ilimitadas. A cor preta foi adicionada ao modelo por ser
mais fácil a sua obtenção quando impressa em papel.

25. Sistemas de cores - CMYK
Caraterísticas do CMYK
O padrão CMYK é mais usado para impressão em papel,
onde 4 cores de tinta geram uma qualidade final melhor do
que apenas 3. Porém, monitores, televisões, etc. usam o
padrão RGB, Red, Green & Blue, onde são usadas apenas
três cores. É por isto que uma mesma imagem vista no
monitor apresenta leves alterações na tonalidade das cores
ao ser impressa.

26. Sistemas de cores - HSV
HSV é a abreviatura para o sistema de cores formado
pelas componentes Hue (Tonalidade ou matiz), Saturation
(Saturação) e Value (Valor), este último representa a
luminosidade ou brilho de uma cor.
Do ponto de vista de um artista plástico é mais fácil
manusear as cores em função de tons e sombras do que
combinações de vermelho, verde e azul.

27. Sistemas de cores - YUV
Este sistema de cores foi criado a par do
desenvolvimento de cor de televisão.
A componente Y corresponde ao brilho
(luminância) enquanto o U e o V
correspondem à cor (crominância).
Diferencia-se do RGB pois quer a cor quer o
brilho são tratados separadamente. De forma
a reduzir a informação transmitida só são
transmitidas as intensidades do azul e do
vermelho, sendo a intensidade do verde
calculada a partir da luminosidade total.

28. RGB – CMYK – HSV
• O modelo RGB permite a exibição de imagens de cor em
monitores;
• O modelo CMYK é utilizado na impressão;
• O modelo HSV é utilizado na mistura de cores do ponto
de vista artístico.

29. Cores em HTML
As cores presentes em páginas WEB utilizam normalmente
o modelo RGB.
Inicialmente os monitores apenas permitiam uma paleta
limitada de 256 cores RGB. Atualmente o uso de 16,7
milhões de cores não traz problema para qualquer
computador que tem capacidade de processar este número.
No entanto há dispositivos que permitem visualizar
documentos em HTML e cuja capacidade cromática é
limitada como por exemplo os telemóveis. Por isso para o
desenvolvimento de páginas WEB é recomendável utilizar
um conjunto de 216 cores.

30. Bitmap / Vetorial
Geração e captura de imagens

31. Formatos de ficheiros de imagem
mais comum
Existe a necessidade de transferir uma imagem de um
programa para outro, onde cada programa tem as suas
capacidades, podendo vir a acrescentar à imagem aspetos
próprios de cada um. Assim, os vários programas devem
poder importar e exportar as imagens de uns para os outros
de forma rápida e eficiente.
Os programas de computador que trabalham com imagens
estão genericamente divididos em duas categorias: formato
Bitmap-baseado num mapa de bits (imagem) e formato
Vetorial -baseado em fórmulas matemáticas (gráficos ou
desenho).

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

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

34. Bitmap / Vetorial
Programas conhecidos que criam ficheiros bitmap (pixel):
Adobe PhotoShop;
Corel Photopaint;
Corel Painter;
Paint Shop Pro.
Programas que criam arte vetorial (também conhecidos como arte
orientada ao objeto) são:
CorelDRAW;
Illustrator;
Freehand;
RealDraw
Flash.
Esses programas cada vez mais integram num mesmo programa a
manipulação dos dois tipos de ficheiros.

35. Como na física, onde um vetor é uma entidade definida pelos atributos
direção 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
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.
Imagem Vetorial

36. 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!
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.

38. Tipos de compressão de
imagem
Compressão sem perdas: a compressão
seguida pela descompressão preserva
integralmente os dados das imagem;
Compressão com perdas: a compressão
seguida da descompressão conduz à perda de
alguma informação da imagem (que pode não
ser aparente ao sistema visual humano).

39. Tipos de compressão de imagem
A técnica de compressão com perdas têm como base
de funcionamento a eliminação de alguma da informação
da imagem original, de modo a obter uma representação
mais compacta. Uma vez descartada, essa informação não
poderá ser recuperada.
Cada vez que se aplica uma técnica de compressão com
perdas, se os dados de uma imagem fossem
repetidamente comprimidos, descomprimidos e, em
seguida comprimidos novamente, a sua qualidade iria
deteriorar-se progressivamente.

40. Tipos de compressão de imagem
Compressão
SEM perda (lossless compression)
COM perda (lossy compression)
original data
compressed data
original data
compressed data recompressed data
decompressed data decompressed data
~ ~

41. Formatos de imagens bitmap:
bmp - é o formato mais comum (paint);
gif - formato de compressão sem perdas, não perdendo a qualidade quando é
alterado o seu tamanho original, ocupam pouco espaço, sendo perfeitos para
o desenvolvimento de páginas da internet. Um fx gif pode ser animado quando
várias imagens se abrem com um certo movimento;
jpeg - tem vários níveis de compressão com perdas, é um formato especial
para trabalhar em páginas web por serem fxs que ocupam pouco espaço e ás
vezes menores que os de formato gif;
pcx - é um dos formatos bit map mais antigo, criado para o programa
paintbrush;

42. pdf - criado pelo programa Adobe Acrobat, é usado para converter e
comprimir de forma substancial documentos de texto e imagem;
png - é um formato de compressão, sem perdas, que substitui o formato gif
para a web;
xcf – é utilizado na aplicação GIMP;
tiff - é um formato sem compressão utilizado em programas de edição e
pintura e com software de digitalização, é o maior em tamanho e o melhor em
qualidade de imagem;

43. Os desenhos vetoriais podem ser guardados em formato bit map mas depois
de convertidos não podem ser trabalhados como vetores.
Formatos de imagens vetoriais:
svg (scalable vector graphics) - tende a ser um formato padrão para a web e
definir sobre a linguagem XML;
sxd - formato do open office permite de forma simples o desenho vetorial em
trabalhos;
cdr - é utilizado na aplicação corel draw;
wmf (windows meta file) - é reconhecido pela maioria dos programas de
edição de texto ou de imagem do microsoft office;