Using GIMP to capture outline?

A

Appleseed

Gawd
Joined
Mar 6, 2001
Messages
830
I wanted to start using GIMP for my web comic, because I have to go through many steps as it is now and thought there has to be a better way! I also want to add color and such so here is my question...

I draw my comic in pencil first, then outline using an ink pen. Once that is done I erase the pencil and scan the image into the computer. So what I have is just the outline of the artwork. What I would like to do from there is use GIMP to grab the outline and place it on a transparent layer, so then I can put a background behind it, and color in the highlighted areas of the outlines and such. I am totally new to GIMP and have never used photoshop, since I cannot afford photoshop I went with GIMP and need a little assistance. How the heck do I do this? Hehe.

Thanks in advance!
 
There is a right way, and there is an easy way. I will try to describe the easy way. There are also some filters you can use to get the effect, but they give you less control of the process.

First open the image with Gimp. All your important menus will be accessible by "right-clicking" on the image it's self. If you mess-up at any point, you can undo your last step by pressing Ctrl+Z on your keyboard. I like to put drag the tools over to the left of the screen, and the layers to the right of the screen.

Your image needs to have two things going for it, first you need to make sure it has the right pallet, then you will need to make sure it has an alpha channel.
Right-click the image and follow the menu to Image > Mode > RGB. If you cannot select it, then you probably already have it.
Next right-click and follow the menu to Layer > Transparency > Add Alpha Channel.

In the box that contains the list of your layers (you should only have one layer in it) you will see a set of buttons directly below the list of layers. The one on the far-left should be the "New Layer" button, so press it and when the dialog box appears make sure "Transparent" is selected, and then press "OK". Notice that you now have two layers. Go ahead and add another so that you will have three. These layers pretty much work like transparencies. Your original image is the layer on the bottom. Click-grab it by the title, and drag it to a position between the other two layers. From this point on, you will NEED to be sure to select the layer you want to work with before doing stuff to your image.

From here your primary tools will be the magic wand and the bucket. When ever you select either of those tools, you will see that options for the tool appear in the area below the tools. Both of those tools will a a "Threshold" option, which I recommend you set to 15.

Choose the wand, and use it to select a piece of you image. Now use Ctrl+K on your keyboard to delete the selected area. If a checkerboard pattern emerges, that means it is transparent and the layer below will show through once you start putting stuff on it. Repeat the select and clear process on all the areas you want to remove. Once you have finished, you can de-select what is selected by pressing Shift+Ctrl+A on your keyboard.

Now you can use the bucket to fill in the drawing. You will have to change the colors, because by default the foreground is black, and the background is white. if color escapes an area, you may need to undo and then use the pencil to draw a barrier to stop the bucket.

That should get your basic foundation done, so now you can do other stuff. If you select the layer below your line-art, you can color in the background. If you select the layer above your line-art, You can put stuff on top of you art without actually changing your art. For this you will just have to take your time and try all the tools out.

When it's time to save your work, you will want to take care how you do it. I recommend that you avoid saving over the top of your original file, because it will be lost. I recommend that you make a habit of always using the "Save-As" option, and never the "Save" option. You can save by right-clicking the image, and following the menu to File > Save As.... A dialog box should then appear. If you want to be able to work on the file later, make the file type XCF, and then all your layers will be preserved without any loss in quality. When you are ready to publish to the web, PNG may be your best choice.

When you are ready to exit Gimp, be sure to AVOID using the X above the layers list. To close it, use the X above the tools.
 
If it were me, I probably would have used Inkscape for as much as possible. It has a relatively nice tracing tool. If I exhausted Inkscape, I can open Inkscape's files in Gimp to have a terrific head start.
 
Thank you so very much! I will give this a try tonight with the new comic, and if I have any issues I will post them here, you RAWK! :)
 
Choose the wand, and use it to select a piece of you image. Now use Ctrl+K on your keyboard to delete the selected area. If a checkerboard pattern emerges, that means it is transparent and the layer below will show through once you start putting stuff on it. Repeat the select and clear process on all the areas you want to remove. Once you have finished, you can de-select what is selected by pressing Shift+Ctrl+A on your keyboard.
Click to expand...

Ok when I got to this point everything went wrong or I just got confused. When I tried to highlight all the drawing part, it just selected the whole image and erased it leaving nothing but a checkerboard. What did I do wrong?
 
Langford said:
If it were me, I probably would have used Inkscape for as much as possible. It has a relatively nice tracing tool. If I exhausted Inkscape, I can open Inkscape's files in Gimp to have a terrific head start.
Click to expand...

Downloaded and tried, have no idea what I am doing with it, couldn't even find the tracing tool! (I am very new to using a computer for art)
 
Appleseed said:
Downloaded and tried, have no idea what I am doing with it, couldn't even find the tracing tool! (I am very new to using a computer for art)
Click to expand...
I see both posts. Without using psychic powers, it's hard to say what is going wrong for you. I think Inkscape will help you out more, so I will write something for it. If your lineart is dark, this should work pretty well.

1. Assuming you have already scanned and cropped your line-art, open Inkscape, and use the File menu to Open the image.

2. Click the image to select it.

3. Use the Path menu to Trace Bitmap....

4. Accept the defaults in the dialog box that appears and press OK.

5. Press the X in the corner of the dialog box to make it go away.

6. Press End on your keyboard to move the newly selected trace to the bottom.

7. Click an empty area outside the image to de-select everything.

8. Click the image to select your original image again.

9. Press DEL on your keyboard to remove the original and expose the trace.

10. Use the magnifying glass to zoom in and examine the trace. It should be smooth close up. If it is not smooth, then it means that you deleted the trace and left the original image behind.

11. Assuming it is a smooth successful trace, use the File menu to Save As... a file with .svg as the extension at the end of the filename.

Open the new file in Gimp and work on it. The instructions still apply, but you will not need to fix the pallet and alpha layer, and will not need to delete anything.

If you are feeling ambitious, you may want to take time to poke at Inkscape some eventually. If you can figure it out, it can give much nicer results that are scalable to any resolution.
 
Langford said:
I see both posts. Without using psychic powers, it's hard to say what is going wrong for you. I think Inkscape will help you out more, so I will write something for it. If your lineart is dark, this should work pretty well.

1. Assuming you have already scanned and cropped your line-art, open Inkscape, and use the File menu to Open the image.

2. Click the image to select it.

3. Use the Path menu to Trace Bitmap....

4. Accept the defaults in the dialog box that appears and press OK.

5. Press the X in the corner of the dialog box to make it go away.

6. Press End on your keyboard to move the newly selected trace to the bottom.

7. Click an empty area outside the image to de-select everything.

8. Click the image to select your original image again.

9. Press DEL on your keyboard to remove the original and expose the trace.

10. Use the magnifying glass to zoom in and examine the trace. It should be smooth close up. If it is not smooth, then it means that you deleted the trace and left the original image behind.

11. Assuming it is a smooth successful trace, use the File menu to Save As... a file with .svg as the extension at the end of the filename.

Open the new file in Gimp and work on it. The instructions still apply, but you will not need to fix the pallet and alpha layer, and will not need to delete anything.

If you are feeling ambitious, you may want to take time to poke at Inkscape some eventually. If you can figure it out, it can give much nicer results that are scalable to any resolution.
Click to expand...


Awesome, I just tried this and it worked perfectly! Thank you so much! Now I just need to learn how to use the GIMP to do color and shading and such, and to better add a background layer.
 
Thought I would show a sample of the new method thanks to Langford! Inkscape is very nice software and once I learn how to use it more I will be very happy. Now I just need to learn how to use The GIMP to add color and shading and such like I see all over the net. For now it is a vector and painted in MS Paint to start off, but YAY COLOR!

Thanks Langford!

cherrychan7done.png


Here is a link to my online comic called CHERRY CHAN . You can see how before it was just a scanned inking job and text added. Over time I hope to have amost cel shaded anime for the look of the comic! Once I learn how to that is.

Cheers.
 
Ok bit the bullet and went out and bought Photoshop CS for the Mac. GIMP was driving me crazy! I would like to know if there is an online tutorial about coloring and shading using Photoshop?
 
Langford said:
Maybe this will help a little:
http://www.cablenet.ne.jp/~japanime/tutorial/cgmain.html
Click to expand...

That looks good, I bookmarked it so I can use it later. I started mucking around with Photoshop and I think I got a handle on adding layers, transparency, and coloring. I added a couple new entries on the website with my newly found photoshop skillz (sarcasm), but check em out and tell me what you think.

http://cherrychancomic.blogspot.com/

Here is a direct pic of one of them

cherryfinal.jpg
 
You must log in or register to reply here.
Back
Top