Digital Graphics for Computer Games

• Pixels• Types of Digital Graphics (Raster and

Vector)• Compression

Pixels and Resolution• A raster image or bitmap image is made up of pixels.

• The number of pixels per inch (ppi) is a measure of the resolution of the image.

• An image that is 2048 pixels in width and 1536 pixels in height has a total of 2048×1536 = 3,145,728 pixels or 3.1 megapixels. It can be described as 2048 by 1536 pixels or a 3.1-megapixel image.

• Or we can describe pixels per length unit or pixels per area unit, such as pixels per inch or per square inch.

Pixels and Resolution• Web Images - low resolution - 72ppi (pixels per inch)

• Printed poster - high resolution - 300ppi (pixels per inch)

• Each pixel in an image has to be stored, so more pixels and higher resolution means larger file size.

Pixels and Resolution

•

Types of digital graphics: Raster images

• Raster images (bmp, gif, tiff, jpg, psd)

• images made from pixels

• Pixelate when zoomed up

• Image file size is linked to the number of pixels in an image and the color depth, or bits per pixel, of the image.

• Raster graphics deal with photographs and photo-realistic images better than vector graphics.

Vector images• Vector images (psd, wmf, fla, ai)

• use mathematical expressions to represent graphics so lower file size

• Scales up with no adverse effects (no pixelation)

• The size of the image does not correlate to the size of the file.

• File size increases only with the addition of more vectors.

• Vector graphics are suited to typesetting or for graphic design.

Compression• Image formats can be separated into three

broad categories:

• uncompressed formats

• lossy compression

• lossless compression

• take up the most amount of data, but they are exact representations of the image.

• Bitmap formats such as BMP generally are uncompressed.

Uncompressed formats

Lossy Compression• Lossy compression does not encode all the

information of the file, so when it is recovered into an image, it will not be an exact representation of the original.

• generally suited for photographs.

• not suited for illustrations, drawings and text, as compression artifacts from compressing the image will standout.

• able to compress images very effectively compared to lossless formats, as it discards certain information.

• A prime example of a lossy compression format is JPEG

Lossless Compression• suited for illustrations, drawings, text and other

material that would not look good when compressed with lossy compression.

• will encode all the information from the original, there is no loss of information in lossless compression,

• when decompressed, it will be an exact representation of the original.

• not able to achieve as high a compression as lossy compression, in most cases, so larger file sizes.

• Examples of lossless image compression is PNG and GIF. (GIF only allows 8-bit images.)