 By Bob “The Bird” Fiske & Anita “The Snail” Cost

 Bitmaps & the brightness grayscale  Color pictures are red, green & blue  Storing bitmaps as files  Compressing bitmap data

 A bitmap is not a bit of a map or maybe it is.  It might be a map bit but not in the computer world  A bitmap is an image made up of tiny little pixels, not to be confused with pixies.  Pixels are tiny dots of color within a computer image

 A grayscale image is what you might call a “black and white” picture  The grayscale determines the brightness of each pixel  Each pixel is a number between 0 and 255.  This represents a scale of brightness going from  black (0) to white (255) and  shades of gray (the numbers in between).

 First row of a bitmap picture:  A lower down row in the picture:

 To get a color image, you combine 3 primary colors.  The commonly used colors are RGB (red, green and blue).  When we show a color picture on the computer, we are combining 3 black and white images  By sending them through the 3 color channels (RGB).

 How do they do it? In essence, you make 3 black and white images of the picture  filtered through a red filter,  filtered through a green filter, and  filtered through a blue filter. Red imageGreen imageBlue image

Red channelGreen channelBlue channel Combine to create…

 Each grayscale pixel uses 1 byte of storage  This is the same as 8 bits  A bit stores either a 1 or a 0  8 bits are necessary to encode the numbers 0 to 255  8 bits = 1 byte  If I have 1000 pixels, that is 1 kilobyte (KB)  Technically, a KB is actually 1024 bytes Computer math is funny. Ha ha!

 If I have a color image that has 245 pixels per row, and 200 rows  The number of pixels is: 245 x 200 = 49,000 pixels  But it's a color image, so in fact it's 3 grayscale images: 3 x 49,000 = 147,000 pixels  And each pixel uses 1 byte.  So I'm using 147,000 bytes.  How many kilobytes? 147,000 / 1024 = KB  144 KB!?! And that is a small bitmap image!

 A Bitmap image (known as a BMP) uses full memory storage for each pixel  There are many schemes for compressing this data into a smaller file  Compression compacts the data before it stores it to a file.

 JPEG is one type of compression scheme.  JPEG is a "lossy" compression It changes the original data.  Another compression scheme that is very widely used is GIF.  GIF is a "lossless" compression It preserves the original data.  A much older compression is the 256-color bitmap  This method compresses the color scale to save on file space

 How many colors?  With an RGB image, each pixel consists of 8 bits times 3  For the 3 color images  That’s a total of 24 bits for each color pixel  The total colors that can be produced by a single pixel in this system is:  Red channel: 0 to 255 (256 colors)  Green channel: 0 to 255 (256 colors)  Blue channel: 0 to 255 (256 colors)  (See the next slide)

 The total number of combinations is 256 x 256 x 256  So, the total number of possible colors is 256 x 256 x 256 = 16,777,216

 There is an older bitmap encoding that doesn’t use 16 million colors  Instead, it uses only 256 colors  This makes it possible to use only a single pixel image plane Instead of the separate Red, Green and Blue image planes combined into a single picture  There is a tradeoff, however:  The 256 colors are actually a color-and-brightness scale at the same time. This means that you don’t get the full range of colors You also don’t get the full range of brightness levels

 GIF compression compresses the image like this: Run Length Encoding  With this scheme, the data can be packaged tightly, using less file space  Yet it can also be perfectly unpacked  That restores the original image data.

 In run length compression, you count the number of repeated pixels.  Start with this:  After compression, end with this: 2:0s, 1:1, 1:6, 1:18, 5:20s,4:24s 1:148, 1:152, 1:200, 4:210s, 2:150s, 1:100, 1:78, 3:60s  This is lossless encoding  The original data can be brought back  It works best with “geometric” images  These are non-photographic images that have large regions consisting of the same color value

 See how this geometric image uses the same color pixels over and over?  This is ideal for saving space using GIF encoding

 Oh yeah, I forgot. When I converted my bitmap to GIF, it also did a color compression  Storing each 24-bit pixel as an 8-bit pixel  This is the same as my 256-color bitmap.

 JPEG uses a sophisticated mathematical compression based on Fourier analysis. So it's hard to describe what is happening to the data.  As if I could!  I’m not that nerdy!  Suffice it to say, the while the data is being compressed, it is being changed:  Errors are introduced.

 Does anybody complain about the JPEG errors?  In photographic images (that don't actually contain sharp edges), the errors are not noticeable.  In "geometric images" that contain lots of straight lines and regions of uniform color, the errors become noticeable They appear as "edge echoes". Photographic Geometric