Artist's Corner

Groovetheory Designs is interested in the growth and education of our CLIENTS about Art and Graphic Design. This space will be dedicated to "random tidbits" of knowledge, vocabulary and other important and interesting facts about Art and Graphic Design


Raster vs. Vector

Raster vs. Vector

Raster Images

In computer graphics, a raster graphics image is a dot matrix data structure representing a generally rectangular grid of pixels, or points of color, viewable via a monitor, paper, or other display medium. Generally this means "little squares". Any image you see on screen that ends in .jpg or .png or the like is made up of little squares of color that make up a larger image. There can only be 72 "little squares, or DPI (Dots per inch) on a monitor. No matter how high you save the DPI in a file, it will never get any larger. The way to overcome this is to start off with a "high-resolution" image, meaning it has 200DPI or more. But wait, didn't I just say it couldn't get any larger? Well technically that isn't true. For print documents it's almost always best to have an image that is AT LEAST 200 DPI otherwise the image will appear "fuzzy" or "pixilated". We don't want either of those things. If someone creates a logo or takes a picture and puts it on the internet, it'll automatically be resized to 72 DPI, but the higher resolution to start with, the better the image will look on screen

Here is an example of an upclose Raster Image

Notice its made up of little squares? Now if you zoom out, this is what it looks like on screen

Can't see the little squares can you?

Another important thing or two to remember: #1 Never take images off the internet and try to put them in a print document (see the reason above). Once its on the internet, its low resolution. Plus, that's technically stealing and copyright infringment, unless you have permission.
#2 You can always take away pixels but you can't add them. If you ask a designer to "make my little image larger", if they are worth their salt they will tell you its not possible. You need the "native file" or raw image and then you can scale it down to its proper size. Images that are 0-50KB are probably not print ready. Images that are 500KB (kilobytes) to 1 or more MB(megabytes) or larger, probably are print ready. Now for the internet you actually want it to be as large as possible but with the smallest file size. Reason being, the larger the image, the longer it takes to load on the internet. Which means slower downloads of webpages.

Vector Images

Vector graphics is the use of geometrical primitives such as points, lines, curves, and shapes or polygons—all of which are based on mathematical expressions—to represent images in computer graphics. In laymans terms this means you can make this as large or as small as you want without concern of losing resolution as long as its is done in its native program. Generally programs like Adobe Illustrator and the like.

Here is an upclose view of a vector image

Notice the small blue squares and the blue curved line? These are the two points that the line is connected to that create its shape. The lines can either be straight or curved and again, they can be resized to your hearts content. Its best to make the image very large, size wize, and THEN take it into a Raster based program like Photoshop to be made into a .jpg or .png file in order for you to use in different places.

What should I take away from this?

If you get a logo or any graphic file from a graphic designer, ALWAYS ask for the native file! (.ai, .eps, .psd) Whatever it may be. If they drop dead you want to be able to take this document to your next designer so they can do work for you.

You should always go big first, then scale down. You can't start small and get big, with Raster images

You can be as small or as big as you want with Vector images, until you bring them into a raster based program

This just briefly touches on raster and vector based images but I hope it gives you a little basis of knowledge to start from.

Until Next Time!