Layers in Paint.NET - HRSBSTAFF Home Page

66 downloads 978 Views 4MB Size Report
PAINT.NET. LAYERS TUTORIAL. BY: ANDREW KICENIUK. Table of .... Paint. NET is a program that is designed to operate like MS Paint, but with added features ...
PAINT.NET

LAYERS TUTORIAL BY: ANDREW KICENIUK

Table of Contents Introduction......................................................................................................................... 2 Work Area Tour.................................................................................................................. 2 What Are Layers? ............................................................................................................... 3 Why Use Layers?................................................................................................................ 3 Adding A Layer To An Open Image .................................................................................. 4 Flattening An Image ........................................................................................................... 8 Layer Adjustments .............................................................................................................. 9 Duplicating A Layer ......................................................................................................... 10 Deleting A Layer............................................................................................................... 10 Changing The Order of Layers ......................................................................................... 11

Introduction Paint.NET is a program that is designed to operate like MS Paint, but with added features. Therefore you can use this program to create pictures from scratch by using the line, curved line, rectangle, oval, rounded rectangle, pencil, eraser, text and paint brush tools, just like you can in MS Paint. The additional features, such as, layers, cloning, selection, and effects/adjustment menus are designed to provide the capacity to manipulate digital images. Work Area Tour

Tool Bar: Options for formatting and adjusting tools

History Window: displays all the changes you have made to the image since the file was opened. You can use it to undo any changes you have made.

Tools Image Canvas

Status Bar: displays a number of different options/tips for how to use the currently selected tool Back to Table of Contents

Layers Window: displays the currently selected layer in blue. This is a very important window.

What Are Layers? It is possible to compose a single image out of multiple images stacked on top of each other. Each image in the stack is called a layer because the images are layered one on top of another. The bottom image in the stack is called the background layer and it is usually a solid image. Solid in this context means that all the pixels in the layer have an assigned colour, or in other words there are no transparent pixels. The other images stacked on top of the background will have some solid areas, as well as, transparent areas. The layers concept is very much like a frog diagram in a biology textbook, please see the example below.

Background image of a frog

Image layer of frog organs

Two layers make a single image

Why Use Layers? One of the main reasons for using layers is that it allows you to make changes to portions of your picture without inadvertently damaging any other parts of the image. For example, the two images below show the results of modifying a frog image by erasing part of the frog’s leg muscles. The image on the left is a normal, single layered picture. The image on the right is composes of multiple layers. When you erase the muscle, there is no solid frog leg under it, just transparent pixels.

When you erase the muscle, there is a solid frog leg under it.

Results of a regular picture being edited.

Results of a multi layered image being edited.

Back to Table of Contents

Notice how the transparent areas of the top layer allow the solid areas of the bottom layer to remain visible.

Adding A Layer To An Open Image You can add a layer to an open image by selecting: Layers

or You can select the Add Layer button on the bottom of the Layers Window. The Layers window is located on the bottom right-hand side of your screen.

Note: If you cannot see the Layers window you will need to open it by selecting: Window Layers

Add New Layer

Once a new layer is created it will appear in the layer window with the default layer name of ‘Layer 2’. It is a good practice to give all your layers a name that describes their contents. Why? It is not uncommon to have an image with a dozen or more layers. Thus descriptive names help you quickly identify what is on each layer. To do this select the Layer Properties button on the bottom right hand side of the Layer’s window.

Enter a name that describes the contents of the layer. This will make it easier for you to identify what is on each layer of a multi-layered file.

Once you press OK, the updated name will appear in the layers window.

Look at this young man. Clearly he is handsome, but I though he could be even more dashing if he had a good thick moustache! This is how I did it: 1) I selected the layer I wanted to put the moustache on. (I know that I have correctly selected that layer if it turns blue in the layers window.) 2) Then I would need to select my paintbrush tool and paint the moustache across his face.

Note: Your paint brush will default to a very small brush size of 2 pixels in diameter. Trying to paint a moustache using such a small brush would take a very long time.

You can make the task much easier by going to the Tool Bar at the top of your window and changing the “Brush width” to a larger size, such as 25 pixels.

3) After painting the moustache I can check the layer window to make sure that the moustache is on the correct layer.

4)

If I want to perfect the moustache without having the other layer visible, I can do this by deselecting the visibility checkbox for that layer. The result is a canvas that shows only the moustache.

5) Once I had the moustache drawn I realized that it looked a touch unnatural. Ummm…What was making it look so fake? Eureka! It was the fact that the moustache was so dark! That just would not do. We could not have people thinking that this person dyes his moustache. Luckily, there was a solution. I used the Layer Properties dialog box to change the opacity of the moustache. By decreasing the opacity I made the moustache more transparent. This helped blend the moustache into his face.

The end result was an image doctored so well that it could fool even the most discerning forensic scientist into thinking this man had a moustache.

Back to Table of Contents

You Try: 1) Open a picture of yourself 2) Go to: Layers Adjustments Black and White 3) Create a new layer 4) Give your layer a descriptive name. 5) Select your Paintbrush tool 6) Draw some graffiti on the new layer so it looks like it has been painted on your face. 7) Change the opacity of your moustache layer. 8) Deselect and select the checkbox on the right hand side of your moustache layer. How does it affect your picture? 9) When you are done you should have a picture similar to this. Flattening An Image The process of combining all your layers into a single layer is called flattening an image. There are a number of reasons why you would want to flatten an image: 1. You have completely finished editing an image and you want the final product to be saved on a single layer. 2. You would like to reduce the size of your image file. The more layers you have the larger your file will be. 3. You have a file that will have a lot of layers, it is good to completely finish editing some of the layers and flatten the image, before adding more new layers. This will keep the number of layers in your layer window to a manageable level. To flatten an image simply select Image Flatten.

!Beware!

Once you have flattened an image and selected to save the file, you will not be able to restore the layers you previously had.

Once an image has been flattened all the layers will be merged into the single background layer. Back to Table of Contents

Layer Adjustments There are various adjustments that can be made to the colours of a layer. These can be accessed by going to: Layers Adjustments

For example, by selecting Sepia from the above adjustment options, the colour of my selected layer is adjusted as shown below.

Before layer adjustment Back to Table of Contents

After layer adjustment

You Try 1. 2. 3. 4. 5. 6. 7. 8. 9.

Flatten your image. Apply the Sepia Layer Adjustment to your background layer. Create a new layer. Name the layer “Wanted” Select the Text Tool Pick a colour for your text. Type: “Wanted: $500 Reward” Position the text at the top of your image. Check to see if your picture looks similar to

Duplicating A Layer There are times when you will want to have a duplicate copy of a layer. This can be done by selecting the Duplicate Layer icon in the Layers Window. The result is a second copy of that layer.

Deleting A Layer Select the layer you want to delete and choose the Delete Layer icon on the Layers Window.

You Try 1. Select your “Wanted” layer. 2. Select the duplicate layer twice. 3. Select the text on one of your “Wanted” layers. 4. Position it near the bottom of the page. 5. Delete the third copy of the “Wanted” layer. 6. Check to see if your picture looks similar to Back to Table of Contents

Changing The Order of Layers It is possible to rearrange the order of your layers. For example, you may want one layer to appear under another. To do this you: 1. Select the layer that you want to move 2. Then you select the Move Layer Up or Move Layer Down arrow on the bottom of the Layers Window. This will move the selected layer in the direction that you indicate.

In the above example the Move Layer Down arrow was selected causing the “Wanted” layer to move down below the background. When the “Wanted” layer is moved below the background, some of its visibility will be obscured by the solid pixels in the “Background” layer, as shown below.

You Try 1. Select your lower “Wanted” layer. 2. Choose the Move Layer Down arrow. 3. Check to see if your picture looks similar to that on the left.

Back to Table of Contents