Introduction

The other most common element seen in multimedia is graphics. In general terms, graphics are "all visual information displayed in a nontextual way" (Rieber, 1994). For computer use, graphics can be created using the computer, or they may originate in some other form and then be transformed for use by the computer. In either case, the graphics must be represented in a digital format before they can be used in a computer program.

When dealing with computer graphics, this can include a wide range of images and file types, including photographs, clip art, line art, digital art, icons, bullets, backgrounds, and image maps. Most authoring programs allow you to import a wide variety of graphic types. Some even let you create graphics within the program. However, due to the limitations of these built-in graphics tools, many multimedia developers use external programs (such as Photoshop) to create graphics, and then import them into the authoring program.

If you remember, there are three principal means of obtaining graphics to use in a multimedia project:

  1. Existing graphics that are suitable for use in their current form
  2. Existing graphics that can be modified to meet your needs
  3. New graphics created to meet your needs.

Graphics for the computer typically are generated using one of two major approaches. One approach uses a set of mathematical instructions to tell the computer to "draw" a particular shape of a specific size at a particular location. These types of graphics are generally referred to as "vector" graphics. Because they are mathematically defined, images created with drawing tools are resolution-independent. In other words, the images can be scaled to any size and printed at any resolution without losing detail or clarity. As a result, vector graphics are often used for
graphics that must retain crisp lines when enlarged.

Graphics also may be generated by instructing the computer to "paint" a matrix, or a set of rows and columns, of tiny areas known as pixels. Information associated with each pixel in the matrix defines that pixel's color value. When viewed in combination with other pixels, the painted pixels form an image. Graphics defined in this manner are referred to as "bitmapped", or "raster" graphics. Because the color value of each pixel within a bitmap image can vary, it is possible to portray subtle changes of shades and colors. For this reason, bitmap graphics are used for continuous-tone images, such as photographs or digital paintings. Most images seen on the Web are bitmapped graphics. On the other hand, when a bitmapped image is enlarged beyond its original size the image can lose detail and appear jagged. For this reason it's best not to enlarge bitmapped images too far beyond their original size.

There are many different types of graphic files. Here are some of the more common ones:

  • GIF - Graphics Interchange Format
  • JPG - Joint Photographic Experts Group
  • TIF - Tagged Image File Format
  • BMP - Windows Bitmap
  • PCT - Macintosh Picture
  • PNG - Portable Network Graphics
  • PSD - Photoshop Document
  • WMF - Windows Metafile

Your authoring program may or may not be able to import graphics in these different formats. For example, with HTML you are mostly limited to using GIF and JPG images. Flash and PowerPoint can import many different types.

For this competency we'd like for you to play around with your authoring program's various ways of importing and creating graphics. Depending on the authoring software you are using, here are some LinkedIn Learning tutorials we recommend that you go through. These tutorials may cover more than just graphics, so don't worry if you pick up extra skills along the way. Also, keep in mind that the names of the tutorials may differ slightly depending on which set of tutorials you are using.

PowerPoint Introduction: Using PowerPoint's Drawing Tools
Introduction: Enhancing Drawn Objects
Introduction: Working with ClipArt, Tables, and WordArt
Using Graphics in Presentations (2010)
Dreamweaver Working with Images
Using a Tracing Image
Working with Images
Flash Basic Drawing and Painting Tools
Applying Strokes and Fills to Existing Shapes
Creating Custom Colors, Gradients, and Line Styles
Manipulating Vector Shapes
Single Layer Vector Shape Interaction
Drawing and Color
Other programs Using characters for visual interest

Graphics Activity

When you feel comfortable importing and creating graphics with your authoring program, we'd like for you to demonstrate your ability to import, create, and display various types of graphics. Using your authoring program, create a single screen (slide, stage, or page). On this screen should appear 6 different graphics. Use the following guidelines:

  • There should be 1 photographic image that you have imported into the authoring program.
  • There should be 1 clipart image that you have imported into the authoring program.
  • There should be 2 images that you have created in an external graphics program and then imported into the authoring program. Each of these images should contain at least three distinct colors.
  • There should be 1 image that you have created using the paint or drawing tools available within the authoring program. This image should contain at least three distinct colors. If you are using a Web editor such as Dreamweaver you may not have the ability to do this. In this case, create 1 more image in an external graphics program and import that.
  • Finally, include a background image of some sort. This must be something other than a solid color. It could be a photographic image, or perhaps a pattern of some sort.

Out of these six images, you should have at least two different file types represented. For example, you may have a combination of GIF and JPG images. Or, you might have some GIF images and some TIF images. Or, you might have more than two types.

Underneath each graphic, label the source of the graphic (clipart, screen capture, scanned, self-created, etc.), and the type of file it is (GIF, JPG, TIF, etc.). For the background graphic, just put the label in the bottom right corner of the screen.

Finally, include your name somewhere on the screen.

Note: These may be graphics you want to use in your multimedia project, or they can be totally unrelated.

Submitting your Activity

Save this activity in your program's native file format. Name the file "graphics". Depending on the program you are using, you will end up with one of the following types of files:

  • Flash - fla (graphics.fla)
  • PowerPoint - ppt (graphics.ppt)
  • Dreamweaver - htm (graphics.htm)

After you have saved the file, go to the student interface and submit your assignment for grading. Click here if you need additional information regarding submission of your assignment.

Assignment:Graphics Activity
Points:
10
Grading Criteria:
  • Screen includes a total of 6 different graphics.
  • Screen includes 1 photographic image.
  • Screen includes 1 clipart image.
  • Screen includes 2 images created in an external program and imported. Each image contains at least three distinct colors.
  • Screen includes 1 image created using draw or paint tools of the authoring program (if tools are not available in authoring program then image should be created in an external program). Image contains at least three distinct colors.
  • Screen includes a background image that is not a single color.
  • At least two different types of files are represented (e.g., GIF, JPG, TIF, etc.)
  • Each image labeled with the source of the graphic and the file type.
  • Student's name included somewhere on the screen.