CooperToons HomePage Caricatures Alphabetical Index Random Selection Previous Next

Leonard Bernstein
en

Tableu vectoriel

Á gauche: Traditionnel
dessiné à la main
Á droite: Vectoriel

What is this?1 Double dipping again? Or should we say triple dipping?

By no means. These pictures are simply to demonstrate how modern technology comes to the aid of artists in using their art to help eradicate ignorance and superstition.

Although the role of illustrators has often been relegated to levels below the fine artist, it is the illustrators who are directly involved with increasing understanding of difficult topics. After all, it wasn't Francis Crick and James Watson who drew the picture of the DNA molecule without which the understanding of the structure would have been impossible. It was Francis's wife, Odile, a trained artist.

And the rule of illustrators from time immemorial is "Work Large / Then Reduce". And they weren't talking about shedding a few pounds after sitting at their desks for days at a time, easy snacks within reach. Instead this meant that the original artwork should be rendered larger than it will appear when reproduced. That way the errors and imperfections will hopefully be shrunk down to nothingness.2

For instance if you see the original paintings of N. C. Wyeth that were used for illustrating the books, Kidnapped, Treasure Island, The Black Arrow, and such, they are quite large. Two by three feet isn't unusual, many are larger, and at least one is over ten feet long. But in the books they're maybe 7" X 5" or even smaller.

The rise of computer art didn't change this - not at first. The artist would still draw or paint the illustrations. It would then be photographed or scanned to form a file where the image, whether displayed on a computer screen or printed as a hardcopy, was a series of pixels of the proper color and location. These bitmaps or raster graphics were permanently fixed as a grid.3

The drawback is these bitmap images can be quite large and so take up a lot of memory. So to minimize the file size to speed up the loading and reduce memory requirements, the practice was to use the minimum resolution required. That is make the image as small as possible for the image to look good.

But if a low resolution image that looked fine on a web page was something you wanted for a t-shirt, the expanded picture will look grainy. And if you wanted the t-shirt to look good, the image printed had to be of high resolution - 300 dpi or even 600 dpi. So keeping with the original principle to work large then reduce, the original art had to be even bigger. Soon your computer will have the massive multi-gigabyte files in storage.

Then at one point, someone realized that the art is stored on a computer. Computers can crunch numbers, put them in equations, and graph the equations.

But a graphed equation is an image. And best of all, it's a simple matter to make them bigger. For instance, if you draw a circle with an equation like:

x2 + y2 = 402 pixels

Sorry, your browser does not support inline SVG.

You can double its radius by displaying the equation:

x2 + y2 = 802 pixels

... and you get:

Sorry, your browser does not support inline SVG.

If you want to fill in the image, you simply use the equation:

x2 + y2 < 802 pixels

... and plot it out:

Sorry, your browser does not support inline SVG.

Now if you take enough shapes and lines and put them together just right you'll get - ah - "art".

Note that you can't do the "View Image" or "Save Image" trick to display the picture in a separate page or save it as a file. That's because there isn't an image to display or save. Instead the computer is using the equations to determine which pixels are made black and which white. Because you can take the graphic image produced and scale it up without loss of resolution, the images are called scalable vector graphics or SVG images.

The point is with enough and the right type of equations, you can produce almost any shape you want. So if you want to expand the image, the equations are recalculated and the bigger picture is drawn. But since the equations keep the resolution at 1 pixel, you don't get a grainy picture even if you blow the picture up hundreds of times. The smoothness of the curves and edges is limited only by the display resolution of the screen or the printer.

We can see the difference of the bitmap and vector graphics that if we return to the two pictures of Lenny:

Traditional
Vector

Now on most screens you'll see little difference. However, if you expand the images - do the "View Image" stuff and then zoom in - you'll see the bitmap is far more grainy while the vector image is crisper and sharp.

It may help to zoom in on parts of the two images of Lenny. First blow up the bitmap:

... which is more fuzzy and grainy. Not something you'd put on a t-shirt or poster.

But then zoom in on the vector image of the same file size (25 kilobytes) - which remember is simply a plotting of equations:

Which is nice and sharp.

If you do the "View Image" trick4, and then expand the page, you'll see that the bimap gets even grainer and fuzzier. Not so the vector image. The edges stay sharp and smooth.

Of course, now there's software to create SVG files. Some of the software can even take a bitmap and trace the lines, fill in areas, and add colors and determine which equations are needed and create the vector image saveable5 as an .svg file.

So what, as Mr. Natural asked Flakey Foont, does it all mean?

Well, it looks like there's no longer any point for the old files - the GIF's, the JPG's, the PNG's, and even the massive memory hogging TIFF's. Just make everything an SVG and all will be - if we may quote a once famous author - "joy and jubilation, leaping and pleasure continually."

Weeeeeeheeeeeelllllll, not so fast, there, Pilgrim.

SVG files are text files. You can even open them with a text editor and if you know the basics of the scalable vector graphics language, what you see will make sense. On the other hand if you open a bitmap file in a text editor, most of what you see will be gibberish.

On a bitmap every point has to be represented in the file. So if you have a 36" X 24" poster, at 300 dpi resolution have to have over 77 million pixels to keep track of.

So although it is true that on the average the scaleable vector graphics take less memory based on the resolution, SVG files work best for relatively simple images. As the images get more complex the equations take up more and more memory. So if the need is to draw highly detailed multicolored and photorealistic images - including photographs - it's better to use bitmap files.

References

"Introduction to Vectors - Mathematics of Vector Art", Interactive Mathematics.

"The Wyeth / Tarzan Report", Phillip Normand, N. C. Wyeth and New Story Magazine, Recoverings.

"Bitmap vs Raster - What's the difference?", Wikidiff.

Walden or Life in the Woods, Henry David Thoreau, Ticknor and Fields, 1854.

The Egyptian, Mika Waltari (author), Naomi Walford (translator), Putnam, 1949.