Communicating Quantitative Information

Is a picture worth 1000 words?Digital images. Number bases

Standards, CompressionWill [your] images last?

Homework: (Post project proposal). Work on Project. Postings. Vote on Election Day.

Digital images

• Basic encoding– Is a picture worth 1000 words?

• Standards– bmp, gif, jpg

• Preservation issue– will the files last on storage medium– will there be appropriate software to display

and manipulate the image

Basic encoding

• Divide image into picture elements (pixels)

• For each pixel (cell in the grid), record color– Different color spaces:

• palette-based• RGB (redness, greenness, blueness)• YUV (Y=brightness, U and V together are hue and

saturation)• other

Digital cameras marketing

• More pixels (increased resolution) means that pictures can be 'blown up' more without showing pixelations

• If you are NOT planning to make poster size pictures, you don't need more than 3megalpel? 5 megalpel?

• cameras now competing on features like modes

Palette based

• Think of painter's palette• Can only use those colors• If no match:

– painter mixes up something (creates a new color on palette)

– computer software dithers• produces spots of different colors that, hopefully, our

eyes mix together to see desired color.

The software constructs palettewhen saving this image using a format with

limited palette

Image file

• Simple bit mapped, palette– (may include the palette, with general

representation of the colors)– string of numbers, one for each pixel,

indicating how that pixel is to be painted

Contrast

• Painter (in smock) starts with palette

• Computer software (PhotoShop, Paint Shop Pro, etc. doing conversions) can construct the best palette for a given photo

Encoding

• Image file is all numbers!!• Actually, all bits (sequences of 1s and 0s)• Suppose, palette is black and white

– 0 could stand for white– 1 could stand for black

• Suppose, palette holds 4 colors– 00, 01, 10, 11 represent 4 distinct colors

• Suppose, palette holds 256 colors– 00000000, 00000001, …. 11111111

There are 256 distinct patterns of 8 1s and 0s.

Quick exercise

• How many different patterns can be made using 0s and 1s, 3 bits long? Make a list000

General formula

• Space N bits can hold 2N distinct patterns

• 1 bit can hold 2 distinct patterns (represent 2 colors) 21

• 2 bits can hold 4 distinct patterns (represent 4 colors) 22

• 3 bits can hold 8 distinct patterns 23

• 8 bits can hold 28

Image [file] size

• Say image is 300 by 400 pixels (300 wide, 400 high)

• Each pixel is 8 bits (so the picture can have 256 colors—not especially big)

• Say there is no compression (will get to this later)

• Size is 300 * 400 * 8 bits– 960000 bits

1000 words

• (Plain text file, not Word document)

• How big is a word? Assume it averages out to 6 letters.

• How many bits does a letter require?– In the standard encoding, 8 bits.

• 1000 words occupies 1000* 6 * 8 = 48000 bits

Is a picture worth 1000 words?

• Answer: it better because it costs/takes considerably more space.

• compression reduces image sizes, but only so much

What is a K?

• Kilobyte of data– Byte is 8 bits of information: a piece of

memory holding 8 slots, each a 1 or a 0.

• Kilo– Sometimes means 1000– Sometimes means 1024 (2 raised to the 10th

power = 2*2*2*2*2*2*2*2*2*2

For purple

hat

Compression

• 519 * 653 * 200 is 67781400 . This is roughly 100 times either

• 677 * 1000 is 677000

• 677 * 1024 is 683008

• So… purple hat image is compressed (encoded) to take advantage of similar line sections of color. The gif format does this.

Digital camera

• Uses a (large) palette

• Records a number for what will be each pixel

• There may be settings for color depth (amount of bits ~ numbers of colors) and resolution (size of pixel)

Standards (briefly)

• gif: uses common strings, so repeated patterns do get compressed– compression is lossless. Can restore full detail.– restricted to 256 colors– Good for line art

• jpg: uses common areas, but in a different color space and a different way (approximates changes in 8 by 8 blocks). For example, detects common levels of brightness. – compression is lossy. Cannot restore full detail.– can hold millions of colors: 8 bits for each of YUV.– Good for photographs

Number bases

• Refresher: we use the decimal system: base 10– 10 distinct symbols: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9– Base system

• first column on the left is the ones/unit place (100)• second column starting from the left is the 10s

place (101)• third column is the 100th place (102)• and so on…

Base 2

• Binary number system– have 2 symbols: 0 and 1. These are called

bits!– Base system

• first column on the left is the ones/unit place (20)• second column is the 2-place (21)• third column is the 4-place (22)• and so on

• Fewer symbols (simpler circuitry), longer strings of symbols needed

Warning

• bit is either a 0 or a 1. Abbreviation b• byte is 8 bits. Abbreviation B

• k may mean 1000 or 1024 (a power of 2)

• Mega-bit, Mega-byte, Mega-pel 1000000 bits, bytes or pixels…

• Gigabyte: 1000000000

Base 16

• Hexadecimal– 16 symbols: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C,

D, E, F.– first column is the 1s place– second column is the 16th place– third column is the 256th place– and so on.

Exercise

• Write your age in– decimal– binary– hexadecimal

• How many 16s are there (probably just 1)?• What is left over?

Use of Hexadecimal

• RGB colors– Each of red, green,

blue is allocated 8 bits takes up 2 hexadecimal digits (bad term)

– Deep red is FF0000– Deep blue is 0000FF– white is FFFFFF– black is 000000

Will digital images last

Depends on

• storage medium. Hard disks can fail. CDs and DVDs can get damaged. Memory sticks fairly robust, but ends can get damaged (and they can get lost)

• software: Need software that 'knows' the standard used for the picture– Software for display, manipulation, printing

Sound• Sound files also come in different formats.

– wav (different parameters)– mpeg– ogg

• Browsers recognize different formats

• Same issue regarding archiving– Storage needs to remain– Software to manipulate and play needs to be

available

• New formats still under development.

HTML5 fragment

<audio autobuffer>

<source src="hithard.ogg" />

<source src="hithard.mp3" />

</audio>

Video

• Video (animation) is sequence of still images shown in rapid succession.

• LARGE data files

• Compression possible per frame and from frame to frame.

• Multiple compression schemes exist and still others under development.

HTML5 fragment<video id="vid" controls="controls" preload="auto">

<source src="sfire3.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>

<source src="sfire3.theora.ogv" type='video/ogg; codecs="theora, vorbis"'>

<source src="sfire3.webmvp8.webm" type="video/webm; codec="vp8, vorbis"'">

Your browser does not accept the video tag.

</video>

Homework

• Project I

• Postings– Posting topic: problems in archiving digital

images– Old issue: major patent dispute concerning gif