Chapter 2: Concepts, Terms and Definitions

Introduction
Before examining to different specialisms that make up computer graphics, this chapter provides
a quick review of the basic terms and definitions that are common to most areas of computer
graphics.
Low level concepts
All of computer graphics is based upon the properties of the screen or display device. The
fundamental thing that you need to know about displays is that they are divided into lots of small
squares called pixels (“PICture ELements”).

The simplest way to think of how this works is to stick to black and white. Each pixel can be set
to black or white (i.e. turned on or off). This allows patterns of dots to be created on the screen.
Memory Mapping
Drawing on the screen is therefore simply a matter of setting the right pixels either on or off.
Each pixel on the screen corresponds to an address in the computer’s memory - this is known as
memory mapping and the display is said to be a “memory mapped display.” Effectively, each
pixel is numbered - sequentially.
By writing values to the correct locations in memory (this used to be called “poking the
address”) the appearance of the screen can be controlled by a programmer. Conversely, by
inspecting the contents of a memory location (“peeking”), a program can find out if a pixel is
turned on or off.
The portion of memory that is associated with the display is known as the “video memory”. In
the PC architecture, this memory is usually physically located on the graphics card, which is why
you can buy 8Mb graphics cards, 16Mb graphics cards etc.
Resolution
The screen in this example is composed of 300 pixels arranged in 15 rows of 20. It is said to
have a resolution of “20 by 15” (20 x 15). This is actually very small by today’s standards.
Typically, a display will have a resolution of 1024x768 maybe even more.
Screen size
Resolution is NOT the same thing as screen size. Our 20x15 display could have been 5cm across
(as a mobile phone display), 40cm across (as a monitor) or 20m (as a projection system) but the
resolution would always be 20x15.

Coordinates
Whilst the computer “thinks” of its display as a simple list of addresses, it is much more
convenient (for reasons which will become clear later) for us to think in terms of coordinates and
leave it to the computer to convert the coordinates to memory location itself.
Each pixel can be referred to by a pair of numbers known as its coordinates - an x coordinate
(which gives the column’s number and a y coordinate which gives the row number. The
coordinates are always written as a pair of numbers, separated by a comma and enclosed in
brackets. This system of geometry is known as “Cartesian geometry” and the coordinates are
spoken of as being “Cartesian Coordinates.”
Example. Simple coordinate example
In Figure above - “Coordinates” - pixel (7,2) is set ON.
The computer converts coordinates to memory addresses by subtracting the y coordinate from
the number of rows on the display minus 1 (i.e. Ysize -1, this effectively turns the y axis upside-
down to make sure that the origin is at the bottom), multiplying that by the number of columns
on the display
(Xsize), and adding the x coordinate.
location = ((Y * Xsize) + x).
(7,12) becomes ((2*20) + 7) = 47
The origin
In this above example, the origin or (0,0) is in the bottom-left of the screen. It is also possible to
have the origin in the top-left, in which case the rows (y coordinates) are numbered downwards
Colour
In discussion so far, we have been restricted to black and white i.e. each pixel can only be on or
off. Colour can be represented in most of today’s computers. Typically, instead of each pixel
being represented by one bit (on or off) each pixel will be represented by 24 bits - 3 x 8 bit bytes.
Each byte represents a number between 0 and 255 and each byte is associated with one primary
colour - red, blue, green.
Image files
From Figure above - “Colour smiley” it is hopefully only a small step to see how Figure below -
“smiley.bmp” works. The pattern of bits in the computer’s memory forms what is know as a
bitmap.
By simply writing those values out to a data file and prepending information about the width and
depth of the image, a picture can be saved onto disk and this is indeed the approach taken by all
the common graphical formats seen on the WWW such as.gifs,.jpegs, etc.
It is then an even smaller step (increase the number of pixels (i.e the resolution)) to see how
Figure below - “Carol Smiley” works.
Image file formats
Image file formats are standardized means of organizing and storing digital images. Image
files are composed of digital data in one of these formats that can be rasterized for use on a
computer display or printer. An image file format may store data in uncompressed,
compressed, or vector formats. Once rasterized, an image becomes a grid of pixels, each of
which has a number of bits to designate its color equal to the color depth of the device
displaying it.
Image file sizes
In raster images, Image file size is positively correlated to the number of pixels in an image
and the color depth, or bits per pixel, of the image. Images can be compressed in various
ways, however. Compression uses an algorithm that stores an exact representation or an
approximation of the original image in a smaller number of bytes that can be expanded back
to its uncompressed form with a corresponding decompression algorithm. Considering
different compressions, it is common for two images of the same number of pixels and color
 depth to have a very different compressed file size. Considering exactly the same
compression, number of pixels, and color depth for two images, different graphical
complexity of the original images may also result in very different file sizes after
compression due to the nature of compression algorithms. With some compression formats,
images that are less complex may result in smaller compressed file sizes. This characteristic
sometimes results in a smaller file size for some lossless formats than lossy formats. For
example, simple images may be losslessly compressed into a GIF or PNG format and result
in a smaller file size than a lossy JPEG format.
Vector images, unlike raster images, can be any dimension independent of file size. File size
increases only with the addition of more vectors.
Image file compression
There are two types of image file compression algorithms: lossless and lossy.
1. Lossless compression algorithms reduce file size while preserving a perfect copy of the
original uncompressed image. Lossless compression generally, but not exclusively, results in
larger files than lossy compression. Lossless compression should be used to avoid
accumulating stages of re-compression when editing images.
2. Lossy compression algorithms preserve a representation of the original uncompressed image
that may appear to be a perfect copy, but it is not a perfect copy. Oftentimes lossy
compression is able to achieve smaller file sizes than lossless compression. Most lossy
compression algorithms allow for variable compression that trades image quality for file size.
Major graphic file formats
1. Raster formats
a. GIF- stands for graphics interchange format, a bit-mapped graphics file format
used by the World Wide Web, CompuServe and many bulletin board system. GIF
supports color and various resolutions. It also includes data compression, but
because it is limited to 256 colors, it is more effective for scanned images such as
illustrations rather than color photos.
b. JPEG - Short for Joint Photographic Experts Group, and pronounced jay-peg.
JPEG is a lossy compression technique for color images. Although it can reduce
files sizes to about 5% of their normal size, some detail is lost in the compression.
 c. TIFF - Acronym for tagged image file format, one of the most widely supported
file formats for storing bit-mapped images on personal computers (both PCs and
Macintosh computers). Other popular formats are BMP and PCX. TIFF graphics
can be any resolution, and they can be black and white, gray-scaled, or color.
Files in TIFF format often end with a .tif extension.
d. MPEG - Short for Moving Picture Experts Group, and pronounced m-peg, is a
working group of the ISO. The term also refers to the family of digital video
compression standards and file formats developed by the group. MPEG generally
produces better-quality video than competing formats, such as Video for
Windows, Indeo and QuickTime. MPEG files previously on PCs needed hardware
decoders (codecs) for MPEG processing. Today, however, PCs can use software-
only codecs including products from RealNetworks, QuickTime or Windows
Media Player. MPEG algorithms compress data to form small bits that can be
easily transmitted and then decompressed. MPEG achieves its high compression
rate by storing only the changes from one frame to another, instead of each entire
frame. The video information is then encoded using a technique called Discrete
Cosine Transform (DCT). MPEG uses a type of lossy compression, since some
data is removed. But the diminishment of data is generally imperceptible to the
human eye.
e. PNG - Short for Portable Network Graphics, and pronounced ping, a new bit-
mapped graphics format similar to GIF. In fact, PNG was approved as a standard
by the World Wide Web consortium to replace GIF because GIF uses a patented
data compression algorithm called LZW. In contrast, PNG is completely patent-
and license-free. The most recent versions of Netscape Navigator and Microsoft
Internet Explorer now support PNG.
f. BMP - The standard bit-mapped graphics format used in the Windows
environment. By convention, graphics files in the BMP format end with a.BMP
extension. BMP files store graphics in a format called device-independent bitmap
(DIB).
2. Vector formats
As opposed to the raster image formats above (where the data describes the characteristics of
each individual pixel), vector image formats contain a geometric description which can be
rendered smoothly at any desired display size. At some point, all vector graphics must be
rasterized in order to be displayed on digital monitors. However, vector images can be
displayed with analog CRT technology such as that used in some electronic test equipment,
medical monitors, radar displays, laser shows and early video games. Plotters are printers that
use vector data rather than pixel data to draw graphics.
a. CGM - CGM (Computer Graphics Metafile) is a file format for 2D vector
graphics, raster graphics, and text, and is defined by ISO/IEC 8632. All graphical
elements can be specified in a textual source file that can be compiled into a
binary file or one of two text representations. CGM provides a means of graphics
data interchange for computer representation of 2D graphical information
independent from any particular application, system, platform, or device. It has
been adopted to some extent in the areas of technical illustration and professional
design, but has largely been superseded by formats such as SVG and DXF.
b. Gerber Format (RS-274X) - RS-274X Extended Gerber Format was developed by
Gerber Systems Corp., now Ucamco. This is a 2D bi-level image description
format. It is the de-facto standard format used by printed circuit board or PCB
software. It is also widely used in other industries requiring high-precision 2D bi-
level images.
c. SVG - SVG (Scalable Vector Graphics) is an open standard created and
developed by the World Wide Web Consortium to address the need (and attempts
of several corporations) for a versatile, scriptable and all-purpose vector format
for the web and otherwise. The SVG format does not have a compression scheme
of its own, but due to the textual nature of XML, an SVG graphic can be
compressed using a program such as gzip. Because of its scripting potential, SVG
is a key component in web applications: interactive web pages that look and act
like applications.