Vectors and Bitmaps… Oh My!

Often when clients are providing us their materials for a project, the question of graphic quality and type becomes an important issue.

There’s often a good deal of confusion about what certain types of graphics are, and how they can be best utilized for professional quality collateral for printing and even web design.  Unless you have work in pre-press, or with printing often, you may need a good understanding of the advantages (and disadvantages) of specific graphic/data types.

Here’s a very basic review that might help:

  • As a general rule, most digital pictures (and scanned images) are bitmap file types. These may also called “raster” images.
  • Graphics designed or composed in applications like Adobe Illustrator or Corel Draw are often saved as “vector graphics”.

From a technical perspective, both formats are entirely different, with the end result looking nearly identical in either format.

In very general terms, bitmaps are often used to depict life-like images, while vector graphics are more frequently used to depict abstract images (such as logos).  There are many exceptions to this generality, and you may not be able to tell the difference between two image types simply by looking at them.

“Vexel art”, for example, are bitmap images that have been manipulated to appear as though they are vector data.  This can be used to create photo-realistic images that have an artificially sharpened appearance to them.

While you can easily convert a bitmap image into a vector file, you may conversely change a vector image into a bitmap.  And to add even more confusion, there are file formats that combine both types into a single file.

So how can you navigate all this technical jargon?  It’s fairly simple once you understand the basics:

Bitmap images

Bitmap images are exactly what their name implicates – a collection of bits that form an image. The image is a matrix of individual dots (or pixels) that all have their own color (described using “bits” – the smallest possible units of information for a computer).

As you can see in this example, the image consists of hundreds of rows and columns of small elements that each has its own color.  These are called a “pixels” – shorthand for picture element. The human eye is simply not capable of seeing each individual pixel, and so we perceive a picture with smooth gradations.

How many pixels do you need to see the image as a whole picture?  That depends on the way the image will be used.  The example of the mountain above with the insert enlargement shows one of the main disadvantages of bitmap images – once they are enlarged beyond their original size, they become “blocky” – and if they are reduced in size, they will also lose a bit of their sharpness.

There are literally hundreds of applications available that can be used to create/modify bitmap data. The industry leader is  Adobe Photoshop, although less expensive alternatives like Corel Photo-Paint shouldn’t be disregarded for their abilities

Bitmap data can be saved in a wide variety of file formats. Among these are:

  • BMP: an outdated and limited file format that is not suitable for use in prepress.
  • EPS: a flexible file format that can contain both bitmap and vector data. It is gradually being replaced by PDF.
  • GIF: mainly used for internet graphics
  • JPEG: or rather the JFIF file format, which is mainly used for internet graphics
  • PDF: versatile file format that can contain just about any type of data including complete pages,it is not yet widely used to exchange just images
  • PICT: file format that can contain both bitmap and vector data but that is mainly used on Macintosh computers and is not very suitable for prepress.
  • PSD: the native file format of Adobe Photoshop (which can also contain vector data such as clipping paths)
  • TIFF: a popular and versatile bitmap file format

Vector graphics

Vector graphics are images that are completely designed and composed of mathematical definitions. The cheesy image below illustrates the principle simply.

As you can see, each individual line is composed of either a collection of points with lines connecting them,  or just a few control points that are connected called “bezier curves”.

This drawing demonstrates the two principles. To the left a circle is formed by connecting a number of points using straight lines. To the right, you see the same circle that is now drawn using 4 points  only.

Vector drawings are typicall small in data size as they contain data about the bezier curves that form the drawing.  Vector drawings can typically be scaled without any loss in quality.  This is why they’re ideal for company logos or designs that need to be resized frequently.

Like bitmap programs, there  are hundreds of applications on the market that can be used to create or modify vector data. Adobe Illustrator is again, the industry

Bitmap data can be saved in a wide variety of file formats. Among these are:

  • EPS: the most popular file format to exchange vector drawings although EPS-files can also contain bitmap data.
  • PDF: versatile file format that can contain just about any type of data including complete pages, not typically used to exchange just images
  • PICT: outdated file format that can contain both bitmap and vector data but that was mainly used on Macintosh computers before OS X came along.

Hopefully, this will give you some insight as to what type of file to provide your design professional, or better yet, an understanding of what type of file you need to have them create for you.

And of course, if you have any questions or experiences about this often confusing topic of file types and uses, we’d like to hear them!

2 Responses to “Vectors and Bitmaps… Oh My!”

  1. 3 Key Guides For Your Logo Design « smartbrandblog Says:

    […] likely to get may not endure the test of time – let alone the test of technology.  Understanding the technical aspects of designing for your specific media takes years of successful practice and knowledge.  Spending your money on a professional designer […]

  2. there will be many gowns with strapless necklines8 Says:

    Some genuinely excellent articles on this internet site, regards for contribution.


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: