Raster Graphics vs. Vector Graphics

Raster (or Bitmap) Images A raster graphic (also called “bitmap") is basically a large grid, filled with boxes called pixels When you stand far enough away from the grid, the individual grid squares blend together and you see a complete photographic image.

Raster Resolution The more pixels in an image, the more accurate to the original it can be The more pixels in an image, the higher the resolution

Enlarging Raster Images Photoshop is short 937,500 pixels! It will make up, or interpolate, that extra data. Original Image: 250 x 250 pixels 62,500 pixels Larger Image: 1000 x 1000 pixels 1,000,000 pixels In Raster, it’s important to begin your project at the correct output resolution When a raster program like Photoshop makes an image larger, it has to make up the new pixels that are needed In this example, making an image larger requires Photoshop to make up 937,500 pixels!

Enlarging Raster Images Photoshop will look at what it has to work with and create a best guess as to what is needed. It actually does a pretty good job, but the image may well suffer noticeably if you increase the image size more that 10 percent or so. The way to avoid this is to start a larger size than is needed. We can always shrink an image with no loss of quality, but increasing an image will cause it to become pixilated.

Know Your Final Output! In Raster, you need to work at the correct resolution for where your design will end up. TV and monitor screens only have 72 pixels per inch. If you are making something that only will be seen on a screen, you can keep your resolution at 72 ppi. If it is going to be printed, you will need to begin much higher. Consumer printers can print at 300 ppi. Professional printing can be as much as 600 ppi. High resolutions take up a bunch of storage space and take longer to work with. Low resolutions tend to look bad.

Low Resolution Image

Advantages of Raster Graphics Raster can represent complex photographic images. Photographs, movies, and television are raster! Almost any system can read raster graphics. Common file formats include .jpg .gif .bmp .tif

Disadvantages of Raster Graphics Difficult to scale to larger sizes. We can make things smaller, but not bigger without a loss of quality. Raster files can get very large. The more pixels, the more the computer needs to remember. Once a raster file has been saved as a jpeg, etc., it can’t be edited any more.

Vector Graphics Vector Graphics are defined by math. They are points connected by lines of various shapes. More points and more lines can make more complex shapes.

Vector Graphics Images made up of shapes, like line drawings and illustrations and logos, are often well suited for vector formats. Images with dense, differing colors, like photographic images, are not good for vector graphic formats.

Advantages of Vector Graphics Star viewed at 100% onscreen Top of star viewed at 1600% Infinite resolution – we can shrink or expand the image forever and never lose resolution, because it’s entirely math- based! File sizes are very small. Instead of having to remember millions of pixels, the file only has to contain the math used. The files remain editable. Any program that can understand the math can edit the file.

Vector/Raster Comparison Vector logo, Viewed at 100% Vector logo, Viewed at 1600% Raster logo, Viewed at 1600%

Disadvantages of Vector Graphics Vector graphics can’t easily recreate photo realistic images.