About Me   |   Commercial Gallery   |   Just 4 Fun   |    My Music   |   My Store   |   News & Blog   |   HOME


Welcome to Julie's Graphic Design Blog.

Get up to speed with the latest and greatest graphic tips for creating web, flash and print documents here. People are always asking me to help them with tips and tricks they can use in their projects and this is where I will post answers to your questions.


Blog Menu:
• Article 1: Vector Vs. Bitmap

• Article 2: Home Recording Blog


Vector vs. Bitmap -

Today I will answer a client's question about the difference between vector art and bitmap. This issue comes up at least a few times a month with my customers, so hopefully this will help shed some light on the two image types and when to use them.

Vector art (or line art) is created in a program like Adobe Illustrator. Paths are created by connecting series of points with bezier curves. The paths are then filled (or outlined) with color. Below is an example of a vector drawing I recently created in Illustrator. In the "outline mode" you can see the paths.
 
The photo below shows the "preview mode" where the paths are filled or outlined with color.


One of the advantages to vector art is that the image can be enlarged at any percent without ever losing quality. It is also the format needed for sign makers and embroiderers. The paths need to be there to tell the machine where to cut the lines or sew the stitch. Vector art is usually used for logos and artwork that does not require realism, but requires crispness and defined edges.

Bitmap files (or raster images) are made up of pixels instead of paths. Photos and artwork requiring realism and complex shading, like scanned images and digital photos, are bitmap files. Some examples of bitmap file formats are jpg, tif and photoshop. The downside to these files is they are resolution dependent. For the web, 72 d.p.i. is the required resolution to obtain clarity; however, when setting up files for printing on press, 300 d.p.i. is required. Unfortunately you can not simply enlarge a photo and keep the quality. When you increase the size, you increase the size of the pixels and will end up with a jaggy edge on your image. I can't tell you how many times per week that someone wants me to use a small photo or bitmap logo by simply enlarging it. It will not look good! See the results on the last photo.

The first picture below shows how a vector file can be enlarged without ever losing it's integrity. The lines and colors are still sharp and clear at any size, making it ideal for large format printing, printing on press or flash animation.

Alternatively, the bitmap file (shown below) looks very jagged and poor quality. It's even more noticeable when printed rather than viewed on screen. Anyone who has tried to print a large photo from their cell phone camera has likely experienced what can happen when you enlarge the pixels.


As great as vector art can look when enlarged, it can not match the true realism of a photograph or other image with complex shading, soft feather gradients, etc. Vector art is perfect for logos, cartoons, clip art and images with defined edges.

In closing, it's important to remember that opening a bitmap file into a vector program does not automaticallly create the paths and turn the art into vector quality. The only way to turn a bitmap image into vector art is to import the image into a program like Illustrator, and trace the shapes of colors using lines, points and curves.



Was this article helpful to you? Do you have a question about computer graphics?
Feel free to email me your comments and questions.