What's the Vector, Victor?

(or Raster vs. Vector Graphics)

You have heard about the "vector shapes"capabilities of Photoshop, even if only on thepackaging that came with the program. What isall of this and even more importantly, how will itaffect you and the way you work?This tutorial, which is written with beginners inmind, will show some of the attributes of shapes in Photoshop version 6 or 7. Most of this is good for Photoshop Elements 2, as well.Along the way, you will learn about or practicethe following ideas and skills:A. Vector graphics vs. Raster graphicsB. Making a Raster shapeC. Making a filled Shape Path (Vector shape)D. Rasterizing a Vector shapeThough little of this will be directly useful to youif your Photoshop is a version earlier than v.6,you may want to read this anyway, to prove toyourself WHY you want to upgrade!You will also work with these skills: Saving afile, Making a new layer; Naming a layer; Usingthe color picker; Duplicating a layer; Usingsome keyboard shortcuts; Makingtransformations; Using the Pen tool; Playingwith Paths.

A. Vector Graphics? Raster graphics?

Raster graphics (called "simplified" graphics inElements) are what have been traditionallyassociated with Photoshop. An image in raster graphics is defined by its pixels. If you make astar in raster graphics and then do atransformation to make it bigger, Photoshopwill pull the pixels out as you tell it to, but thenit has to fill in the gaps. In other words, it willgive you a star, but the edges will be quiteblurred.(An enlarged rasterized star point. When youenlarge a raster graphic, you lose detail.)

Vector graphics are different from raster graphics in some significant ways. A vector graphic is a mathematical definition of animage. It is independent of size or color. It is just a definition of its shape. You tell it youwant a circle, it gives you a circle. You make itbigger? Ok.. then you have a bigger circle. Stillcrisp. Still a circle. Each point on the outside isa fixed distance from the center. It isindependent of pixels.This is why logos have to be made in vector graphics.A logo on a matchbook and a logo ona billboard each need to be precise and crisp.Let's make some shapes to better illustrate thedifference between raster and vector graphics.With Photoshop 6, you can do both!(Vector star -- No matter what size you make it,it will maintain this crispness)

B. Making a Raster shape.

•

File -> New .. and make your newcanvas pretty big, but big enough that itfits on your screen, maybe 500 pixels x500 pixels. Choose RGB mode in thebox that comes up and 72 ppi for your resolution. Contents? White.

•

File -> Save As.. Leave your file in psdformat and name it rastervector or something equally clever.

•

Now choose the Ellipse tool in the flyoutfrom the Shape Tool or in the ShapeOption bar(See below).

•

In the options bar at the top, you see,after the reset button, the three littlebuttons there together for new shapelayer, New Work Path, and FilledRegion. Let's do a Filled Region first, soclick on that.

The Layer Style selector there in the middle of the Shape Tool Options Bar also shows up in the options bar when you are doing a shape layer with thepen tool. Layer Styles are a pretty neat topic all on their own, so I'll save that discussion for another tutorial.

* Experimentation *

•

Make a new layer by clicking on the"New Layer" icon at the bottom of theLayers Palette. Opposite click (right-click) this layer, choose Layer Properties, name the layer "experiments" and click OK.

•

Put your cursor on the canvas and dragout some ellipses.

•

As you drag, try clicking the shift key onyour keyboard. What happens? Howabout when you hold alt down as youdrag your ellipse? Experiment with thisa bit. After you have had your fun, Ctrl-sto save, then turn off the eye on thislayer to make it invisible.

•

Now click on the foreground colour onthe color picker squares and chooseyour favourite colour.

••

Make a new layer by clicking the NewLayer icon in the Layers Palette. Namethis layer "Raster."

•

With the "create filled region button stillselected, drag out a small ellipse.

•

In the layers palette, drag the Raster layer to the New Layer icon. Now thereare two! Opposite click the top one andchange its name to "Raster - enlarged."Ctrl-S to Save.