Vector vs Raster - What Is The Basic Difference and Which One Choose for Your Artwork

If you are a photographer or designer, you probably know what you are dealing with. For the others who are just starting, it can be a little bit overwhelming – raster, vector, bitmap, pixel. I’m expecting that everybody knows .jpeg, .jpg, but what about .svg? What is the difference between .png and .jpeg? Well, if don’t know about .jpeg, probably you have never downloaded a wallpaper then but do not worry, everyone has to start somewhere, someday!

What is actually the difference between vector and raster? 

Which formats are used for each of them?

For which projects I should use vector or raster?

For a digital artist, it is very important to understand the difference between vector and pixel art. Each of them has special software and needs, each of them is used for different purpose. Also, every single file format is giving you different options. Today we will look at the basics of these to get a better understanding.

 
vs-blog-vector-raster-graphics.jpg
 

Raster (bitmap, pixel)

Raster images are often called bitmaps. They consist of millions of tiny little squares which we call pixels. Pixel stands for “picture element”. It’s the smallest physical element of a digital display device. It’s pretty easy to recognize it by yourself. Try to open any photo you have and zoom in. Closer you look, more blurry the image becomes and in the end you will be able to see the little pixels. Bitmaps are created with pixel-based programs, captured with a camera or scanner. Usually, almost every drawing/painting app is raster oriented. Creating such artwork is pretty similar to traditional painting or drawing. You have many brushes to choose from, you can blend colors easily to soften the transition, you can apply many filters, gradients, undefined lines and shapes, and complex composition.

 

Raster format is resolution specific – that means that the photo you just took is displayed in one specific resolution. If you will try to resize the picture, bigger without changing the number of pixels, it will get blurry and not nice to look at anymore. Scaling down its not such a big problem, but the smaller version could be less crisp or softer than the original. There is a possibility to change the number of pixels but the pixels will be added randomly, rarely producing a good outcome.

We have two main names using raster images. PPI and DPI. They are both describing the resolution or clarity of an image, but they are not the same thing.

PPI (pixel per inch) means how many pixels will fit into one inch. A 72 PPI image will have 72 pixels per inch. PPI describes the number of pixels for the digital screen. PPI can be modified with photo/painting editing software.

DPI (dots per inch) means how many dots per inch my printer will print on the paper. Printers are not printing little squares. So how do they do it with raster images? They reproduce the image by spitting out tiny dots consisting of a mix of colors – Cyan, Magenta, Yellow, and Key (black) per the pixel of your image. DPI is set by the printer itself and cannot be manipulated.

That’s why we as digital artists can work with two different color schemes CMYK and RGB. Today we are not going so deep into this, so just put it simply – CMYK is for printing method, RGB is for electronic displays – monitors, phones, tablets etc.

Almost all the pictures you will find on the websites are raster images (even though they could be vector images before). Photographs and pictures in books or magazines are usually also pixel images, but these images are saved with very high resolution what is making them very big files in the end.

Formats of raster images

.jpg, .jpeg, .gif, .png, .tiff or .tif, .psd (Photoshop)

Popular programs used with raster images

Adobe Photoshop, Procreate, Affinity Designer (pixel persona), AutoDesk, Corel and many others

In which hobbies or jobs I can use pixel graphic

Photography, digital painting

vector-vs-raster.jpg

Vector

Total opposite from pixel images, vector images are created with a mathematical formula that’s defining lines, curves and primitive shapes like polygons, circles, and rectangles known as paths. Vector graphics have to be created in software that is designed to create lines includes node position, locations, lengths, and curves.  Because vector graphics are composed of geometrical primitives, it is very best to use it for more structured images like logos, line art, illustrations with flat, uniform colors, letterheads, and fonts.

 

Vector images are more flexible and versatile. You can scale them down, up easily and perfectly.  They have also no resolution restriction and therefore they are not depended on the output device. And because vector images don’t have to handle millions of tiny pixels, these files are usually smaller than their raster sibling. You can easily recognize vector by looking at the edges, doesn’t matter how much you scale, they will always stay crystal clear and smooth.

 

One of the biggest disadvantages is the compatibility. They are often saved as native files from the programs they have been created in. Like Adobe Illustrator and their native .ai file. If I will use Affinity Designer to open .ai file, good, I will succeed. But if I will save a file with Affinity, I will not be able to open it with Illustrator. Another disadvantage is the limitation of effects. Vector will be never as a natural painting. It is just not possible. The best to print vector is PDF or EPS, which are producing the sharpest result.

Therefore many artists are combining these two together as well.

Formats of vector images

.ai, .ait, .art, .svg, .pdf, .eps and many more

Popular programs used with vector vector graphics

Adobe Illustrator, Affinity Designer, Corel Draw, Sketch, Inkscape etc.,

In which hobbies or jobs I can use pixel graphic

Graphic designer, illustrator, printing publications design and others

PPI-Blog-Image-Example (1).jpg
 

Conclusion vector vs raster

It all depends on your project. Vectors are best for logos and illustrations. Raster images are classic for digital photography and are very often used for all graphic once they have been published digitally. If you want to repaint Mona Lisa on your iPad, you will not use vector unless you would like to look it as Picasso style Mona Lisa.
Raster images should be used if you require high lever detail (photos) and you don’t care much about by enlarging the image by a great amount. On the other hand vector you will use on images what requires tiny details and might be resized in the future.