Entry 9: Image Types and Formats

Images are all around us! When we open our beloved desktops, laptops, phones and other graphical devices, they are the first things that we can see.

Because of the ubiquitousness of images, we often neglect many of the attributes and the complexity of producing one. In this activity (Activity 3), we were tasked to devote some time on researching about the details of different image formats and types.

Amazingly, I was so surprised that many available image formats are available in the open yet I didn't know they exist at all (thanks a lot to this activity because I learned some new things again).  Indeed, there are lots of things that I would like to discuss regarding images after researching about its different file formats, types, and other technical yet useful and informative issues.

Images come in different (basic) types namely;  binary, grayscale, truecolor and indexed images.  These types of images are distinct in a way of how image pixels are represented.  Some types are discussed belong including a brief summary of their properties (this was derived using the command imfinfo() in scilab with SIP toolbox loaded.)

Image types (Basic):

• Binary Image - characterized by a bit-sized pixel value (i.e. each pixel is allowed to take only a value of 0 or 1).  These pixel values only represent black and white and are commonly used in document images.

Binary image

FileSize: 14756
Format: JPEG
Width: 400
Height: 333
Depth: 8
StorageType: truecolor
NumberOfColors: 0
ResolutionUnit: inch
XResolution: 96.000000
YResolution: 96.000000

• Grayscale Image - represented by pixel value ranging from 0-255 (8-bit in binary or x00-xFF in hexadecimal.)  This type of image can represent variations in intensity because of its available intermediate values which differs in the binary image which is restricted only to 2 values.

Grayscale Image

FileSize: 41126
Format: JPEG
Width: 400
Height: 391
Depth: 8
StorageType: truecolor
NumberOfColors: 0
ResolutionUnit: centimeter
XResolution: 72.000000
YResolution: 72.000000

• Truecolor Images - they are images composed of 24-bit valued pixels.  Method on how this image is formed is by overlaying three 8-bit/pixel matrices representing the intensity distribution for the Red, Green and Blue (RGB) components of the image.  This results to a rich image having a range of up to 16,777,216 million colors.

 Truecolor Image

FileSize: 189687
Format: JPEG
Width: 500
Height: 493
Depth: 8
StorageType: truecolor
NumberOfColors: 0
ResolutionUnit: inch
XResolution: 72.000000
YResolution: 72.000000

• Indexed Images - this type of image is characterized by the mapping of index values representing the image's colors to a colormap all contained in the image file.

 Indexed Image

FileSize: 33273

Format: GIF

Width: 290

Height: 360

Depth: 8

StorageType: indexed

NumberOfColors: 256

ResolutionUnit: centimeter

XResolution: 72.000000

YResolution: 72.000000

Image Types (Complex):

• High-Dynamic Range (HDR) Images - extended version of grayscale having a higher range of allowed pixel value ranging from 10-bit to 16-bit.

 

High-Dynamic Range Image

• Multi or Hyperspectral Image -  this image type is more sophisticated than a truecolor because it is a result of overlaying not only 3 matrices of color values but at least 10 bands of colors and that gives it its eerie look (just joking).

Multi or Hyperspectral Images

• 3D Images - this image type is practically complex starting from how its created until how 3D images are to be viewed.  The most common way of recording a 3D image is by stereoscopy and these images can be viewed using special 3D glasses.

 3D Images

This time, let's try to have some image processing using Scilab.  Honestly, I am amazed how easy Scilab deals with stuff regarding images.  You can do things in just a single command.  But Python is still the Number 1!  Going on, we processed a truecolor image by converting it into a binary image and grayscale image and checked whether how conversion affects the resulting image.

Original Image

 

//code snippet

I = imread('nature.jpeg');
size(I)


ans = 
        300.    400.    3.

Binary Image Version

BW = im2bw(I, 0.48); //converts truecolor to binary image

size(BW)

ans = 

        300.    400.

Grayscale Image Version

GR = im2gray(I); //converts truecolor to grayscale
size(GR)


ans = 
        300.    400.  

We can infer from the output of the command size() that the conversion from truecolor to either binary or grayscale flattens the image matrix.  Note that the returned value in truecolor is 3-dimensional array while after conversion, it only consisted of a 2-dimensional array.  The dimension which was lost during conversion represented the channels in the truecolor image.

Our next task was to manipulate the image used in Activity 1.  I visited my archive for Activity 1 to search for my digitized hand-made graph and tried to separate the data from the background plus other noise using image processing.

• First I imported the image to Scilab.

                I = imread('old_graph.png');
                imshow(I, [])

• I converted the image into grayscale.

                GR = im2gray(I);
                imshow(GR, [])

• The histogram of pixel values was taken.

                histplot(linspace(0, 1, 256), GR)

• I used the detail from the histogram to find a suitable threshold value in converting to binary image.

                BW = im2bw(I, 0.58);
                imshow(BW, [])

Now, I was able to separate and remove noise from the actual data curve.  The next thing to do is to search for image formats and discuss things about them.

Image formats:

• JPEG or JPG (Joint Photographic Experts Group) - the most widely used of the available image formats.  Most digital cameras are set to have this image compression format.  This is highly flexible since the user can choose the compression level which determines the proper trade off between quality and size.

• GIF (Graphics Interchange Format) - an 8-bit color image compression format widely used in the internet because of its portability and has a relatively acceptable quality but not so large file size.  This image format utilizes a lossless image compression.

• PNG (Portable Network Graphics) - an improved version of the GIF format which supports 24-bit colors as opposed to GIF which only has 8-bits.  PNG utilizes a lossless compression method which preserves the image quality.  The PNG is celebrated for it is an open source image format.

• BMP (Bitmap) - widely used in Microsoft Windows OS.  They are easy to handle but it's not compressed and as a consequence, it has a large file size.

• TIFF (Tagged Image File Format) - this file format is highly accepted in photography.  It is commonly compressed in lossless type but can sometimes be lossy.  It is usually comprised of 24-bit or 48-bit color values.  This format is usually intended for images having important details (scientific and document imaging).

To sum things up, I would rate myself a 10 because I have properly perform all the required stuff.  I learned a lot also from this activity, indeed I really do appreciate images now!

References:

• Dr. Maricor Soriano - Image Types and Formats (Handout)
• Wikipedia
• http://en.wikipedia.org/wiki/Image_format
• http://en.wikipedia.org/wiki/JPEG
• http://en.wikipedia.org/wiki/Tagged_Image_File_Format
• http://en.wikipedia.org/wiki/Portable_Network_Graphics
• http://en.wikipedia.org/wiki/Graphics_Interchange_Format
• http://en.wikipedia.org/wiki/BMP_file_format