Graphical images

Август 5, 2022

Содержание

2. Bit map color depths N bit depth can represent a range of 2N colors What is
3. More color depth Why is 24-bit color called “millions of colors”? What are the tradeoffs of
4. RGB model is additive Red=Green=Blue=0 is black (no color) Add Red only Add some blue How
5. HSB model Based on human perception Hue: color reflected from or transmitted through an object Saturation:
6. CMYK model Based on light-absorbing quality of ink printed on paper As light is absorbed, part
7. Color gamut Eyes see more than screens or printers can show Gamut is the range of
8. Alpha channel + = Alpha channel stores mask information A mask lets part of an image
9. CLUT or Palette 8-bit color is low-cost, limited gamut GIF and web-safe colors are 8-bit Indexing
10. Palette issues What happens when converting from 24- to 8-bit color depth? Dithering: finding closest possible
11. Bitmap compression .bmp, .pict or .psd files can be large CODEC (compressor/decompressor) algorithms reduce file size
12. Bitmap compression (2) JPEG uses a more complex codec: Since most neighboring pixels have similar colors,
13. GIF or JPEG? See graphics comparisons here What rules of thumb do you infer about when
14. Vector-drawn images Created from lines, rectangles, ovals, polygons using mathematical formulas RECT 0,0,300,200,RED,BLUE says: ”Draw a
15. Drawing vs. painting Drawing tools feature tools for drawing rectangles, polygons, ellipses, lines, freehand, plus reflect
17. Скачать презентацию

Слайд 2

Bit map color depths
N bit depth can represent a range of

2N colors
What is the range of 8-bit color depth (GIF)?
How many bits per pixel for monochrome?
How many bits per pixel for grey scale?

Слайд 3

More color depth
Why is 24-bit color called “millions of colors”?
What are

the tradeoffs of more or less depth?
Photorealism vs. file size
JPEG preserves 16-bit color depth
Photoshop saves in 32-bit color depth:
24-bit color: 8 bits each for red, green & blue
8-bit alpha: transparency mask

Слайд 4

RGB model is additive
Red=Green=Blue=0 is black
(no color)
Add Red only
Add

some blue

How to make pure white?

Слайд 5

HSB model
Based on human perception
Hue: color reflected from or transmitted through

an object
Saturation: strength of color (% grey)
Brightness: relative lightness from black (0%) to white (100%)

Слайд 6

CMYK model
Based on light-absorbing quality of ink printed on paper
As light

is absorbed, part of spectrum is absorbed and part reflected back to eyes
So CMYK is a subtractive model (RGB is additive)
4 channels: Cyan (C), magenta (M), yellow (Y), black (K)
In theory, pure colors should produce black, but printing inks contain impurities
So combining 3 pure colors produces muddy brown
Therefore pure K is needed to produce pure black
Hence CMYK is four-color process printing

Слайд 7

Color gamut
Eyes see more than screens or printers can show
Gamut is

the range of a color model
RGB and CMYK show different subsets of colors

Слайд 8

Alpha channel
+
=
Alpha channel stores mask information
A mask lets part

of an image be transparent so that other layers show through
8-bit mask value determines degree of transparency
So Photoshop files have 3 channels for color and 1 alpha (32 bits per pixel)

Слайд 9

CLUT or Palette
8-bit color is low-cost, limited gamut
GIF and web-safe colors

are 8-bit
Indexing millions of colors to 256 is arbitrary
Here are some standard and custom palettes

Macintosh CLUT
(Color Look-Up Table)

Web-safe palette
(216 colors)

Слайд 10

Palette issues
What happens when converting from 24- to 8-bit color depth?
Dithering:

finding closest possible color in palette
Why might a custom palette be useful?
Matching colors of a photograph
What happens when switching palettes?
Screen flashing
Avoid it by fading images to white or black

Слайд 11

Bitmap compression
.bmp, .pict or .psd files can be large
CODEC (compressor/decompressor) algorithms

reduce file size
GIF codec removes repetition
E.g., if there’s a string of 100 pixels with the code 196, GIF encodes one 8 bit number to represent the color then two numbers that repeats that value 196 times

Слайд 12

Bitmap compression (2)
JPEG uses a more complex codec:
Since most neighboring pixels

have similar colors, group them into blocks of 4 to 16 pixels.
Then determine average values for a block. E.g., for pixels 459BF0, 459BF2, 459BED and 459BF0, the average is 459BF0.
Then encode the average, plus differences for individual pixels.
Next, quantize the blocks, by calculating the average of a group of adjacent blocks.
GIF is a lossless algorithm, whereas JPEG is lossy (averaging may lose information).

Слайд 13

GIF or JPEG?
See graphics comparisons here
What rules of thumb do you

infer about when to use GIF vs JPG?
GIFs work best large areas of the same color and a moderate level of detail
JPEG works best for continuous tone images, such as full-color photographs

Слайд 14

Vector-drawn images
Created from lines, rectangles, ovals, polygons using mathematical formulas
RECT

0,0,300,200,RED,BLUE says:
”Draw a rectangle starting at 0,0 (upper left corner of screen) going 300 pixels horizontally right and 200 pixels downward, with a RED boundary and filled with BLUE.”
How can vectors be smaller than bitmaps?
Macromedia Freehand, Corel Draw & Adobe Illustrator are vector-drawing applications
Flash puts vector-drawing on the Web

Слайд 15

Drawing vs. painting
Drawing tools feature tools for drawing rectangles, polygons, ellipses,

lines, freehand, plus reflect and scale
Convert bitmaps to vector formulas by autotracing shapes
E.g., in Flash 5, Modify > Trace BitMap
Paint/image processing feature tools for paint bucket, sharpen/blur, magic wand (to copy pixels)
Convert vector-based drawings to bitmaps by rasterizing

Graphical images

Содержание

Bit map color depthsN bit depth can represent a range of

More color depthWhy is 24-bit color called “millions of colors”?What are

RGB model is additiveRed=Green=Blue=0 is black (no color)Add Red onlyAdd

HSB model Based on human perceptionHue: color reflected from or transmitted through

CMYK modelBased on light-absorbing quality of ink printed on paperAs light

Color gamutEyes see more than screens or printers can showGamut is

Alpha channel+= Alpha channel stores mask information A mask lets part

CLUT or Palette8-bit color is low-cost, limited gamutGIF and web-safe colors

Palette issuesWhat happens when converting from 24- to 8-bit color depth?Dithering:

Bitmap compression.bmp, .pict or .psd files can be largeCODEC (compressor/decompressor) algorithms

Bitmap compression (2)JPEG uses a more complex codec:Since most neighboring pixels

GIF or JPEG?See graphics comparisons hereWhat rules of thumb do you

Vector-drawn imagesCreated from lines, rectangles, ovals, polygons using mathematical formulas RECT

Drawing vs. paintingDrawing tools feature tools for drawing rectangles, polygons, ellipses,

Похожие презентации