Graded Unit Revision Photoshop

Overview
The topics we need to discuss: Categories of digital graphics. The purpose of digital graphics in applications Uses of different types of digital graphics Attributes of graphics File formats Compression Software Applications

Categories of digital graphics

The topics we need to discuss: Bitmap Vector Meta Animated

Bitmaps (Raster graphics)

Made up from rectangular picture elements called pixels Each pixel contains a specified number of bits hence bitmap A bitmap file has a large size because it saves colour information for each pixel Color depth is the amount of colours per pixel The greater the number of bits the better the quality but the larger the file size If resolution is too low, they becomes pixellated Anti-aliasing is a technique for smoothing out the sharp edges of a bitmap Resolution is a measure of how finely a device displays bitmapped graphics Bitmaps going onto a website should have an 4

Bitmaps (Raster graphics)

Bitmap graphics are rectangular. On a white backgound this image may not appear to be square but on a dark background that it is rectangular becomes obvious

Bitmaps (Raster graphics)

When over-enlarged this image becomes highly pixellated. It has a severe case of the jaggies.

Bitmaps (Raster graphics)

Common bitmap file types include: JPEG A compressed format used for photo realistic graphics with lots of color and detail GIF A lossless file format designed for fast transfer over modems that is better suited to simple graphics BMP - An uncompressed Windows format created by IBM not to be confused with the bitmap format in general PNG Developed to avoid paying to use GIF the format TIFF - A flexible format designed for exchanging files between applications and computer platforms

Bitmaps (Raster graphics)

Calculate the size of a file as follows: Size in KBs = (H * W * B)/(8 * 1024) where H is the height, in pixels W the width in pixels of the image , B is the number of bit / pixel, 8 the number of bits in a byte and 1024 the number of bytes in a kilobyte. Example H = 256, W = 256, B = 24. Size in KB = (256 * 256 * 24) / (8 * 1024) = 1572864 / 8192 = 192 KB
8

You try H = 128, W = 128, B = 8

Vector graphics
Vector graphics are made up from coordinates, shapes, line and fill color data Co-ordinates consist s of two values an xcoordinate and a y-coordinate e.g. (10, 5) Lines can either be used on their own or in multiples to create more complex graphics. Fill color data is the color added to fill a shape Paths are a series of lines and curves that go to make up a complex vector graphic Paths can be opened or closed Text can be anchored to a path Vector graphics are not resolution independent and can be scaled without loosing their quality 9 A vector graphic program uses algorithms that apply mathematical formulae to the co-

Vector graphics

A Vector graphic program uses algorithms that apply mathematical formulae to the coordinates, shapes, line and color data in order to generate an image Vector file files are smaller than bitmap files because they contain much less data Curved paths within a vector graphic are called Bezier curves, which consist of anchor points that can be adjusted to change the shape of the curve Vector graphics need to be rasterised before they can be included in a Web page Vector file formats include: Al (Adobe Illustrator), FH (Macromedia Freehand) and 10 CDR (Coral Draw).

Path Shaping Moving the control handles affects the shape of the path

11

Quadratic Bezier Curves Construct intermediate points Q0 and Q1 such that as t varies from 0 to 1: Point Q0 varies from P0 to P1 and describes a linear Bzier curve. Point Q1 varies from P1 to P2 and describes a linear Bzier curve. Point B(t) varies from Q0 to Q1 and describes a quadratic Bzier curve.
12

Higher Order Bezier curves Higher-order curves need correspondingly more intermediate points. For fourth-order curves one can construct intermediate points Q0, Q1, Q2 & Q3 that describe linear Bzier curves, points R0, R1 & R2 that describe quadratic Bzier curves, and points S0 & S1 that describe cubic Bzier curves.
13

Meta graphics

Meta files are graphic files that are a combination of bitmap and vector graphics EMF is an interchange format for exporting vector graphic data. When Illustrator saves vector data to EMF format it may rasterize some vector data when exporting artwork to EMF format Windows meta file (WMF) contains function calls that vector graphic statements while others identify raster graphic images CGM is supported by ANSI and is commonly used in CAD and presentation graphic applications.
14

Animated graphics
Animated graphics are 'moving graphics' that consist of at least more than one graphic. Vector graphics are mainly the basis of animations. Effects generated by bitmaps can be added and bitmaps themselves can also be animated. The illusion of movement is created by playing a series of graphics at a certain speed. The term applied to the playback setting is known as frame rate. Measured in frames per second (fps) 15 In computer based applications, the higher

Animated graphics

The accepted frame rates used today are: 12 - 24fps for animations used in multimedia 12fps for web based animations 24fps for TV in UK 30fps for TV in USA 25fps for film

16

Quiz
1. Define the term color depth 2. What is a Bezier curve 3. What type of graphic is represented by coordinates, shapes and fill data and whose image is generated by mathematical equations 4. Why do bitmap files have a large file size? 5. What is a WMF file made up from 6. What is pixellation otherwise known as the jaggies? 7. In vector graphics what is a path, what are the two types of path? 8. What is a Meta file? 9. Give a definition of an animated graphic 10.What is the recommended frame rate for

17

Compression
The aim of compression is reduce file size but to maintain the quality of the original data. Files are usually compressed so that they take up less space on storage media or less bandwidth when they are transferred over a network. Compression is used for different types of data, for example documents, sound, and video. When compression is applied to multimedia graphics it is almost invariably applied to bitmapped graphics There are tow types of compression 18 technique:

Lossless compression

Lossless compression algorithms reduce file size with no loss in image quality. This type of compression can be applied to any kind of computer data such as spreadsheets, text documents, software applications and graphics. To send a file as an e-mail attachment it is a sound idea to compress it using something like winzip or winrar. The main disadvantage with lossless compression is that it doesnt reduce the file size as much as lossy compression.
19

Lossy compression

Lossy compression looks for 'redundant' pixel information and discards it permanently. When the file is decompressed the original data isn't retrieved. Lossy is only effective with media elements that can still 'work' without all their original data. These include Audio, Video, images and detailed graphics for screen design (computers, TVs, projector screens).
20

Compressed bitmap files

JPEG or JPG (Joint Photographic Experts Group) uses lossy compression. High compression can be applied with little visible loss of quality. You can set the level of compression e.g., low, medium & high. There a lossless version of JPEG, but this isn't as widely used as additional hardware may required. GIF (Graphics Interchange Format). This is a lossless file format designed for fast transfer of data over modems. It is widely supported by web browsers and multimedia applications. PNG (Portable Network Graphic) was 21 produced to avoid paying to use GIF. It is

Other compressed bitmap file formats

Other compressed bit formats include: Macintosh PICT and TIFF (Tagged-Image File Format) Macintosh PICT is used with Mac OS graphics and page-layout applications to transfer images between applications. PICT is especially effective at compressing images with large areas of solid colour. TIFF (Tagged-Image File Format) is used to exchange files between applications and computer platforms. TIFF is a flexible bitmap image format supported by most paint, image-editing, and page-layout applications. Most desktop scanners can produce TIFF files22 Note: These formats are not supported by

Paint Packages
Bitmap graphics software applications are known by several names including raster graphics editors, image editors and paint packages. The major players include: Adobe Photoshop Coral Paint Shop Pro (PSP) Coral Painter Adobe Fireworks The other contenders include: Corel PhotoPaint, Photoshop Elements, GNU Image Manipulation Program (GIMP) and Microsoft Paint

23

Drawing Packages

Applications used for creating and editing vector graphics are known as Drawing Packages. These Include: Adobe Illustrator. CorelDRAW Adobe Freehand Fireworks Other packages include: KAI powertools, Jasc WebDraw, LogoEase- web based software and the Flame project - Open source software used to create SVG files
24

Animation Packages
More and more graphics software applications support features for creating simple 2D (dimensional) animated graphics e.g. Photoshop More complex animations for web and multimedia applications can be produced using specialist software applications Packages include: Adobe Flash Adobe Director Other Animation graphics software applications include: ToonBoom Animation Anime Studio 25 CelAction

Quiz
1. What is the aim of file compression? 2. What is the difference between lossless and lossy compression 3. What kind of files are suitable for lossless compression 4. What are the levels of compression for a JPEG file? 5. Does JPEG support lossy or lossless compression? 6. How does lossy compression work? 7. Which two bitmap compression formats are NOT supported by Web browsers 8. What is a Drawing package used for? 9. What is a Paint package used for? 10.List any three of the principle paint packages 11.List any three drawing packages 26 12.What are the market leading animation

Summary
We have discussed: Bitmapped and vector graphics Compression techniques Graphics application packages We have done a couple of quizzes If you had trouble with anything in the quizzes Get a copy of the slides from me and work through them Read the notes carefully before the test Read through the notes anyway. You can never practice too much Practice always makes you better at what you are doing. Go to it & give the test your best shots And finally. 27

Good Luck!
But you shouldnt need luck as you have all studied with Mrs. Meharg - it will be easy!

28