Everything Is Numbers

Monday, June 30th, 2008

I’ve started teaching a programming class to the non-programmers I work with and decided to write up some of the lessons here.  In the last installment, I discussed binary numbers. This time we’ll go a little further and explain how those numbers can be used to describe other things like pictures and words.

Computers are just a bunch of ones and zeros and you now know how those ones and zeros can be used to make numbers. But ones and zeros can be used to represent all sorts of different things, from words to photos to Ricky Martin songs… lots and lots of Ricky Martin songs.

So lets take a look at how binary numbers can be used to represent other data — for example, what you are reading right now.

Text
Perhaps you remember the scene from A Christmas Story where Ralphie finally gets his Little Orphan Annie decoder ring, locks himself in the bathroom and begins translating a string of numbers into letters. That is exactly how computers store text as well. Each letter is encoded as a unique number and each number is encoded in binary.

The most obvious way to encode letters as numbers is to set A=1, B=2, and then go through the alphabet until Z=26. This works okay, but what about punctuation, numbers, uppercase and lowercase letters, and this thing: §?

The standard system used to encode characters in computers is called ASCII. Originally it used 7-bits for each character, allowing for 128 unique values. It was then extended to 8 bits, bringing the total to 256. Here is a table showing how letters and other characters are actually encoded in ASCII.

Go ahead and decode this ASCII message:

89-111-117-32-115-109-101-108-108

And just for fun, here’s what it looks like in binary (using 7-bits for each character):

101100111011111110101010000011100111101101110010111011001101100

First one to decode it and post the answer in the comments gets a prize!

Graphics
Images displayed on the screen can also be represented using numbers. First lets take a look at what an image is. Here’s an image from the Internet. If we zoom in on a small section of it, we see that it is made up of many tiny squares of color. We call these squares “pixels,” which is short for “picture element.”

Images have a lot of pixels. Modern digital cameras take photos using upwards of 5 megapixels (or as my uncle calls them, “megapickles.”) A megapixel is one million pixels.

Just like text is a string of numbers representing characters, an image is just a string of numbers representing colors. This is easy to visualize if we have an image with only two colors: black and white. We will represent black with the number 0 and white with the number 1. If we say the image is 10 pixels wide and 10 pixels high, the image would look something like this:

Can you see the smiley face in the numbers? Black and white images are often called “1-bit images” because each pixel can be represented with a single bit. Of course, if this were real data, it wouldn’t be arranged in a grid. It would just be a list of numbers:

0 0 0 0 0 0 0 0 0 0 0 0 1 0 0 0 0 1 0 0 0 1 1 1 0 0 1 1 1 0 0 0 1 0 0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0 0 0 0 0 0 1 0 0 0 1 0 0 0 0 1 0 0 0 0 0 1 1 1 1 0 0 0 0 0 0 0 0 0 0 0 0 0

There you have it, an image file for a 10×10 1-bit image. If we want more than 2 colors, we will need to come up with a way to encode color information and that will take more than 1 bit per pixel.

Colors
Every color can be represented by some combination of red, green and blue. If you don’t believe me, you can play around with the color schemer.  Most modern computers use 24 bits to represent each color.  8 bits for red, 8 bits for green and 8 bits for blue — RGB.  Since an 8-bit number has a range from 0 to 255, we could represent the color red as 255-0-0.  That is, The maximum amount of red, no green, and no blue.  For magenta, we’d want a combination of red and blue, but no green: 255-0-255.

In binary, a red pixel would look something like ths:

1 1 1 1 1 1 1 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0

That is, eight 1′s representing the maximum value for “red.”  Eight 0′s for green, and eight 0′s for blue.  Then we’d just move on to the next pixel, and the next, and so forth, until each pixel of the jerk-bird stealing that nice man’s ice cream cone is represented.

Previous Lesson: It’s easy to count to one

Comments

89-101-97-104-44-32-119-101-108-108-44-32-115-111-32-100-111-32-121-111-117-33-33-33-32-80-76-66-84-84-76-66-76-84-66-76-84

Touché, Dave.

~ Evan      

Does not compute. Does not compute.

Thanks! That was much less painless and way more informative than the whole computer science semester that I took at Purdue.

Post a Comment

NameE-MailWebsite