imagem estática - midiacom.uff.brdebora/redesmm/pdf/parte4.pdf · 1 fundamentos de sistemas...

1

Fundamentos de Sistemas MultimídiaFundamentos de Sistemas Multimídia

Imagem Estática

Profa. Débora Christina Muchaluat [email protected]

Imagem EstáticaImagem Estática


Departamento de Engenharia de Telecomunicações Departamento de Engenharia de Telecomunicações -- UFFUFF

2


Imagem EstáticaImagem Estática

� BMP� GIF� TIFF� PNG� JPEG

3


BMPBMP

� Bitmap� Usado no Windows� Baseado no modelo RGB� Profundidade do pixel

• 1 (preto/branco), 4, 8 e 24 bits� Pode usar codificação por carreira (run-length)� Tipos de compressão

• 0 - no compression – mais comum• 1 - 8 bit run length encoding• 2 - 4 bit run length encoding• 3 - RGB bitmap with mask (transparência)

4


BMPBMP

� Formato bitmap• Uso de uma tabela de cores (palette)

5


BMPBMP

� Formato bitmap• Sem tabela de cores

6


BMPBMP

� Formato bitmap• Cabeçalho (header + info)

– informações sobre tamanho, profundidade do pixel etipo de compressão

• tabela de cores – indica todas as cores usadas no bitmap (exceto para

representação de 24 bits por pixel)– formato 4 bytes por linha (B, G, R, reservado)

• Região de dados – valor de cada pixel em linhas(múltiplos de 32 bits/4 bytes)

– Ex.: 6 bytes que representam uma linha em um bitmap:

• A0 37 F2 8B 31 C4– Devem ser salvos como:

• A0 37 F2 8B 31 C4 00 00• Arquivo .bmp armazena linhas de baixo para cima

7


GIFGIF

� Graphics Interchange Format• Formato proprietário da CompuServe

� 24 bits por pixel (8 bits por componente R, G, B)� GIF utiliza uma tabela de 256 cores com as cores mais

usadas na imagem• Global color table• Local color table

� Cada valor na tabela tem 24 bits� Utiliza o índice da tabela (8 bits) para representar cada

pixel da imagem� Reduz o número de cores representadas para 256

• Comprime de 24 bits para 8 bits• Compressão de 3:1 9


GIF GIF –– modo básico de operaçãomodo básico de operação

10


GIFGIF

� LZW pode ser usado� Tabela de 512 entradas

• 256 cores mais usadas• Mais 256 combinações de 3 índices de 8 bits

� Tabela de tamanho variável para acomodar mais combinações de 3 índices

� Extensões permitem• definir uma cor transparente• animação• entrelaçamento

11


GIFGIF

12


GIFGIF

� Permite que imagem seja transferida por partes• modo entrelaçado

� Útil para transferência em canais de baixa taxa ou com taxa de transmissão variável (Internet)

� Descompressão pode ser feita de forma progressiva

� Dados divididos em 4 grupos:• 1/8, 1/8, 1/4, 1/2

13


GIFGIF

14


TIFFTIFF

� Tagged Image File Format – padrão ANSI� Resolução de até 48 bits por pixel (16 bits por

componente R, G, B)� Usado para Imagens e documentos digitalizados� Formato usado é indicado por um código

• Formato não comprimido (code number = 1)• Comprimido com LZW (code number = 5)

� Códigos 2, 3 e 4 são usados para documentos digitalizados (mesmo formato de fax)

15


TIFFTIFF

� Compressão com LZW• Mesma do GIF• Tabela inicial de 256 cores que pode ser estendida

até 4096 entradas (212)� Algumas extensões ao TIFF dão suporte a modo

entrelaçado, mas não o padrão

16


PNGPNG

� Portable Network Graphics� Padrão W3C – World-Wide Consortium

• Padrão ISO 15948:2003� Projetado para substituir GIF e TIFF

17


PNG x GIFPNG x GIF

� Vantagens sobre GIF:• Alpha channel, usado para especificar transparência

– GIF só suporta transparência binária (cada pixel é transparente ou opaco)

– PNG suporta vários níveis de transparência• Gamma correction, para corrigir diferenças entre o brilho da imagem em

monitores de diferentes plataformas– Ex.: imagens editadas em Mac parecem mais escuras em PC

• Entrelaçamento bidimensional• Melhor compressão (diferença de 5% a 25%)

� Desvantagens:• Não suporta animação• Representação de imagem única somente• Extensão para múltiplas imagens

– MNG – Multiple-Image Network Format

18


PNGPNG

� Tipos de imagens:• tons de cinza• true color (RGB) • com tabela de cores (palette)• tons de cinza com alpha channel• true color (RGB) com alpha channel

� Profundidade do pixel:• 1 a 16 bits por componente

� Formato de compressão sem perda:• Compactação com LZ77 e Huffman

� Interessante para armazenar estágios intermediários da edição de uma imagem (em comparação com JPEG)

19


PNGPNG

� Tipos de imagem PNG

20


PNGPNG

� True color com alpha channel

21


PNGPNG

� Com tabela de cores (palette) – indexed colour

22


PNGPNG

� Modo entrelaçado em 7 passos

23


PNGPNG

� Filtros de Compressão por linha• Objetivo: preparar os dados da imagem para

compressão ótima

24


PNGPNG

� Filtros de compressão • Aplicados a bytes, não pixels• Imagem entrelaçada => cada passo é tratado

separadamente� Pixel anterior, superior ou superior esquerdo

podem ser usados no cálculo do valor do filtro� Decodificador precisa guardar linha anterior

a

bcx

25


PNGPNG

� Tipos de filtros de compressão

Filt(x) = Orig(x) - PaethPredictor(Orig(a), Orig(b), Orig(c)) Paeth4

Filt(x) = Orig(x) - (Orig(a) + Orig(b)) / 2Average3

Filt(x) = Orig(x) - Orig(b)Up2

Filt(x) = Orig(x) - Orig(a)Sub1

Filt(x) = Orig(x)None0

CodificaçãoNomeTipo

26


PNGPNG

� Filtro de Compressão Paeth (Paeth Predictor)• Criado por Alan Paeth

27


PNGPNG

� Codificação

28


JPEGJPEG

� Joint Photographic Experts Group� Padrão ISO – IS 10918� Define vários modos de compressão para uso em

diversas aplicações• Modo seqüencial com perdas – modo básico

– Compressão de imagens monocromáticas e coloridas� 5 estágios principais:

• Preparação da imagem/bloco, DCT, quantização, codificação por entropia, construção dos quadros

29


JPEGJPEG

30


JPEGJPEG

� Preparação da imagem/bloco• Imagens monocromáticas, tons de cinza ou usando tabela de

cores– 1 matriz

• Imagem em RGB ou YCrCb– 3 matrizes, uma para cada componente– Matrizes de Cr e Cb podem ser menores (Ex.: 4:2:0)

• Cada elemento de uma matriz pode ter 8 ou 12 bits• Divisão das matrizes em blocos de 8 x 8 submatrizes

– Cálculo da transformada para cada posição usa todos os valores da matriz

– Mais rápido em matrizes menores (8 x 8)• Ex.: imagem 640 x 480 => 80x60 (4800) blocos de 8x8

31


JPEGJPEG

32


JPEGJPEG

33


JPEGJPEG

� Cálculo da Transformada Discreta de Co-senos • DCT • Discrete Cosine Transform

• Todos os 64 valores na matriz de entrada P[x,y] (f(x,y))contribuem para cada entrada na matriz transformada F[i,j] (F(u,v))

• F[0,0] = coeficiente DC – média de todos os 64 valores• Outros valores são chamados coeficientes AC

– Para j=0 (linha) => coeficientes de freqüência horizontal– Para i=0 (coluna) => coeficientes de freqüência vertical

34


JPEGJPEG

35


JPEGJPEG

� Quantização• Olho humano é mais sensível ao coeficiente DC e

coeficientes de freqüências espaciais mais baixas• Freqüências muito altas não são percebidas

– Coeficientes descartados (setados como zero) na matriz transformada

• Threshold para cada coeficiente (tabela de quantização)– Divisão do coeficiente pelo threshold– Quociente da divisão é arredondado para valor inteiro (erro de

quantização => perda de informação)• Tabela de quantização

– Padrão tem 2 tabelas defaults (luminância, crominância)– Pode usar tabela específica

36


JPEGJPEG

37


JPEGJPEG

38


JPEGJPEG

� Conclusões sobre a quantização:• O cálculo dos coeficientes quantizados envolve

arredondamento para o valor inteiro mais próximo• Os valores de threshold usados aumentam à medida

que as freqüências espaciais aumentam• O coeficiente DC é o maior na matriz transformada• Muitos dos coeficientes de freqüências mais altas

são nulos� Últimos 2 pontos são explorados na codificação

por entropia (próximo estágio)

39


JPEGJPEG

� Codificação por entropia (4 passos)• Vetorização (vectoring)• Codificação diferencial (preditiva)• Codificação por carreira (run-length)• Codificação de Huffman

� Estágio também conhecido como• Variable-length coding (VLC) stage

� Utiliza codewords de tamanho variável

40


JPEGJPEG

� Vetorização• Transformação da matriz de 2 dimensões em um vetor• Coeficientes mais baixos são maiores• Varredura da matriz em zig-zag

41


JPEGJPEG

� Codificação diferencial• Coeficiente DC

� Codificação por carreira• Coeficientes AC

42


JPEGJPEG

� Codificação diferencial• Coeficiente DC • Como blocos são pequenos, não tem muita variação entre

coeficientes DC de blocos sucessivos– Valor é codificado como diferença do valor do bloco corrente

para o anterior– O primeiro em relação a 0 (zero)

• Ex.: 12, 13, 11, 11, 10, ...• Diferenças: 12, 1, -2, 0, 1, ...• Codificação usa o formato (SSS, valor), onde SSS indica o

número de bits necessários para codificador o valor

43


JPEGJPEG

� Codificação Diferencial• Exemplo: 12, 1, -2, 0, 1• Valores negativos são codificados com o

complemento do binário (sem sinal)� Valor SSS Valor Codificado

• 12 4 1100• 1 1 1• -2 2 01• 0 0• -1 1 0

44


JPEGJPEG

� Regras usadas na codificação diferencial

45


JPEGJPEG

� Codificação por carreira• 63 Coeficientes AC• O vetor contém longas strings de 0 (zero)• Coeficientes AC são codificados usando uma string de pares

de valores• Codificação usa o formato (skip, value)

– Skip = número de zeros– Value = próximo coeficiente não-nulo

• (0,6)(0,7)(0,3)(0,3)(0,3)(0,2)(0,2)(0,2)(0,2)(0,0)• (0,0) indica o final da string (todos os coeficientes restantes

são zero - 0)

46


JPEGJPEG

� Codificação do valor (value) • usa o formato (SSS, valor), onde SSS indica o

número de bits necessários para codificador o valor� Exemplo: (0,6)(0,7)(3,3)(0,-1),(0,0)� Coef. AC Skip SSS Valor

• 0,6 0 3 110• 0,7 0 3 111• 3,3 3 2 11• 0,-1 0 1 0• 0,0 0 0

47


JPEGJPEG

� Codificação de Huffman• Usada para codificar a saída

das codificações diferencial e por carreira

� Para coeficientes DC, o campo SSS é codificado com Huffman• Decodificador determina sem

dúvidas o primeiro SSS do restante dos bits codificados

� Tabela de Huffman default ou específica

48


JPEGJPEG

� Exemplo: 12, 1, -2, 0, 1� Valor SSS SSS(Huff.) Valor Bitstream

• 12 4 101 1100 1011100• 1 1 011 1 0111• -2 2 100 01 10001• 0 0 010 010• -1 1 011 0 0110

49


JPEGJPEG

� Para coeficientes AC, os campos Skip e SSS são tratados em conjunto (como um símbolo composto)• Skip varia de 0 a 15• SSS varia de 0 a 10

� Tabela de Huffman default ou específica (deve ser enviada junto com o bitstream)

50


JPEGJPEG

� Exemplo: (0,6)(0,7)(3,3)(0,-1),(0,0)� Coef. AC Skip/SSS cód. Huff. Valor

• 0,6 0/3 100 110• 0,7 0/3 100 111• 3,3 3/2 111110111 11• 0,-1 0/1 00 0• 0,0 0/0 1010 (end of block)

� Bitstream:• 100110 100111 11111011111 000 1010

� No exemplo:• 30 bits para codificar coeficientes AC, assumindo 7 bits para coeficiente

DC = total de 37 bits• Suponha que cada pixel da matriz 8x8 original tivesse 8 bits• Taxa de compressão resultante:

– 512/37 => 13,8:151


JPEGJPEG

� Construção dos quadros• Definição da estrutura do bitstream completo de

uma imagem– Quadro (frame) JPEG

• Estrutura hierárquica

52


JPEGJPEG

53


JPEGJPEG

� Primeiro nível (level 1)• Delimitador de início• Cabeçalho

– Tamanho total da imagem em pixels– Número e tipos dos componentes usados na representação

• Tons de cinza, RGB, YCrCb– Formato de digitalização

• 4:2:2, 4:2:0, ...

• Conteúdo• Delimitador de fim

54


JPEGJPEG

� Segundo nível (level 2) – conteúdo do quadro• componentes chamados scan• cabeçalho (scan header) que contém

– Identidade dos componentes (R, G, B, ...)– Número de bits usados para digitalizar cada

componente– Tabelas de quantização utilizadas para codificar cada

componente

55


JPEGJPEG

� Terceiro nível (level 3)� Cada componente consiste de:

• 1 ou mais segmentos e cabeçalhos� Segmento

• contém um grupo de blocos 8x8– DC, skip/value, skip/value, ..., end-of-block

� Cabeçalho (segment header)• Tabelas de Huffman utilizadas na codificação de cada

segmento� Cada segmento pode ser decodificado de forma

independente dos outros• impede a propagação de erros em outros segmentos

56


Codificador JPEGCodificador JPEG

57


Decodificador JPEGDecodificador JPEG

58



� 1. Decodificador de quadros• Identifica tabelas utilizadas

� 2. Decodificação de Huffman• Usando tabela identificada

� 3. Decodificação Diferencial (coef. DC) e por Carreira (coef. AC)

� 4. “Desquantização”• Usando tabela identificada

� 5. Transformada de Co-senos inversa� 6. Construção da imagem final

59



� Transformada de Co-senos inversa:

60


JPEGJPEG

� Descompressão pode ser feita de formaprogressiva• Modo progressivo• Modo hierárquico

61


JPEGJPEG

� Modo progressivo• Seleção de espectro:

– Primeiro o coeficiente DC e os coeficientes de baixa freqüência são enviados para cada bloco; depois os coeficientes de alta freqüência

62


JPEGJPEG

� Modo progressivo• Aproximação sucessiva:

– Primeiro o coeficiente DC é enviado para cada bloco;

– depois os bits dos outros coeficientes do mais significativo para o menos significativo

– Técnica mais interessante se imagem tem muita variação (coeficientes de alta freqüência altos)

63


JPEGJPEG

� Vantagens do modo progressivo:• envia os coeficientes mais importantes juntos• Quando recebe os coeficientes mais importantes, já

começa a mostrar a imagem– Efeito: imagem aparece borrada e vai ficando mais

nítida conforme vai chegando o resto

64


JPEGJPEG

� Modo hierárquico:• Filtragem de amostras com redução de resolução

pelo fator 2 em múltiplas dimensões• Codificação da imagem reduzida• Gradativamente envia restante das amostras

� Efeito no receptor:• Melhora gradativa da resolução geométrica

� Interessante quando dispositivo receptor não tem resolução suficiente para apresentar a imagem• Basta mandar a imagem reduzida

65


JPEGJPEG

� Novo padrão JPEG 2000� ISO/IEC 15444� http://www.jpeg.org� http://www.iso.org� ISO/IEC 15444-1:2000 - Part 1: Core coding system� ISO/IEC 15444-3:2002 - Part 3: Motion JPEG 2000� ISO/IEC 15444-4:2002 - Part 4: Conformance testing� ISO/IEC 15444-6:2003 - Part 6: Compound image file

format

66


Imagem Gráfica (Vetorial)


Imagem Gráfica Imagem Gráfica ((VetorialVetorial))


Departamento de Engenharia de Telecomunicações Departamento de Engenharia de Telecomunicações -- UFFUFF

67


SVGSVG

� Scalable Vector Graphics - versão 1.1 (jan. 2003)� Padrão do W3C (www.w3.org) e ISO/IEC 15948:2003� Linguagem declarativa (XML) para descrição de

gráficos bidimensionais• Página web SVG (<svg>) ou embutido em XHTML

� Linguagem Modular• Perfil XHTML+MathML+SVG

� Visualizadores SVG (plugins)• Adobe SVG Viewer, Corel SVG Viewer

� Editores que exportam no formato SVG• Adobe Illustrator, Corel Draw

68


SVGSVG

� Características Principais:• Lida com objetos geométricos (linhas e curvas)

– Formas básicas: rect, circle, ellipse, line, polyline, polygon• Símbolos definidos pelo usuário

– <symbol>• Inclusão de imagens estáticas (raster)

– Visualizador deve dar suporte a formatos PNG e JPEG no mínimo

• Formatação de texto (ou usa folhas de estilo CSS)• Definição de metadados

69


SVGSVG

� Características Principais:• Suporte a Animação

– <animate>• Interatividade

– Execução de ações (animações ou scripts) em resposta a eventos como click, mouseover, mousedown...

• Definição de elos– <a href=“...” >

• Definição de alternativas de conteúdo basedas em atributos de teste (usuário e plataforma)

– <switch>

imagem estática - midiacom.uff.brdebora/redesmm/pdf/parte4.pdf · 1 fundamentos de sistemas...

Documents