Computer Images

Some parts of the subject may be left out, and the article is in need of revision. Refer to the guidelines for details.

This article is primarily centered around the idea of computer images. This article discusses the different file types and their advantages/disadvantages, the types of colors, and the syntax the computer uses to determine color.

Different Image Types

There are four main image types of image files that each have unique characteristics.

Graphics Interchange Format

*.gif
Image Unavailable
This is a simple animation of the phrase, "The Archive", spelling itself out.

GIF files are barely compressed and supports transparency and multiple frames (animated images). A GIF file specifies the colour of every pixel of the image. This file format can only support 256 different colours, but it can go lower.

The special feature of the GIF file is its ability to support multiple frames and animations. This feature, however, uses no compression techniques making the file size very large for many frames. The animation can be used for demonstrations, but the image cannot be controlled.

There is a special program that is capable of combining *.gif files into an animated *.gif. The program, called UnFREEz, is available for download at WhitSoft Development.

Bitmap

BMP files are uncompressed and do not support transparency or support multiple frames. A BMP file specifies the colour of every pixel of the image.

Joint Photographic Experts Group

JPG files are compressed and do not support transparency or support multiple frames. A JPG file specifies the colour of a group of pixels (instead of each individual pixel), and therefore uses less memory. You will noticed that if an image has a lot of dark (or light) areas that the file size is smaller.

Portable Networks Grpahics

PNG files are compressed, support transparency, and do not support multiple frames. PNG files were intended to be a compressed lossless format to be used as the standard across the web. Like JPG, it specifies the colour of groups of pixels to save memory.

Image Colour Formats

You may have heard of monochrome, 16 colours, 256 colours and 24-bit files. This is all to do with the limits of each file, and the memory each saves. It has to do with the binary format in which the file is stored.

Monochrome is a 1-bit image. It uses one binary bit to determine the colour of each pixel. 0=Black, 1=White. As one byte is 8 bits, 1 byte could contain an image with an area of 8 pixels.

16 colours is a 4-bit image. It uses four binary bits to determine the colour of each pixel. 4 bits can contain a maximum of 16 unique combinations, so each pixel can have a maximum of 16 different colours. 1 byte can contain an image with an area of 2 pixels.

256 colours is an 8-bit image. It uses eight binary bits to determine the colour of each pixel. As 8 bits is 1 byte, it has a maximum of 256 unique combinations, so each pixel can have a maximum of 256 different colours. 1 byte could contain an image with an area of 1 pixel.

24-bit is a 24-bit image (no way!). It uses 24 binary bits to determine the colour of each pixel. As 24 bits is 3 bytes, it has a maximum of 256³ unique combinations. That means that each pixel can have a maximum of 16 777 216 different colours. This is why Apple uses the term "millions of colours" instead of "24-bit" when specifying the colour output of the screen.

Colour Syntax

To get more down to the nitty-gritty of 24-bit files, the first 8 bits (the first byte) are used specifically to determine a shade of red. That means there is a maximum of 256 different shades of red. The second set of 8 bits (the second byte) is used to determine a shade of green. That means there is a maximum of 256 different shades of green. The third set of 8 bits (the third byte) is used to determine a shade of blue. That means there is a maximum of 256 different shades of blue. Once each of these three colours are specified, they are mixed together to create a new colour, that determines the colour of a pixel.

That is why we specify colours in the RGB (red, green and blue) method. But why do we specify them in a hex code method?

3 bytes
First byte Second byte Third byte
1st 4 bits 2nd 4 bits 3rd 4 bits 4th 4 bits 5th 4 bits 6th 4 bits
Binary 0000 0000 0010 1010 1111 1111
Hexadecimal 0 0 2 A F F

So every 4 bits of a binary number correspond directly with a hexadecimal value. What about decimal?

3 bytes
First byte Second byte Third byte
Binary 00000000 00101010 11111111
Hexadecimal 00 2A FF
Decimal 0 42 255

Nothing seems special about decimal — yet…

1 PIXEL
RED GREEN BLUE
Binary 00000000 00101010 11111111
Hexadecimal 00 2A FF
Decimal 0 42 255

Ahhh!

It so happens that the three bytes I specified form together to form the colour RGB(0,42,255). That converts to the hex code #002AFF, which is a nice variation of blue.

If you go to Microsoft Paint, and go to save an image, you will notice it gives many options of BMP files to save in. This is because BMP files can be stored as 1-bit, 4-bit, 8-bit and 24-bit images, to either save on memory or maximise in brilliance of image quality.

Formulas

Calculate Bits

This is the formula for calculating the number of bits used in an image:

(1)
\begin{align} \definecolor{darkgreen}{rgb}{0.90,0.91,0.859}\pagecolor{darkgreen} \ b = \frac {a \log_{10}(c)}{\log_{10}(2)} = a\log_2(c) \end{align}

Where:
a=area in pixels of the image
b=bits that the image takes up
c=number of different colours possible

Calculate Possible Images

This is the formula for calculating the number of possible images an image of certain dimensions can display:

(2)
\begin{align} \definecolor{darkgreen}{rgb}{0.90,0.91,0.859}\pagecolor{darkgreen} \ n = c^a \end{align}

Where:
a=area in pixels of the image
c=number of different colours possible
n=number of combinations for the dimensions of that particular image

References

This article comes from James KanjoJames Kanjo's post at the TI-Basic Developer
http://webstyleguide.com/graphics/gifs.html
http://schmidt.devlib.org/file-formats/gif-image-file-format.html
http://www.whitsoftdev.com/unfreez/
http://tarm.wikidot.com/local--files/art:archived-random-flash/Teal-Mote%20Archive.gif File by WispWisp

Unless otherwise stated, the content of this page is licensed under Creative Commons Attribution-ShareAlike 3.0 License