MULTIMEDIA BASICS: UNDERSTANDING STILL IMAGES

by Steven G. Estrella, Ph.D.

What are still images?

Still images are visual representations that do not move. Text is ideal for transmitting information in a highly articulate manner that can be consistently interpreted irrespective of the user. Still images, however, allow the content creator to convey information which can be more freely interpreted by the user. A picture does indeed paint a thousand words but the meaning of the picture will vary from user to user.

Bit Depth

Pictures are often described in terms of the number of colors found in the image. A simple black and white line drawing is considered to be a 1-bit picture. The word "bit" is a contraction for "binary digit" and refers to a digit in the binary number system. Humans most often use the decimal system in which each digit can have one of 10 values (0 through 9). Computers use the binary system in which each digit can have one of two values (0 or 1), just as one light bulb can represent only two values (on or off). In the binary system a set of two bits (binary digits) can represent four values, just as two light bulbs can represent four values (on-on, on-off, off-off, off-on). The number of values that can be represented increases by a power of 2 with the addition of each bit. The use of more bits per pixel (picture element) adds more color possibilities to an image and increases the file size for the image as well.

Table 1 - Bit Depths and Sample Applications
Bits per Pixel Number of Colors Applications
1 2 Black and White Drawings
2 4 Simple Color Icons
3 8 Simple Color Icons
4 16 Simple Color Icons
5 32 Simple Color Icons
6 64 Color Icons
7 128 Color Icons
8 256 Icons, Low-res Photographs
16 65,536 Photographs, Video
24 16,777,216 True-color Photographs, Video

Pixels

The unit of measurement used for computer graphics is the pixel. The term "pixel" is a contraction for "picture element". A computer screen can be measured in pixels. Most 15-inch monitors today can be set to display a grid of pixels 640 wide by 480 tall. The horizontal and vertical pixel dimensions are referred to as the resolution. By using smaller pixels, a 15-inch monitor can also be set to display a grid of 800 by 600 pixels or 832 by 624 pixels. Larger monitors (17-inch or 20-inch) typically can use these resolutions as well as 1024 by 768. When creating a graphic for use on a computer screen, therefore, wise content creators take care to observe the lowest common denominator and avoid creating individual graphics larger than 600 pixels wide and 400 pixels tall. The size of the graphic in pixels and the number of colors found in the graphic are both important factors in the size of the file used to store the image.

File Formats

Once created (or acquired through scanning) images can be stored in electronic files on a computer's hard disk, floppy disk, or other electronic storage mechanism. Contemporary graphics software allows the user to save image files in a variety of file formats. One of the most common file formats is encapsulated PostScript (EPS). EPS files are ideal for storing images that are intended to be printed on high-resolution imagesetters or laser printers because they store detailed instructions in the PostScript page description language for recreating the image file. A PostScript-equipped imagesetter or laser printer can then recreate the image at resolutions of 300, 600, 2400, or more dots per inch (dpi). Color PostScript imagesetters can produce photorealistic output virtually indistinguishable from traditional photographic proofs. EPS is an ideal file format for the production of printed graphics but the appearance of the graphic on screen at 72 or 96 dpi is not always impressive. For multimedia applications, screen appearance is very important. That brings us to other file formats more suitable to screen display.

The Macintosh picture format (PICT) is commonly used within multimedia presentations intended to be viewed on a MacOS compatible computer. PICT files can be read by any Macintosh graphics program or mid to high-end word processor.

The cross-platform file format known as Tagged Information File Format (TIFF) is excellent for both screen display and printed output. TIFF files tend to be larger than equivalent PICT files but they offer greater color fidelity and resolution when printed. The screen appearance, however, is similar. TIFF files are ideal for multimedia presentations intended to be delivered both on the Macintosh and Windows computer platforms.

The Graphic Interchange Format (GIF) is truly universal in its appeal because GIF files can be viewed on Macintosh, Windows, and UNIX platforms. GIF files are compressed to produce small file sizes which makes them very useful for transmitting electronically over the phone lines. As a result, GIF has quickly become the standard file format used for graphics on the World Wide Web. GIF was patented by UniSys in the 1980s and popularized by CompuServe. In 1994, UniSys explored the possibility of charging all GIF developers a fee for creating files in this file format. A brief controversy ensued that threatened to bring a quick halt to the use of graphic files on the Web. Fortunately, UniSys decided to create an open license for the use of the GIF format. Had that not occurred, another file format would have been created to take its place. GIF files are ideal for line art drawings, color icons, and low-resolution photographs. GIF files can also contain multiple images that are viewed in sequence to produce simple animations. Many Web sites today exploit GIF files to enliven their pages with animated logos and drawings.

Gif anim

Graphic software like Adobe Photoshop or GIFConverter allow users to create GIF files that are optimized to use only the number of colors needed to display the image. GIF files, however, are limited to 256 colors per file which means that photographs often appear grainy and blotchy.

The Joint Photographic Experts Group (JPEG) file format was designed to store high-resolution photographic images and display them attractively on screen. JPEG is ideal for photographs that must appear as realistic as possible when viewed on a Web page. JPEG images can use millions of colors per file and use an efficient though lossy compression algorithm to reduce file size. A photograph stored as a JPEG file will have a smaller file size than the same photograph stored as a GIF file. Oddly though, simple graphics with large patches of solid color or line art often look better when using GIF than when using JPEG. All major Web browsers support JPEG.


Pic of puppy

A JPEG file of my puppy, Clara.

The choice of file format to use for any particular graphic depends on the intended platform and the need for high resolution. For printed materials, EPS is the professional's choice. For traditional multimedia presentations, TIFF has cross-platform appeal but PICT is a better choice for Macintosh-only presentations. For universal appeal on the Web, GIF is best for most graphics and JPEG is best for photographs that must be displayed at high-resolution to achieve the desired effect.

A relatively new file format is PNG. This is a vector-based file format that has great potential to improve the quality of images on the Web using very small files. PNG support among browsers varies widely.

Vector vs. Bitmapped Graphics

Images used for multimedia presentations are often created or edited in drawing and painting programs.

In drawing programs the user typically uses a tool palette which contains lines and geometric shapes. The user selects a shape by clicking on it. The user then clicks and drags within the document to create the shape. For example, a user might create a simple rectangle by clicking on the rectangle tool and then clicking and dragging to produce a rectangle within the document. Once created, the rectangle can be filled with colors and/or patterns. Graphic objects created in drawing programs can be individually selected for later editing. Drawing programs support resizing, fill changes, border width changes, and other edits on individual drawing objects. Individual pixels within an object, however, can not be edited because the object is represented to the computer as a series of vectors rather than a series of pixels. Drawing programs are convenient to use when combining several graphic objects into a layout. In this case the user often prefers to retain the ability to individually select the objects. The layout in figure 1 contains two geometric objects which can be individually selected and resized to produce the layout in figure 2.


fig 1

Figure 1 - two geometric objects created in a drawing program



fig 2

Figure 2 - the same two objects, resized and relayered.

In painting programs the user also uses a tool palette to select lines and geometric shapes. The user then clicks and drags to place the shape within the document. Once placed, however, the graphic can only be edited at the pixel level. This poses both advantages and disadvantages. One advantage of pixel level editing is that individual pixels within the object can be deleted or altered. One disadvantage is that an image may appear to contain several distinct objects but the user will be unable to individually select each object for resizing or moving as needed. Painting programs are appropriate in creating and editing individual objects. Painting objects can then be copied and pasted into drawing programs and combined with other objects to produce complex layouts. The layout in figure 3 was created by painting one geometric object on top of another. The two objects can not be individually selected once they are created but the entire graphic can be edited at the pixel level as shown in figure 2.



fig 3

Figure 3 - a simple graphic created in a painting program



fig 4

Figure 4 - the same graphic, altered at the pixel level.

When creating graphics for multimedia it is best to preserve the individual vector objects whenever possible to allow for future editing.

Acquiring Images

Very often multimedia authors use preexisting images to enhance their work. Images can be acquired from clip art collections on CDROM or through the use of a scanner. Royalty-free clip art collections are commonly available from mail order software stores. The images in these collections are free for you to use in printed and in some cases electronic publications. Check with the manufacturer before you purchase to be sure you are free to use the graphics for your intended purpose. A scanner can be used to take a digital picture of a photograph or other image and save that image as an electronic file on the computer's hard disk. Using photographs that you have taken is usually legal unless the photograph contains images of children other than your own or other persons who may require a release form before allowing you to publish the photograph. Images scanned from books may be used for educational purposes only if the use complies with "fair use" provisions in the copyright law. In most cases, this means that copyrighted images from books can not be placed on Web pages or otherwise distributed electronically without the permission of the copyright holder. Graphic images downloaded from Web sites should also be used only with the permission of the copyright holder.

When scanning images, be aware of the scanning resolution required for your project. If you are scanning for print, use 300 dpi or 600 dpi. If you are scanning an image to place on the Web, use 96 dpi. The file size of the scanned image will be larger at the larger resolutions so take care to scan images intended for the Web at no more than 96 dpi.


Return to Multimedia Basics