Stupid Question 110 & 111: What is a digital image (raster type/ bitmap) and what is a pixel?
Since I have so many friends that work as graphic designers I might get in real trouble if I answer this question incorrectly. Lets hope I don’t.
Images are those magical colorful things we have here and there on our computer, phone and so on. We’ve gotten so used to them I think few of us hardly ask ourselves what they really are. If you work with images then you need to know.
One of the school projects we had in school was to create an image editing software, without the help of any external API’s except for the GDI+ (which isn’t external). With just a few months of programming behind us it sure was quite the challenge. With a big time constraint we just had to code 24/7 and I never took the time to really grasp what these images was all about. Being a little bit wiser now, I hope to be able to explain :)
The result of the school project
There are two main types of digital images, raster and vector types, but since people usually refer to raster images (also called bitmaps) I’ll focus on those.
A digital image is composed of small bits called pixels arranged in a rectangular array (a two-dimensional array). Imagine a grid with rows and columns, each cell would make a pixel. (But they don’t have to be rendered as squares, but for simplicity we will just go for the square analogy).
If you zoom in on an image you will see this- tiny small squares, called pixels
Pixel comes from picture element, which describes quite well what it is. It is an element in the picture. This point contains numbers that make up a color for that particular physical point. The color can be black and white (representing a gray shade or just pure white and black) or a color. Colors are either represented as RGB numbers (Red, Green, Blue) or CMYK numbers (Cyan, Magenta, Yellow and Black). Those are just different ways of describing a color.
I was talking about numbers, each pixel defines the color by holding data about the color. The data is referred to as bits per pixel, and it defines the number of distinct colors that a pixel can represent.
1bpp has just 1-bit per pixel, and as we know a bit can be either on or of. As the bits double so does the number of possible colors.
2 bpp can have 4 colors
3 bpp can have 8 colors
And so on.
Notice that you can choose this when creating a new image
Grayscale images uses just one 8 bit data per pixel, and a byte can hold values from 0-255, which means it can represent the full spectrum of gray shades (256). A little side note is that we can only distinguish between 200 shades (hence the title of the book 200 Shades of Grey) so it’s a bit more than what we need.
RBG has three 8-bit bytes, one for each RBB. So each of the three values can be anything from 0-255 (256 different values per). The combination of these three gives us 16.7 million possible combinations of colors. Cool! RGB is a 24-bit, CMYK is 32 bit.
Here is a pixel, sampled. In .Net its rather easy to find a pixel and select it, try it!
So how do we organize and save this data? We use image files. The different image files are just storage ways for the data in compressed or uncompressed form, it is not a digital image per definition- but contains one. They vary a lot and that is a different question and discussion.
Hope I you learned something new about digital images today :) I know I did, and dear pixel nerds (Yes Kim Brockie I am referring to you! Feel free to comment/correct me if I said something wrong!)
Last modified on 2012-12-22