Home	About	Braindump	Links	Donate	Ask the Opossum

Thinkydink Stupid Graphics Tricks I

You don't have to have a lot of fancy programs, training or even skill to create some pretty snazzy graphics for use in web pages and other documents. If you have Microsoft Windows and Microsoft Office installed, you've got a whole set of tools you probably didn't even know about. And if you're reading this you've got access to the web, where you can get lots of other things to help you. Check the links page for online resources offering free and shareware graphics and fonts.

MS Paint - Making Wallpaper and Icons

MS Paint - More Powerful Than You Think

MS WordArt

MS PowerPoint

Drawing Tools Embedded in MS Office Programs

A Word About File Formats

MS Paint - Making Wallpaper and Icons

Microsoft Paint is the simple little graphics program that comes with Microsoft Windows. You'll find it under Programs - Accessories - Paint. Take a look at these two graphics, both of which I created in Paint for use as desktop wallpaper:

kitties	halloween

These graphics are small enough to be used as icons, also. Believe it or not, you can create graphics like these very easily.

	First, I opened the Paint program (Programs - Accessories - Paint), then I clicked File - Open. By default, the Paint program will go to your local Windows directory because that's where all of the paint files that come with Windows are stored. All Paint files have a file extension of ".bmp", which is short for "bitmap". There's more information about file formats in the A Word About File Formats section, but you don't have to understand file formats right now. I selected "cars.bmp" from the list.
	This is what cars.bmp looks like when you open it in Paint. I chose this file for the example because no matter what version of Windows you have, you should have this file in your Windows directory.
	Next, I selected View - Zoom - Large from the main menu
	This made the image a lot bigger and easier to work with.
	Next I clicked on the Paint Bucket tool to select it (it's the second from the top on the right hand column of buttons on the toolbar at the far left of the screen). Then I clicked on the white square in the color box to select that color. The color box is at the bottom of the screen.
	My cursor turned into a little paint bucket. I positioned the paint bucket over each section and clicked once to "pour" white paint into the sections. My goal is to repaint the entire image with white. After the large blue and gray sections were painted white, I found that the paint bucket cursor was a little too hard to use for painting individual squares white.
	Before doing anything else, I selected File - Save As from the main menu and saved the file as "test.bmp". That way, the original "cars.bmp" graphic would remain as I found it. See the new file name on the menu bar? Next, I clicked on the paintbrush tool to select it, then moved my cursor across the screen in long swipes with the mouse button held down to paint the rest of the image white.
	When the whole image was white, I selected View - Zoom - Show Grid from the main menu.
	A gray grid was overlaid on the white, breaking up the picture into tiny little squares. Anyone who's ever played with a Lite Brite or colored on graph paper knows what to do now! Select the pencil tool (because it has the finest point), choose a color, then click once in each square you want to color. To demonstrate, I've drawn a simple smiley face in purple with this technique.
	Here's how the image looks when I select View - Zoom - Normal Size from the main menu. Note that Paint automatically takes away the grid.
	This is how the new graphic looks when I use it as wallpaper on my desktop. Do this by saving the file in Paint, then go to My Computer - Control Panel - Display - Background, then selecting "test" for wallpaper from the list of patterns shown.
	The Halloween graphic is shown at left in Zoom/Show Grid mode. And here it is again in its normal size: This design is more complex than the smiley face, but I created it the same way. It's easy to see how your finished product will look by switching back and forth between Zoom and Normal Size modes as you work. Try drawing simple things first, like block letters and shapes, and you'll be making more complicated stuff in no time!

Back to Headings

MS Paint - More Powerful Than You Think

MS Paint has some of the most valuable functions you'll find in more expensive graphics programs. Did you know that you can mix custom colors in Paint? Or that you can stretch, flip and rotate Paint graphics? Look at the examples below.

	You can use the Image - Stretch and Skew menu to modify your image by stretching or shrinking it horizontally or vertically, or to skew (tilt) it horizontally or vertically. Set the percent value less than 100% for horizontal to make it skinnier, vertical to make it shorter. Alternatively, set the value higher than 100% to make the image taller or wider.
	The picture at left shows how the Halloween graphic looks when I set the vertical value to 150% to make the image taller. Note how Paint distorts the image, but doesn't cut any of it off. Here's how the image looks in its normal size: Here's how the original image looks when I set the skew option to 45 degrees for horizontal:
	Select Options - Edit Colors - Define Custom Colors to create your own custom colors. Click on the little black arrow at the far right and drag it up or down to adjust brightness, click on the little viewfinder in the rainbow window and drag it to the shade and intensity of color you want. As you do, your custom color will appear in the Color|Solid box beneath the rainbow window. Click on Add to Custom Colors to add your color to the color box.
	The default image size in paint will always be set to the size of the last image you worked with in the program. You can make it bigger by using the Image - Attributes settings. Don't worry about the Units setting unless you know that you need an image of an exact, specific size. Just make the two values higher or lower to make the image bigger or smaller.
	And finally, this screen shot shows you what you can do with the other tools on the toolbar. I've used the line, the box, the freeform shape, the circle, the ellipse and the spraycan tools. And if that blue spraycan line looks familiar, it's because I used that tool to create the horizontal dividers for Thinkydink!

Back to Headings

MS WordArt

Back to Headings

MS PowerPoint

PowerPoint is not just a great tool for creating slide shows, it's a terrific graphics editor. It has many of the same capabilities as MS Paint, but it can offer many more as well. Where MS Paint gives you tools to draw solid lines, boxes and freeform shapes, PowerPoint lets you insert little arrows, 3-D shapes, dotted lines and other things right off the toolbars. Open PowerPoint to a blank page and and under View - Toolbars, place a checkmark in the Standard, Drawing, Drawing+, Formatting and AutoShapes options to see all the goodies PowerPoint can offer the budding graphic designer.

In-depth training on each of the tools is beyond the scope of this discussion, but take it from me, they're all pretty easy to learn on your own. Just start with a blank page and click on the various tools to see what they do, or consult the program Help files. I am completely self-taught in PowerPoint, mostly through experimentation. The point I'd like to leave you with is that PowerPoint is not just for creating presentations; you can use it to make flyers, announcements, maps, pictures, flowcharts, organization charts and lots of other things.

Back to Headings

Drawing Tools Embedded in MS Office Programs

Almost every MS Office program has a Drawing toolbar and clipart catalog available. Access the Drawing toolbar by selecting View - Toolbars - Drawing. Access clipart by selecting Insert - Picture - Clipart.

If you don't find these options in your program at all, the program doesn't offer them. If you see them but they're grayed out, they are available for the program but weren't installed when the program was first put on your computer; you can add them by reinstalling the program.

Also don't forget the very helpful Clipboard and Print Screen functions, both of which I've used liberally on this page. To put a copy of whatever you are viewing on your PC screen into a document, hit the Print Screen button to copy the image of your screen onto the clipboard, then go into the program where you want the picture to appear, place your cursor where you want the image pasted, and select Edit - Paste from the main menu of the program. This always works in MS Word, MS PowerPoint and Lotus Notes mail, but you'll have to experiment with other programs to see if they will support pasted graphics.

Back to Headings

A Word About File Formats

Graphics files come in many different formats, and each program has its "preferences" for the best format to use. For instance, Windows programs prefer bitmap (.bmp) and Windows Metafile (.wmf) formats: these two graphics formats are compatible with all Windows programs. Most Windows programs can accept other kinds of graphics files as well, but you won't always be able to edit or resize other kinds of graphics the way you could with a .bmp or .wmf file.

The only kinds of "flat", that is, non-animated, graphics you can use in web pages are GIF (.gif) and JPEG (.jpg) files. MS Windows and MS Office programs don't come with GIF or JPEG files and won't allow you to save your own graphics in these formats. Therefore, if you need graphics for use in web pages you will have to either get some web-compatible clipart or get a program that will convert your .bmp and .wmf files to .gif or .jpg files.

You can buy clipart on CDs at any computer or office supply store, and you can also find a lot of free and shareware graphics on the web. See the Links page for some resources. If you choose to obtain ready-made clipart, just make sure that the clipart you've selected is in .gif or .jpg format.

I purchased a web graphics program called NetStudio (and no, I don't get any financial incentives to give them a plug) for about $70, and I've found it to be one of the most frequently-used tools in my webmaster's utility belt. This program comes with a lot of web-compatible photos and clipart, including bullets, backgrounds and dividers. More importantly, however, NetStudio can take any graphic you paste into it and save it as .gif or .jpg, or any of a number of other file formats. How do you think I got my .bmp files into this page?

NetStudio also gives you tools for adding shadows, embossing, applying textures, cropping, washing out and otherwise manipulating graphics. There are several programs like NetStudio that offer these features, but I've found NetStudio to be the best value for the money and the easiest to use for beginners and advanced developers alike.

Back to Headings