Making a cartoon avatar

[Flowers]

Make an avatar like the following;

http://i80.photobucket.com/albums/j198/towlie2110/th_540gyrobig.gif (http://i80.photobucket.com/albums/j198/towlie2110/540gyrobig.gif)
http://i80.photobucket.com/albums/j198/towlie2110/th_Switchkicktehmoon.gif (http://i80.photobucket.com/albums/j198/towlie2110/Switchkicktehmoon.gif)
http://i80.photobucket.com/albums/j198/towlie2110/th_AraibianColorbig.gif (http://i80.photobucket.com/albums/j198/towlie2110/AraibianColorbig.gif)


Alright so tons of people asked, and it's here.

PreReq's
Some basic knowledge of Flash and Gifs.

Somewhat computer literacy.


What you'll need:
A video clip. (preferably in the Mpeg format)
Macromedia flash. (You can get a trial here www.Macromedia.com (http://www.Macromedia.com))


K getting Started.

Step 1: Crop the clip you want in any video editing software. Make it short and to the point. Export this.

Step 2: Open Flash.
http://i80.photobucket.com/albums/j198/towlie2110/1.jpg
Click on file import and find the clip. A bunch of menu's will come up, just keep hitting next or the equivalent.

Step 3: Resize the gif
http://i80.photobucket.com/albums/j198/towlie2110/2.jpg
Resize it so it fits the whole screen.

Step 4: Add a layer
http://i80.photobucket.com/albums/j198/towlie2110/3.jpg
Make sure the blank one is on top. Lock the lower layer.
http://i80.photobucket.com/albums/j198/towlie2110/4.jpg

Step 5: Zoom in and grab the pencil tool
http://i80.photobucket.com/albums/j198/towlie2110/5.jpg
Resize the pencil lead in the properties bar. (If it's not there goto window then properties) A good size to use is 2.25.
http://i80.photobucket.com/albums/j198/towlie2110/6.jpg
Change your tool setting to smooth.
http://i80.photobucket.com/albums/j198/towlie2110/7.jpg

Step 6: Tracing the frame
http://i80.photobucket.com/albums/j198/towlie2110/8.jpg
This is the hardest part. You will have to go through and trace in every frame. If the video quality is crappy you will have to guess alot where arms and limbs are. Whenever a limb blurs over, I usually make the whole thing the arm so it creates a blur affect. Notice on the aerial of my avatar. Or the arms on the arabian.

Step 7: Coloring
http://i80.photobucket.com/albums/j198/towlie2110/10.jpg

On the lower frame hit the eye button. Now just color in each frame. I usually do one color for every frame. (Move to the next frame by hitting f6) Sometimes a color wont fill. You will have to adjust your lines till it does.
http://i80.photobucket.com/albums/j198/towlie2110/11.jpg

Step 8: Adjust and export
Hit Ctrl M and adjust the fps to your liking. When your satisfied export it as an animated gif.

http://i80.photobucket.com/albums/j198/towlie2110/12.jpg



Your done!!!

Notes:


A 30 frame animation takes about an hour for me.

Each frame doesnt need to be perfect.

[Grenkutzu]

Nice tutorial, doesn't look too tough either.

[Cicero]

Drawing every frame must take some time :/

[Flowers]

Not gonna lie. My avatar took me 5 hours.

[Cicero]

Fuck fuck fuck.

[Benji]

Haha, fuck. I only have Windows 98. I REALLY need to upgrade sometime soon. Cool guide though.

[snahpuu]

i've tried making cartoons and stuff on photoshop. it seems like the same thing? i'm not sure because i never toyed with flash. just CS2 and imageready.

http://x55.xanga.com/e2fd0ae0c0530103197753/m72830433.gif

[Frostbite]

thanks again for the tutorial!:cool:

[Peleke]

Ah! I Pm'ed you about this, ignore it.

Macromedia flash? Hooray for Bittorrents!

[shengoikee]

you made steve terada into a white guy haha

[saunders]

cool tutorial, thanks a lot towlie

i'm thinking about fading a real tricking avatar into a cartoon avatar, that would be cool

[Flowers]

cool tutorial, thanks a lot towlie

i'm thinking about fading a real tricking avatar into a cartoon avatar, that would be cool

I'll expirament with that. I give you all credit man that could be cool.

HAHHAHHA I forgot that was steve.

[woohooman]

Very nice, i'm gonna try this now

[simon]

towlie you're beautiful.

[Redfire]

nice! i can't wait to try it.

i'll be using Imageready. that will work right?

[Liam-Jones]

nice! i can't wait to try it.

i'll be using Imageready. that will work right?
Not as easily

[snahpuu]

when i did the animation on imageready, it took me a while, i dont know about 5 hours. i know that using the pen tool and selecting took a hell of a long time. Plus, i had to use a shit load of layers, which made it seem complicated.

[Redfire]

i see... thanks guys. maybe i can figure out a way to get imageready/photoshop to be efficient or i'll just get flash....

[simon]

i need a graphics tablet my mouse is struggling.

[JKT]

Wow, really kl!
Thanks!

[Flowers]

i need a graphics tablet my mouse is struggling.

I really want one of these. Near when they started first coming out my art teacher back in like 1st grade asked me if I wanted to try it out. I did and told her I didn't like it, so I never used em since.

How much does one of those go for these days?

[Augenatic]

Maybe 100 bucks...

[JKT]

When you enlarge an image, on a frame to fit the stage, how do you do it so the other frames also do it without actully resizing each image on each frame?
thanks!

[Flowers]

If you have two layers, by default the bottom layer should resize every frame. unless you made them all keyframes.

[JKT]

What i mean is
when i Import the image (i still have 1 layer, this is before the drawing bit) i want to make the image (the video) fit the stage, but when i resize the image to fit the stage, i have to also do it to all the other frames!! Iist possible when i enlarge it on the first frame, the other frames do so as well?

[Flowers]

What image are you importing? You should be importing a video.

[JKT]

Gif image

[JKT]

http://img300.imageshack.us/img300/2079/lkickfirstflashanimenn4.th.gif (http://img300.imageshack.us/my.php?image=lkickfirstflashanimenn4.gif)
here is mine!

[Redfire]

this took me about 3 hours i think. i didnt keep track. anyways it got tedious so i'll probably never do this again. but anyway here:
http://x36.xanga.com/c6ad7661c2334105876877/s74892531.gif

on the other hand, it is kinda fun so i may do something like this again.

hey i got an idea! post ideas of what i can replace the background with for me to be wallflipping off of. that will be easy to change! :smile:

[woohooman]

Cant import video files with Flash professional 8?

[Flowers]

I'm pretty sure u can. i've messed around with it before i think.

Also Redfire that's awesome! i love the colors and shit. Make it off a monument.

[Flowers]

Or someone's face

[Redfire]

lol, neodine?
thanks and good idea about the monument or face:wicked:

[Flowers]

hahahaha my bad

[Martialartsguyfl]

definetly cool stuff

[saunders]

nice one redfire but wtf is happening to your hair when you are upside down?

[flipster]

if you have adobe illustrator, you can just use LiveTrace. Takes about a minute lol
if you do some tweaking you can have an awesome avatar in like...10 minutes

[albacheck]

That was a great Tutorial. Didn't have Flash, so I used After Effects and Photoshop.

http://img171.imageshack.us/img171/3418/540oi7.gif

[Neodine]

lol, neodine?
thanks and good idea about the monument or face:wicked:

What ?

[Redfire]

nice one redfire but wtf is happening to your hair when you are upside down?

i was getting bored while drawing so i made it get longer and then snap back to normal. its just weird.

What ?

someone accidentally called me your name earlier in the thread. he editted it now though. cool name btw.

[Flowers]

Someone wanna test that live trace thing. I wanna see if it turns out just as cool.

[simon]

http://x36.xanga.com/c6ad7661c2334105876877/s74892531.gif
hey i got an idea! post ideas of what i can replace the background with for me to be wallflipping off of. that will be easy to change! :smile:
Beyoncé Knowles ass.
http://www.rocknroll.net/moments/image/beyonce.jpg

[Peleke]

Hahaha, that would be amazing.

:good:

[Redfire]

here it is:
Edit: now with pants colored in and better quality.

http://x3b.xanga.com/224d272479233106092486/m75056437.gif

[Grenkutzu]

Haha! Yes, good!

[Trel]

ahahha nice ass flip

[Flowers]

I love it!

[simon]

here it is:
Edit: now with pants colored in and better quality.

http://x3b.xanga.com/224d272479233106092486/m75056437.gif
ahahahahaha you legend!
i'm linking that in my sig lolll

[simon]

try a .gif of a moving train maybe?
that would be wierd...

http://video.google.com/videoplay?docid=-3541711573601289959&q=moving+train&hl=en

[carney]

haha Awesome!!11!!!!

[Neodine]

haha awesome job :D

[Surge]

That is sweet.
5 hours is worth it ^.^

[jiayo-chris]

that is soo awsome *downloads macro media*

[Dovicka]

ok, i'm good with everything, cept when i go to do the second frame, the outline is still there from the last one, I cold get around it by making 45 diferent layers but i'm sure there is aneasier way, help me!!!

[Flowers]

instead of using f6 use f7 to make a blank keyframe

[JKT]

press f6 then delete, thats what i do....

[Flowers]

Yeah that works too. A shortcut is to just use F7

[Dovicka]

http://img241.imageshack.us/img241/9189/74264775fs0.gif

my first try, it was a vid from my old cam so it was hard to get a really acurate outline, but it was pretty cool, I'll prolly do some more

oh ya and mediacoder isn't working so I had to use some bunk trial software

[Flowers]

Thats sweet man! Is no one using the pencil tool? It seems like they are using the brush tool

[Alpha Moth]

instead of drawing every frame, do every second frame, at 24 frame a second, and make each frame twice, so each two frames are the same, its halves the time and looks exactly the same.

[Flowers]

There is a difference Alpha Moth.

http://i80.photobucket.com/albums/j198/towlie2110/crappycorkgif.gif
Is cutting every other frame.

http://i80.photobucket.com/albums/j198/towlie2110/Corkscompare.gif
Is the original.

[Alpha Moth]

I made this in 10 minutes, skipping every 2 frame, and using the one inbetween just as same as before.

http://img184.imageshack.us/my.php?image=hhhhno6.swf

pause mine and you can see every 2 frames are the same, and i got the same effect from doing all the frames..

[kamikaze!]

OK, I seriously LOVE that switch kick the moon avatar...
Can I use it towels? Pretty please ;D

[Flowers]

Go ahead.

[Neodine]

and towels I looooove you avatar. :D

[Neodine]

I made this with photoshop and imageready.
thanks for the tutorial :)

http://i45.photobucket.com/albums/f59/Neodine/asdgasdg.gif

[KJER]

thats pretty dope
2 bad im 2 lazy and not 2 educated 2 make that...looks nice tho

[Flowers]

That's awesome Neodine!

[Peleke]

Towlie kicks ass.

I just got around to wasting time trying this, kick ass tutorial. :good:

[bahamuto]

I attempted this and it turned out horribly, i suck.

http://i67.photobucket.com/albums/h285/psohuntr/ff.gif

Edit: btw, does anyone know how to/if its possible to apply a filter to all layers in adobe image ready?

[Neodine]

that's not bad at all Bahamuto.

To aply filters to all layers, aply the filter on the first pic, then just click the second layer and press Cntrl+F, that copies the filter. then just keep doing that to all the layers, I don't know easier way to do that, I think there might be one, but I don't know it.

[Flowers]

Dude Bahamuto that's pretty fucking sweet. I added it to my personal collection

[Neodine]

made another one again. :D but now landed one.

http://i45.photobucket.com/albums/f59/Neodine/age.gif
and a bit better version
http://i45.photobucket.com/albums/f59/Neodine/aagagagd.gif

[Flowers]

awesome. ur style is so weird ha ha

[Neodine]

awesome. ur style is so weird ha ha

If you mean my tricking style, its unique, in a wrong way O___o

[Flowers]

the arch on your cork is sexy!

[Neodine]

the arch on your cork is sexy!

thank you :juji:

[DarkXacreD]

my flash 5 doesn't want to import it WMV. I tried importing AVI but it just got the first frame.

[bahamuto]

Awesome, towels im honored haha

[FatTricks]

Argh. I could'nt figure out how to see the video in Flash 8....so I was forced to use Ulead Gif 5. Oh well....same outcome. Thanks anyways Towels for lighting the path.

[JKT]

Wow fattrics thats WIKED, man i never thought of a backflip going in to a moonkick! oh yeah and wiked animation of you doing it :tounge:

[Flowers]

wow thats pretty damn fluid Fattricks. Snk is drooling right now.

[FatTricks]

Wow fattrics thats WIKED, man i never thought of a backflip going in to a moonkick! oh yeah and wiked animation of you doing it :tounge:

wow thats pretty damn fluid Fattricks. Snk is drooling right now.

Hahaha thanks guys. It's a TigerSwipe. The only people that I've seen do them is 1st Sessh, 2nd Webster Kid. It's like a "pop" swipe. Think of it as a jump roundhouse on a moonkicking angle.

....now if I can only add a hook to it.....

[Peleke]

That would be ridiculous if you could hook it haha.

Fat trickers rock. :good:

[kamikaze!]

Hm.... I used Towlies moonkick.gif as avatar but it wont "move" as you can see
Why so?
:S

[Neodine]

how big the file is ? try to upload it for example to the photobucket.

[Benji]

How do you adjust the brightness of your .gif?

[Flowers]

Adjust the brightness of ur clip

[Thae]

I made one, not so good though. And it's very little.

http://img.photobucket.com/albums/v314/t0nki/thae1h-cw123.gif

[Flowers]

Hahaha surely you could find a cooler clip than that

[brandonn]

Towels: how bored are you?



:D

[jester22]

it sure takes a while but it comes out sick in the end