The Apple II Art & Graphics Forum Presents... An Art Guild Tutorial - Basic Paint Program Use: Drawing & Editing By Ted O'Hara, with special thanks to Dave Seah __________________________________________________________________________ The Deep Dark Secret about Computer Artists One of the liberating things about using your Apple II to create art is that you don't have to be an accomplished artist to accomplish computer art. It helps of course, but it's not a prerequisite. My paper and pencil drawings could best be described by the word "okay", yet because the computer allows me to refine and reshape my work easily, I can create work that impresses others (and even better), please myself. More important than being able to make a sketch, or paint a painting is a visual sense of what you want to accomplish, and a great deal of patience. Roughing out a graphic doesn't take very long. Shaping it into something to be proud of can. About this Tutorial This tutorial is intended to cover the basics of paint program use. I'm going to cover the following tools: The brush, the paint can, the spray paint, the straight line, the pencil, and the editing tools: the lasso and marquee box. I'm also going to be using custom brushes and Fatbits (also called Magnify) mode. I'll be using these tools to create a picture of a crab apple tree. It consists of this text file, plus three picture files, each of which is comprised of four figures. The best way to follow along would be to either print this text file out, and load each drawing into your paint program, or use the ShowPIC NDA (found in the AGR library) to display each picture as needed. You could also load the pictures into your paint program, and use C.K. Haun's excellent NDA "WriteIt!" (found in the Productivity Forum ; keyword APR) to read this text file. Be sure to scroll the picture files up and down, as they are bigger than the screen Getting Started Drawing with the mouse does take some getting used to, and the best way to get used to it is to practice. Let's do that now. Start up your paint program and select either the brush or the pencil, and just doodle and scribble in any color you feel like until you feel comfortable with the mouse. It's not necessary to actually draw anything--you're just trying to get used to using the mouse. If you fill up the screen, choose another color and draw on top of the old doodles. If anyone asks you what you're doing tell them you're creating abstract art:) (Actually, if what you've doodled really pleases you aesthetically, you _have_ created abstract art. Save it if you wish). Once you feel a little a more comfortable with the mouse, try writing the word "hello". The important thing to remember is that when working with the brush or pencil, you're usually laying out the rough outline of the picture, nothing more. It doesn't matter if it doesn't look precisely perfect. The computer gives you the wonderful ability to come back again and again at the picture, until it pleases you. Choosing the Palette The first thing you have to do when creating a picture is choose your palette. When creating a 640 mode picture for use in another document, you might want to keep the standard palette, and of course, when using single and double hi-res you don't have a choice, but when creating 320 mode pictures you'll probably want to tweak the colors at least a little bit. Most programs only allow you to use 16 colors, but you can choose those colors from the 4096 available. Basically you have to figure out which colors of the standard palette you don't need, and replace them with colors you can use. This is going to be a picture of a flowering crab apple tree, on a nice green lawn or meadow, with lots of buttercups or dandelions scattered throughout the grass, with a plain blue sky with maybe a cloud beside the tree. This means we keep the yellow, white and blue, and add a little blue to the light gray for texture in the cloud (as it turned out, I decided not to put the cloud in, but when I was creating the palette, I thought I was going to, so I made provision for it). We're going to need two shades of brown for the tree trunk, but they have to be more neutral than the existing brown, so that has to be adjusted. We're going to need two shades of green for the grass, so it appears to have some texture, plus a third, fairly gray green for the foliage on the tree. (Crab apple leaves aren't very green). For the flowers, I'm using four shades of pink--one very dark one, for the dark petals, two medium pinks, and a lighter one for the side of the tree that is highlighted. When starting a picture, you can be kind of tentative about setting the colors--it's always possible to come back later and adjust them if you need to. For example, after a while I realized one of the browns was a little too brown. I simply edited the palette to make that brown a little more gray. Also, you should try to avoid redefining the black and the white. Except for the actual words and apple icon in the menu bar, the system uses the same palette that you do, so, if you change the black and white to something else, the menus can become very hard to read. Program Specific Information: Adjusting the Palette _________________________________________________________________ Paintworks Gold: Double click on the color you want to adjust. This will bring you to the color editing screen, with the color you clicked on ready to be edited. Adjust the sliders on the color bars until you get the colors the way you want them. You can copy one color to another simply by dragging it to the color you want to copy it to. You can select one of the stored palettes by selecting the "Color Tables..." item from the "Color" menu, and then dragging the desired palette to the palette on the bottom. Deluxe Paint II: Select "Palette..." from the "Color" Menu, or enter a lowercase "p" from the keyboard. Click on the color you want to edited, then slide the HSB or RGB sliders to adjust your colors. They change before your eyes. Platinum Paint: Select "Palette..." from the "Misc" Menu, or click on the color selection box while holding down the option button. The palette editing screen will be presented. Either select one of the built in palettes from the pop-up menu, or edit the palette manually. To do so, click on the color you want to edit. Then you can edit the color either by moving the sliders on the R, G, B bars, or by modifying the colors with the buttons. The "Lighter" and "Darker" buttons are self explanatory. The "Warmer" button shifts the color towards the red, the "Cooler" button shifts the color away from the red. The "Mix" button makes the selected color a mix of two of the other colors; first you click on the button, then the first color, then second color. The selected color changes to a mix of the two colors. The "Blend" button is used to make a range of colors, like our pinks here. You'd position the two colors you want a range of the number of steps apart you want them. Then click the "Blend" button, then the two colors in turn. The space between them will be filled with a gradation of colors ranging from the first color to the second. If you'd rather pick an existing color, click on the "Scale" button. It'll show you 256 all at once. If you don't like any of those, you can click on the scroll bar to get another 256 colors _________________________________________________________________ Starting to Draw Now that we have the palette more or less taken care of, we can start to draw. Let's start with the horizon and the foreground. What I did after selecting the straight line tool, was draw a straight line (in green) across the picture about 2/3 of the way down. To draw a straight horizontal line, press and hold down the shift key, then click the mouse on the starting point (in this case at the very edge of the picture, and drag in a horizontal manner for the length of the line. By holding down the shift key, the computer _constrains_ it to drawing either vertical or horizontal lines. After drawing the horizon line--and making sure it goes _all_ the way across (bear in mind that the painting tools obscure some of the picture, so you may want to move them or hide them-- I used the paint bucket to fill the foreground with the medium green. One important thing to keep in mind when using the paint bucket is that you have to make sure that your boundary has no gaps. If there's even one dot missing, the paint will "leak" through it, and into areas you didn't want it to. ("Undo" will restore it. Then you have to find and fix the leak) After seeing the effect, I used the paint brush to add a little unevenness to the horizon line--I wanted it to look a little more natural. Then I used the spray paint to stipple the whole area with lighter green, to add texture to the grass (Fig. 1). Masking One helpful trick is to use a mask. Both Paintworks Gold and Platinum Paint allow you to declare certain parts of the picture "off limits" to further changes--either by selecting part of the picture, or by choosing a color, which is what I did in this case. I set the computer to mask the white area, and then sprayed away at the grass with the lighter green. This saved me from having to come back later and "clean up" the overspray--the white was protected. After finishing up with the grass, I turned off the mask. Note that I did not try to draw the individual blades of grass--rather, I suggested the texture by stippling the main color with a related color. Filling the Sky After finishing the foreground, I used the paint bucket to fill in the sky. (Fig. 2) In this case, I simply chose to use one solid color. In other drawings, to get a more realistic effect, I have used several shades of blue--lighter at the horizon, deeper at the top. Drawing the Trunk Now that the tree's environment was taken care of, I started to draw the tree itself. I selected the paintbrush and chose a medium sized brush (In both versions of Paintworks, as well as Platinum Paint, double clicking on the brush icon brings up a window with several choices of brush shape.) A tree is basically a trunk, and then a series of V's and Y's. (Fig.3). Note how rough the drawing is at this stage--it looks like a child's drawing. The point I'm making is that great graphics aren't a product of fantastic eye-hand coordination; they're a product of the ability to manipulate and enhance the image until it's just so. Branching out The first step I took in enhancing the image was to select the pencil, and using the darker brown, add shading to the trunk and branches, and add more branches to the boughs and twigs to the branches (Fig. 4). An important note here is that one should decide which side is the shadowed side. You'll note that both sides have some shading (to give the trunk roundness), but that the left side is more heavily shadowed than the right. Probably the most important editing tool in any paint program is Fatbits (or Magnify) mode (Fig. 5). In this example, I'm adding shading to one of the branches. Fatbits allows you to magnify a portion of the screen, and work on it in detail. Fatbits mode is available in four levels of magnification in Paintworks Gold and Deluxe Paint II, and (currently) a single level in Platinum Paint. For many drawings, you'll find that you're spending most of your time in Fatbits. I once drew a map of Cape Cod (freehand!). I used the paintbrush to draw the rough outline, and make sure the basic proportions were correct, then spent the rest of the time zoomed in, carving out the actual shape of it much the way a sculptor carves out his work from a rough block of material). Program Specific Information: Fatbits/Magnify Mode _________________________________________________________________ Paintworks Gold: Double click on the pencil icon. You can select the degree of magnification by clicking on one of the Fatbits icons on the lower right corner of the tools window. Deluxe Paint II: Either click on the magnifying glass icon, or point to the area you want to magnify and enter a lowercase "m". to adjust the level of zoom, click on the arrow icon next to the magnify icon, or enter a "<" or ">" Platinum Paint: 1. Double click on the pencil icon. or 2. Enter Open Apple (OA) -F or 3. Apple click the pencil on the spot you want to magnify. or 4. Choose "Fatbits" from The "Misc" menu. There's currently only a single level of magnification. ________________________________________________________________ Ready for Flowers Now the branches are ready to bloom, but there's a neat trick that I want to show you first. I'm going to draw the flowers in the sky area first, so I don't have to worry about messing up the branches. First I set the size of the sprayÊcan to a small area the size of the boughs of flowers that I wanted to draw. Once the spray size is taken care of, the flowers and foliage can be drawn. I began by spraying a base of the dark green for the leaves, then some of the dark pink, then some of the medium pink. This little blob of colors formed the basis for most of the flowers and foliage on the tree. Program Specific Information: Setting the Size of the Spray Can _________________________________________________________________ Paintworks Gold: Select an area the size of the spray pattern desired with the marquee box . Then choose "Use as..." from the Goodies menu.. A dialog box will appear. Check the Spray Size box. Then click the "Temp" button, unless you want that size to be the permanent Paintworks Gold spray size from now on, in which case you'd click "Save". Deluxe Paint II: Command click (Click while holding down the command key) the spray can icon. The shape is always round, but it can be resized. Platinum Paint: Hold down the apple key when you start to "spray". Instead of painting, an oval appears. By moving the mouse, you can vary the size of the spray pattern. The pattern will always be an oval, but you can change the size and shape, within certain bounds. _________________________________________________________________ Some Background on Selecting Many of the editing tools work only after a part of the image has been _selected_.. There are two tools for selecting: the marquee box, so called because it appears as a box of flashing, moving dots, sort of like on a movie marquee, and the lasso. The marquee box is used to make rectangular selections, the lasso is used to make selections of irregular shapes. The action of the lasso depends on the background color. What's the background color? Think of it the color underneath all the other colors; the color of the canvas that you're painting on. When you cut something out of the drawing, the background color is revealed where the selection is cut. Program Specific Information: Selecting the Background Color _____________________________________________________________ Which color is the background color? It's whatever color you make it. When you start up, it's white, but it's easy enough to change. Paintworks Gold: Hold down the option key and click on the color desired. Deluxe Paint II: Command click the desired color. Platinum Paint: Click in the color selection box just outside of the two rectangles, and when the pop-up menu appears, select the color you desire. The area outside the two rectangles will change to that color, indicating it is now the background color. _________________________________________________________________ When you lasso an object that is not surrounded by the background color the area selected is the area traced by the lasso (Fig. 6). After changing the background color to the sky blue, I used the lasso on the flowers again. Now that they were surrounded by the background color, the lasso shrinks to fit the non-background colored object; in this case, the flowers are selected (Fig. 7). Now comes the fun part. I turned the flowers into a custom brush. Once an object-- any object-- is selected, it can be used as a brush. You can make multiple copies of it, or smear it around.... whatever you want. I used the flowers as the brush. Everywhere I clicked, an image of the flowers appeared. I painted them onto the branches, filling the tree out. On some of the branches, I painted them past the existing ends of the branches, making the branches look longer, and also making them look like they were drooping with flowers. Then I put one blob of flowers back in the sky, selected it, rotated it to follow the slope of some of the lower branches by selecting the blob, choosing "Rotate" (from the Select or Edit menu, depending on the program) and grabbing one of the handles superimposed on the selection and moving it to show how I wanted the flowers rotated (Platinum Paint will actually allow you to specify a rotation angle), selected the rotated flowers and brushified them. Then I did the lower branches. (Fig. 8) I wanted to add some highlights to the flowers, so I created another set of flowers, this time using the three lightest pinks, brushified it, and daubed this brush over the upper parts of the tree. The tree was now basically finished. (Fig. 9) Program Specific Information: Custom Brushes _________________________________________________________________ Paintworks Gold: Use the "Use As Brush" command from the Select menu. Deluxe Paint II: Click on the brush icon or enter a lowercase "b". Clicking on the icon again will change it to a free-form grab. The selected area will become the brush. The background color must be set correctly. Platinum Paint: Use the "Brushify " command from the Edit menu (or OA-,); _________________________________________________________________ Final Details The tree was finished, but the picture was not quite done yet. First, it needed some uncut grass around the base. A few strokes of the pencil in green took care of that (Putting the grass there broke up the hard line where the trunk of the tree started). More importantly, the tree needed a shadow. After masking all colors except the green, I sprayed a shadow under the tree on the left side using the same green I used for the tree foliage. Finally, I sprayed in a some yellow flowers into the grass beneath the tree. The picture was done! (Fig. 11) Or was it? Is any piece of art complete until it is signed and presented to the public? Since I seldom paint a picture larger than one screen, what I'll sometimes do is scroll down a bit past where my picture leaves off, switch to 640 mode, and type my name and the date. That way it won't be too big (I don't like distracting from my work), and it's still somewhat legible in 320 mode. Then I save the picture (actually I save it several times along the way (tree.1, tree.2, tree.3, etc.) in case of man or computer made disasters), compress it using ShrinkIt (available online) and upload it to the mighty AGR library, usually the Art Guild Library. It's nice to know others are seeing your work, and we'd love to see it. Conclusion There are a few points I'd like to restate in parting. Firstly, good graphics are often a matter of not giving up on your first rough scrawl; rather they are a matter of refining something rough, by way of the editing tools and fatbits, into something presentable. For me the hardest time with any graphic is when it does not yet resemble what it's supposed to. Once I get a sense that it's starting to look like something, I'll happily spend hours refining the thing, but getting there is sometimes a matter of perseverance. Secondly, it's often better to _suggest_ detail, especially with the relatively low resolution available to us, than to bust yourself trying to put all that detail into the picture. The human mind is marvelously adept at filling in the blanks if the it's shown the way. Thirdly, masks can save a lot of time, by protecting parts of the picture from accidental changes. Fourthly, custom brushes are a fun and useful way of fleshing out a picture, and finally, any picture will feel more complete if it has an audience! __________________________________________________________________________ About the Author: Ted O'Hara is operations manager for Photo: Hour, a one hour minilab chain in Boston, Massachusetts. His interests include photography, computers, music, motorcycles, Star Trek, and reading. He is a Forum Consultant for the Apple II Art & Graphics Forum on America Online. He lives in Canton, Massachusetts. E-mail address: AFC Ted (America Online only) The Apple II Art & Graphics Forum AGR...We've got the answers! ---------------------------------------------------------------------- This Tutorial may be uploaded to other BBSs and Computer Services provided it is provided in whole, unedited form. Copyright (C) 1991 by Ted O'Hara All Rights Reserved ----------------------------------------------------------------------