What is a Vector File?

One thing I run across when asking for a vector graphic is that a lot of the time my customers didn't know what it was. This was especially noticeable when I was working prepress. When we tried to explain it, we usually used the program it was created in as an example. The most common programs to create vector graphics are Adobe Illustrator, Affinity, and Corel Draw.

But after telling this to the customer, a lot of the time they would stick the original file they sent in an Illustrator file. This didn't actually help, as it still wasn't a vector file. So what is a vector graphic? To explain it, helps to know what a raster graphic is as well.

There are some terms I'm going to use, so keep an eye on them.

Raster

Vector

 Pixilation

Pixel

 Anchor Point

Raster

Have you even zoomed in on a picture and saw it's pixilation? Pixilation gets its name from the word pixel. A pixel is what everything you see on a computer screen is made out of. You see a seamless picture, but it's actually several little squares put together.  

Pixilation is when you get up close to an image and it starts getting blurry. This type of graphic is called raster. It's the opposite of a vector file. Most people use this type of file for all of their art or photographs. It's most likely in the format of JPG, PNG, or GIF. There are others as well, but they aren't as common.

Vector

 Vector images never get pixelated. Why? Because vector images don't have any pixels. These two images are the same exact thing, at the exact same zoom, but one is a vector file and one is a raster file. A vector file is not a series of pixels, but commands, which the computer fills in to create the image. On the internet the format SVG has recently been getting more popular. It's the first vector format on the web. At its base form, it actually looks like a series of commands. 

Here is the same image as an SVG file.

<?xml version="1.0" encoding="UTF-8"?>


<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">


<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="3.93701in" height="3.23429in" version="1.1" style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd"


viewBox="0 0 774 636"


xmlns:xlink="http://www.w3.org/1999/xlink">


<defs>


<style type="text/css">


<![CDATA[


.fil0 {fill:#0011B2}


]]>


</style>


</defs>


<g id="Layer_x0020_1">


<metadata id="CorelCorpID_0Corel-Layer"/>


<path class="fil0" d="M0 201l626 -67c11,-46 25,-91 41,-134l107 0 0 636 -158 0c-1,-9 -3,-18 -5,-28l-611 -57 0 -350z"/>


</g>


</svg>

Vector Graphics are made out of something called anchor points. Think of them as a square. The anchor points have commands associated with them.

 So if you wanted a line, you would have two anchor points, with a command between the two of them to connect. So anchor point 1 would have a command to make a line to anchor point two.

To make a square, you would have four anchor points. Anchor Point 1 would connect to anchor Point 2, which would connect to anchor Point 3, which in turn connects to anchor point 4. Anchor Point 4 would then connect back to anchor Point 1. All of these together would have a command to make the center a color, as well as the color and thickness of the outline.  

The beauty of it is the only things there are the anchor points with their commands- the computer program fills in the details.

 

So what should I give the designer?

Now that you understand what a vector file is, you may still not know what to look for. Well, there are a few types out there.

 

  • .ai – Adode Illustrator
  • .cdr – Corel DRAW!
  • .eps - A generic form
  • .svg – Mentioned earlier, a web format
  • pdf – Adobe Acrobat.

 

 

These are what a designer is usually wanting when he asks for a vector file, however, just because the file has that extension doesn’t make it a vector file.

 

Here’s an example I had when doing prepress. Curiously, this story is why I wrote this to begin with. We had a customer that had a logo which they sent as a jpg file, and not a very good one. It saves the customer money on art time if they can provide us with a vector file, otherwise we’d have to reproduce the logo based on the crappy .jpg. Our sales people gave them the list of formats, and the next day we had an .ai file. However, what they had done was import the crappy .jpg into Adobe Illustrator and saved it as an .ai. A .jpg is a bitmap. Putting it into a vector format file does NOT make it a vector file, anymore than slapping a Tesla logo on a Ford makes it an EV.