Exercise 6: Working with Layers

I want to go through one example of why to put things on different layers. Let's make a scene. You may want to follow along and make your own multi-layered image. Open a new document, say 50x50pixels, with a Transparent background.

Now, fill the background with a color of your choice. I'm choosing to make an outdoor scene, so I will use blue for the sky. Now, make a New Layer by clicking on the New Layer button in the Layers Palette, or using the keyboard command mentioned above. In my document, I'm going to use the lasso tool to draw the ground/horizon and fill it with green for grass. I'll also make new layers for whatever else I decide to include in this scene. At this point, go ahead and draw something on each layer, and then come back here & see what I've got going on my end.

[time passes]

Okay, I'm finished. Here's what I made, and the corresponding Layers Palette.

Look at that happy kitty. Is she really happy? It's hard to tell with so few pixels.

In the above example, I put all of the different types of elements on their own layer. Grass is one, flowers are all on one, etc. You can see in the Layers palette on the right what is positioned where. You may also notice that each layer has a name. This doesn't happen automatically, aside from the default names "Layer 1", "Layer 2", etc. I find it to be a very good idea to name your layers.

I'll quickly run through the process of making this image:

I opened the new file, zoomed in, chose a color and filled the background layer using the keyboard ("OPTION" + "DELETE" on Mac). Then I made a new layer, used the Lasso tool to draw the grass shape, looping the selection around the bottom of the window, and filled it with green. In a new layer, I drew cloud #1 with the Lasso tool, filling it with white. New layer, I drew cloud #2 with the Lasso tool, filling it with white. New layer, I drew the flowers all on one layer using the Pencil tool only. I also used the Eraser tool (E) to remove pixels when I needed. (with the Eraser tool set to "Pencil at the smallest brush size, 1 pixel). Next, I made a new layer, I drew the cat with the Pencil & Eraser tools. In the final layer, I drew the fly with the Pencil, so the cat would have something to play with.

This was looking good to me. I decided to change the Opacity of the clouds, so they wouldn't look so stark white. That also looked nice, but I wanted to demonstrate changing opacity. Each layer has controls on top of the Layer Palette. I selected the layer with Cloud #1, and changed its opacity to 63%. I changed the second cloud layer to 67%. Then I decided I wanted to overlap clouds to give the illusion of depth. I made another new layer, drew a cloud with the Lasso and filled it with white. Since it’s on its own layer, I was able to change its position by moving it around to a new spot. I then changed that layer's opacity to 40%. As you can see, the overlapping semi-transparent clouds make some unique effects.

Just for some more examples of my use of the Layers palette, here are a few palettes from files I made for our games:

The one on the right is from the original game map file of Ratmaze 2, a portion of the Layers palette, which is the the graphic aspect of the game and all of its elements That palette also shows that you can color code your layers to help you organize & categorize. Choose colors in the Layers Properties. Click the little arrow on the top right of the Layers palette & you shoud see it, along with a bunch of other Layer options. Notice what else is in there & try other options out some time.

Exercise #7: Layer Contents