Vector Graphics 2.02 Understand Digital Vector Graphics

What is a Vector? Activity Assignment: Find a raster graphic (photograph) that has distinct outlines and shapes. Trace the photo very lightly with a pencil. Once finished, make the lines darker and do some shading. At the bottom of your drawing, write a short reflection describing the main differences between the original photograph and your drawing. 2

3

1.01 Investigate graphic types and file formats.4

5

Essential Questions: How does having an understanding of vector graphics impact design considerations when developing multimedia projects? How can you use vector design software to create a range of illustrations? What are the appropriate uses of raster and vector graphics? 6

Graphics that are based on mathematical formulas that define lines, shapes, and curves. Are comprised of paths connected by anchor points. Can be 2D or 3D. Edited in draw programs. Vector Graphics

Uses of Vector Graphics Graphics that will be scaled (or resized) Architectural drawings, CAD programs, flow charts. Logos that will be scaled (resized) with loss of quality. Illustrations and clip art. Graphics on websites. Small file size allows for quick load times. Fonts and specialized text effects

Advantages of Vectors Scalable – able to change size easily Resolution Independent - Regardless of how much the image is enlarged or reduced, the image definition and quality remain the same. Editability - since each vector is made up of separate and distinct objects, each can be edited independently at any time. Small File Sizes - easily transferred over the Internet.

Disadvantages of Vectors Lower color quality than raster images. They do not support as many colors. Not good for photographic images. Limited in the type of effects that can be applied. Can be time consuming to create. Click to see an example. Note: emphasize better quality of the raster graphic because it is made up of pixels which can show much more detail than lines.

AI – Adobe Illustrator Native file format for Adobe Illustrator. Industry standard used by developers of vector graphics. Used to create, save, and archive original artwork. Common Vector File Formats

EPS – Encapsulated Postscript Developed by Adobe but supported by most programs. Graphics developers generally save a copy of the AI file in EPS format because it can be opened by computers running different operating systems. Most common interchange format for the print industry due to its portability. Meta Graphic – can contain both raster and vector data. Shapes in vector graphics can be filled with textures and patterns that are raster graphics. 12

Common Vector File Formats SVG – Scalable Vector Graphics Standard format created by W3C. Versatile, all-purpose vector format. Works well with web page design. WMF – Windows Metafile Microsoft created format for raster and vector. Common format for windows clipart.

Elements Question: Brian hired a developer to create, save and archive an original artwork for his new lawn service. Which file format would the developer use to save the artwork? A.GIF B.JPEG C.AI D.PNG 14

Elements Question: Which of the following is an advantage of a vector graphic? A.Supports millions of colors B.Large file sizes C.Resolution dependent D.Easily editable 15

Elements Question: James is drawing circles that are all filled with a pattern. He wants to change the pattern to a solid fill. Which type of graphics is he editing? A.Raster Graphics B.JPEG Graphics C.TIFF Graphics D. Vector Graphics 16

What have you learned? What are vector graphics? What are the uses of vector graphics? What are the advantages of vector graphics? What are the disadvantages of vector graphics? What are the common vector file formats? Describe each one. 17

DescriptionDefinition 1.  Meta graphic - graphic formats that can contain both vector and raster data.  Developed by Adobe, but supported by most programs.  Most common interchange format for the print industry due to its portability A.AI B.EPS C.SVG D.WMF 2.  Open standard developed by the W3C.  All purpose vector format.  Works well with web page design. 3.  Native file format for Adobe Illustrator.  The industry standard used by developers of vector graphics.  Used to create, save, and archive original artwork. 4.  Microsoft created format for raster and vector.  Common format for Windows Clipart. 18

Examples More examples Resized Image Shapes that make up the image.

Go to Internet and search for wmf pictures. Download wmf file. Then insert downloaded picture into PowerPoint or Word. 20

Let’s Try This is a vector graphic (WMF) from the clipart files in Microsoft PowerPoint. Notice that the image does not become pixelated when it is resized, it retains the original quality. To break the image down into its individual parts: 1.Click on the image. 2.On the Draw toolbar, click on Ungroup. 3.Click Yes in the Dialog box. 4.Click Draw, Ungroup again. Now the individual shapes can be moved and manipulated. For a fun activity, allow students to experiment with ungrouping an image and re- coloring it. Be sure they Regroup it before trying to move it, though. If they don’t regroup, they will only move pieces of the image instead of the entire image. 21

22