STORY LOOP FURRY PORN GAMES C SERVICES [?] [R] RND POPULAR | Archived flashes: 229672 |
/disc/ · /res/ — /show/ · /fap/ · /gg/ · /swf/ | P0001 · P2596 · P5191 |
This is the info page for Flash #66727 |
Loading... |
FlashThinker |
productions |
Flashthinker's |
Realistic Cartooning Tutorial |
Welcome to my first ever flash tutorial! Have you ever given up on making flash movies because it is too complicated, boring or your drawing skills aren't quite measuring up? Well, if so, this tutorial is perfect for you! I will be showing you step-by-step methods of drawing awesome cartoon characters with a sense of realism. You don't even need to have an artistic mind to do it, only patience! Before you press "Start" I would like to point out that this tutorial was made for people who possess some knowledge of the numerous basic flash animation and drawing tools. However, I will try my best to explain the steps as clearly as possible. |
Start |
Start |
To see the end product: |
Click Here! |
Next |
Next |
Assuming you're not the most creative person, you will need guidelines/rules to help you create a nice and consistent looking character. The best piece of advide I can give you comes from the basics of drawing; Tracing. That's right, back in your early days of school, this is how you managed to draw things if you either; had no skills, or needed an exact duplicate of a picture or graphic. What I usually do is go to an image search engine such as Google Images and type the name of what I want to draw. This image will be your ultimate guideline! In this example I will be making a sketch of Harry Potter for a cool parody. Click "Next" for more instructions! |
Step 1 - Find a Guideline |
Back |
Back |
Menu |
Menu |
Step 2 - Getting Started |
!- Make sure you get the largest size image; larger images are much easier to trace. If you need a small picture, take a large image and trace a large version, then, once you're done, you can scale it to the size you want. You will find this method more accurate than tracing a small photo. |
Go to Google Images and type "Harry Potter," you should see a photo of him that looks like this: |
Copy the photo from google directly into your flash, or alternatively, save it to your computer, then import it - whatever you prefer. |
Step 3 - Tracing (Introduction) |
Before getting your hands down and dirty with all that tracing, You need to insure that you separate each movable part in it's own layer so that you may animate each part individually (if you want to animate it). Also, when tracing for animation, you will need to extend each part a little more than needed to enable better animation (don't worry if you don't get what i'm saying, it will become much clearer very soon) Press "Next" to get started! |
Step 4 - Tracing (Part 1) |
Firstly, get the "Harry Potter" photo onto the stage as such: |
!- You can, and in fact, I encourage you to make it larger (use the whole stage if you will) Click "Next" to start tracing! |
Step 5 - Tracing (Part 2 - Layers) |
Now lets start tracing! First we need to trace the parts of this picture that are further behind. I.e. The neck is behind the face, the face is behing the eyes, the eyes are behind the glasses, etc... The furtherest object in this picture seems to be the neck, so we will draw it first remember that you need to make it in its own layer, so add a new layer (right click the current layer and select "Insert Layer") and call it "neck and shirt." Lock "Layer 1" to avoid drawing on it. |
Step 6 - Tracing (Part 3 - Tracing) |
Now, Using the pen tool on the left toolbar, trace the contour of the neck and shirt like this (click on the play button): (I recommend using a white outline!) |
!!- Did you notice that I finished the coutour with a curve? This is what I was refering to by "extend each part" from step 3 of this tutorial. It gives you some room to lift the head up and down without having an odd gap between the head and neck. The top of the neck goes behind the face. (Don't worry if you don't get what I'm saying for now, It will become clearer as we go) |
Step 7 - Repeating the steps |
<p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Ok, you see the color inside the neck and shirt contour you've just drawn?</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">If so, delete it! We only need the outline for now, it makes things easier!</font></p><p align="left"></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Now that you have done the neck, you need to make the next furtherest</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">part of the picture; the face.</font></p><p align="left"></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">So add a new layer on top of this one and call it "face", you should lock all </font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">the layers underneath the "face" layer to avoid drawing in the wrong layer.</font></p><p align="left"></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Repeat what you've done in the previous step by tracing the contour of the </font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">face. Once you're done, click "Next" for an insight as to what your character</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">will look like once everything is traced.</font></p><p align="left"></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Please take note of what I have NOT yet traced! and read EVERYTHING on </font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">the page to make sure you get it right the first time!</font></p> |
Step 8 - Continue Tracing |
<p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Continue tracing all the parts so that your end-product looks like this:</font></p> |
!!- Notice how I've separated the front part of the hair (Front Hair) from the back (Back Hair)? and Also how I've made each part overlap? You will need to do the same when tracing your own character, it is extremely useful for animation! !!- Also, please note that I have left out the pupils in the eyes! That's because I will "mask" them into the eyes later. Before you click "Next" continue tracing the parts until you have something that looks like what I have on the left, remember to lock layers of completed parts as you go and insert a new layer for each part. (don't forget to name!) |
!!!- Although you have drawn the neck before the back of the hair (which is in fact behind the neck), you can correct this by dragging the "Back hair" layer under the "Neck" layer! |
Look carefully at this and try to identify each separate part. |
Step 9 - Making the Eyes (Introduction: Masking) |
Go to your "Right Eye" layer (or whatever you called the layer containing the contour or Harry's right eye), right click the layer and select "Insert Folder" to add a folder. Call that folder "REye" (or anything you like :p). Now drag the "Right Eye" layer onto the "REye" folder, We will be making the eyes now! The reason why we will be using a folder is to keep all the layers that make up the eye together in the same folder - yes... that's right we will need a few layers to make the eyes because the pupil will need to be masked into the shape of the eyeball. Now... what is done to one eye must be done to the other (Duh!), so repeat the previous step for the "Left Eye" layer; remember that so far, the eyes are only a contour. Click "Next" to get started. |
Step 10 - Making the Eyes (Part 1) |
<p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">First we will do the right eye. Navigate to the "REye" folder and add 3 new </font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">layers inside that folder. Insure that the "Right Eye" layer is under all other </font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">layers within that folder.</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Once that's done, name the layer just above: "Pupil" and the layer above that</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">"PMask", then, the layer above that layer (the top layer within the folder), </font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">call it: "Gloss".</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Right click the "PMask" layer and select "Mask"</font></p><p align="left"></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Your folder should look like this: (be sure to unlock the masked layers)</font></p> |
Click "Next" to start drawing! |
Step 11 - Making the Eyes (Part 2) |
Select the "Paint Bucket" tool and open the "Color Mixer" panel, click on the paint bucket icon: |
<p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Then, click on the drop-down selection box where it says "Type: [solid]" and</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">choose "Radial." </font></p><p align="left"></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Make the gradient look something like this:</font></p> |
<p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Click "Next" to continue!</font></p> |
Step 12 - Making the Eyes (Part 3) |
<p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Lock all the layers within the "REye" folder EXCEPT the "Right Eye" layer.</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Click on the "Right Eye" layer and... with your "Paint Bucket Tool" still selected,</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Click inside the countour of the eye to fill it up with your gradient.</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">(You might need to change the "Gap Size" of the paint bucket if you have gaps</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">in your contour)</font></p><p align="left"></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Using the "Gradient Transform Tool," drag the gradident so that it fits appropriately</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">as such: (you can make it oval if you like; if you're a perfectionist)</font></p> |
<p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">As soon as you've finished filling up the eye, you may delete the contour (If you like).</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Now we have the background of the eye! Awesome huh?</font></p><p align="left"></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Lets have some fun making the pupil and do </font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">some masking now! But first, hide ALL layers</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">except the "Pupil" layer</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">AND "Layer 1" (the photo).</font></p><p align="left"></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Click "Next"</font></p> |
Step 13 - Making the Eyes (Part 4) |
<p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Drawing the pupil is a very important part of this whole thing. It will show you</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">how to reproduce the real picture into your very own cartoon character!</font></p><p align="left"></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Listen up! this is very exiting... You will use the colors of the eye from the actual</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">pupil in the photo to draw you own. Click on the "Oval Tool," draw a circle and,</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">inside it, using the "Brush Tool;" make a rough sketch of the eye using the colors</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">from the actual eye with the help of the "Eyedropper Tool." Don't forget the</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Iris at the end (Using the "Oval Tool")</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">What you will end up with will look something like this:</font></p> |
<p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">!- Pretty messy huh? don't worry</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">It will look better soon!</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Just look at how I've used the colors</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">from the real photo!</font></p> |
<p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Now look at the eye in it's proper size:</font></p> |
<p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">!- See! You don't need a great deal of detail </font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">to make it look real! this is the same drawing as </font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">above; it no longer looks messy!</font></p> |
<p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0"><b>!!!- Remember to place <sbr />the pupil within the <sbr />contour of the eye!</b></font></p> |
Step 14 - Making the Eyes (Part 5) |
<p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Now... Go to the "Right Eye" layer and copy the fill of the eye (Ctrl+C):</font></p><p align="left"></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Paste it in place inside the "PMask" layer (Ctrl+Shift+V). You may now lock </font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">the masked layers and "Show all layers." Ok, your eye looks nice now! but it</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">still has something missing! You need some gloss! the eye needs to reflect stuff!</font></p><p align="left"></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Draw a circle roughly the size of the pupil inside the "Gloss" layer. </font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Make its gradient like this (delete the contour once you're done):</font></p> |
<p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">The eye should now look like this (Awesome!):</font></p> |
<p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Hang in there... it's nearly finished! Click "Next" to learn how to </font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">add a gradient to the skin, lips, hair... everywhere!</font></p> |
Step 15 - Generating Skin Tone (The Face) |
<p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Let's make some skin! </font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">It's easy! We will be using a radial gradient that will be centered accordingly to</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">the light source as such:</font></p> |
<p align="left"><font face="Arial Baltic" size="10" color="#ffffff" letterSpacing="0.000000" kerning="0">Light Source on Left</font></p> |
<p align="left"><font face="Arial Baltic" size="10" color="#ffffff" letterSpacing="0.000000" kerning="0">Light Source on Right</font></p> |
<p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">!- See how the gradient differs in </font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">the two pictures!</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">This is how what we'll do for Mr Potter!</font></p> |
<p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Go to the "Face" layer of the timeline! If it is locked, unlock it and lock </font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">(hide if you wish) all other layers except "Layer 1 (the one with the photo)".</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Follow the movie bellow to create the gradient: (press the play button)</font></p> |
<p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Remember to delete the contour once you're done!</font></p> |
Step 16 - Generating Skin Tone (The Nose) |
<p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">I won't show you how to do everything, only the difficult parts. Taking into</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">account the "light source" you can figure out how to make the gradient for</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">the hair, the neck, the lips etc... You need to remember to use the colors </font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">from the photo using the "Eyedropper Tool."</font></p><p align="left"></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">I will show you the nose because it will be a bit difficult.</font></p><p align="left"></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">First go to the "Nose" layer and hide all other layers except the "Face"</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">layer which you simply lock. Then, with the "Paint Bucket Tool" still sellected; </font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">add the same gradient you used for the face to the nose. Delete the contour and</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">adjust the gradient to match the light source.</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Does it look a bit dodgy? as such:</font></p> |
<p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">!!- See how the nose doesn't </font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">quite "merge" in the rest of </font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">the face?</font></p> |
<p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">To correct this, you will need to</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">alter the gradient, so that the nose</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">fits into the face!</font></p> |
<p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Click "Next" to continue!</font></p> |
Step 17 - Generating Skin Tone (The Nose 2) |
<p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Select the darker color box of the gradient:</font></p> |
<p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Double click it and with the eye dropper, click on</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">the area just above the nose so that it looks like </font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">this:</font></p> |
Area above nose |
<p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Adjust the gradient so that it merges well with the </font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">rest of the face, then click "Next"</font></p> |
Step 18 - Adding Color to the Rest! |
<p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Only one more step after this one!</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">This step is a do-it-yourself, you have to use what I have taught you so far</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">to make the rest of the gradients.</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">To help you, here is a copy of the finished product, look carefully, you will figure</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">out how to do it! Everything, except the glasses, was made using radial gradients!</font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">Remember to lock or hide the layers as you go! Also DO NOT forget to use the </font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0">colors from the original photo! and lastly, use the light source!</font></p> |
Step 19 - Finishing Off!!! |
This is the last step. So far what you have should look great, although now, you want to make it even MORE realistic by adding shadows! *This part requires some creativity and skill* This step is fun and very basic, now, all you need to do is add a layer named "Neck Shadow" under the "Face" layer, a "Face Shadow" layer above the "Face" layer, and a "Highlights" layer above the "Front Hair" layer. Then, go to the "Neck Shadow" layer, select the "Brush Tool" and set the color to a semi-transparent black, make it's alpha transparency around 10% and, as neatly as possible draw the shadows on the neck like in my drawing! Then go to the "Face Shadow" layer and draw the shadows on the face, you can fiddle around with the brush tool to add highlights around the eyes (the eyes in my drawing arn't highlighted well enough). Then add the highlights on the hair, eyebrows, face; in the "Highlights" layer. Once you're happy with what you've done, you're done! Now try to draw yourself in flash (find a picture of yourself and repeat what I have taught you! You could be in your very own flash movies!) |
<p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0"><b>!! - (You can access my sample Harry Potter</b></font></p><p align="left"><font face="Arial Baltic" size="12" color="#ffffff" letterSpacing="0.000000" kerning="0"><b>drawing from the menu page!)</b></font></p> |
ActionScript [AS1/AS2]
Frame 1Stage.showMenu = false; stop(); bar_mc.onEnterFrame = function () { bl = getBytesLoaded(); tb = getBytesTotal(); per = bl / tb; percen = per * 100; percent = Math.ceil(percen); bar_mc._xscale = percen * 1.2; if (percent == 100) { onEnterFrame = null; b_mc.removeMovieClip(); line.removeMovieClip(); gotoAndPlay (2); } }; onEnterFrame = function () { xdif = _xmouse - b_mc._x; ydif = _ymouse - b_mc._y; this.createEmptyMovieClip("line", 1); this.line.pos = new Object(); with (this.line) { lineStyle(1, 16777215, 100); moveTo(_xmouse, _ymouse); curveTo(_xmouse + _root.xbend, ((_ymouse + b_mc._y) / 2) + _root.ybend, b_mc._x, b_mc._y); } };Instance of Symbol 16 MovieClip "b_mc" in Frame 1onClipEvent (load) { k = 0.02; damp = 0.97; vx = 0; vy = 0; grav = 2; } onClipEvent (enterFrame) { this.swapDepths(getNextHighestDepth() + 2); ax = (_root._xmouse - _x) * k; ay = (_root._ymouse - _y) * k; vx = vx + ax; vy = vy + ay; vy = vy + grav; vx = vx * damp; vy = vy * damp; _x = (_x + vx); _y = (_y + vy); _root.xbend = (2 * vx) + vy; _root.ybend = (2 * vy) + vx; xdif = _root._xmouse - this._x; ydif = _root._ymouse - this._y; this._rotation = (Math.atan2(ydif, xdif) * 57.2957795130823) + 90; }Frame 2stopAllSounds(); track = "t1"; snd1 = new Sound(); snd1.attachSound("bounc3"); if (track == "t1") { snd1.start(); } else { stopAllSounds(); } snd1.onSoundComplete = function () { snd1.start(); };Frame 3stop(); snd1.onSoundComplete = function () { snd1.start(); }; stop();Symbol 27 Buttonon (release) { gotoAndStop(_currentframe + 1); }Symbol 32 Buttonon (release) { gotoAndStop ("sample"); }Symbol 37 Buttonon (release) { stopAllSounds(); }Symbol 38 Buttonon (release) { stopAllSounds(); track = "t1"; snd1.start(); }Symbol 42 Buttonon (release) { gotoAndStop(_currentframe + 1); }Symbol 47 Buttonon (release) { gotoAndStop(_currentframe - 1); }Symbol 50 Buttonon (release) { gotoAndStop (3); }Symbol 74 MovieClip Frame 1stop();Symbol 76 Buttonon (press) { movie_mc.gotoAndPlay(2); }Symbol 160 MovieClip Frame 1stop();Symbol 161 Buttonon (press) { movie2_mc.gotoAndPlay(2); }Symbol 199 Buttonon (release) { gotoAndStop (1); }
Library Items
Symbol 1 Graphic | Used by:2 | |
Symbol 2 MovieClip | Uses:1 | Used by:Timeline |
Symbol 3 Graphic | Used by:Timeline | |
Symbol 4 Font | Used by:5 22 43 | |
Symbol 5 Text | Uses:4 | Used by:Timeline |
Symbol 6 Graphic | Used by:13 | |
Symbol 7 Font | Used by:8 | |
Symbol 8 Text | Uses:7 | Used by:13 |
Symbol 9 Graphic | Used by:13 | |
Symbol 10 Font | Used by:11 | |
Symbol 11 Text | Uses:10 | Used by:13 |
Symbol 12 Graphic | Used by:13 15 | |
Symbol 13 MovieClip | Uses:6 8 9 11 12 | Used by:Timeline |
Symbol 14 Graphic | Used by:15 | |
Symbol 15 MovieClip | Uses:14 12 | Used by:16 |
Symbol 16 MovieClip | Uses:15 | Used by:Timeline |
Symbol 17 Sound [bounc3] | Used by:Timeline | |
Symbol 18 Font | Used by:19 20 24 26 40 41 44 45 46 48 49 51 58 60 65 71 78 83 91 93 99 109 121 137 150 163 171 184 187 198 | |
Symbol 19 Text | Uses:18 | Used by:Timeline |
Symbol 20 Text | Uses:18 | Used by:21 |
Symbol 21 MovieClip | Uses:20 | Used by:Timeline |
Symbol 22 Text | Uses:4 | Used by:Timeline |
Symbol 23 Graphic | Used by:27 | |
Symbol 24 Text | Uses:18 | Used by:27 |
Symbol 25 Graphic | Used by:27 42 47 50 199 | |
Symbol 26 Text | Uses:18 | Used by:27 |
Symbol 27 Button | Uses:23 24 25 26 | Used by:Timeline |
Symbol 28 Font | Used by:29 30 | |
Symbol 29 Text | Uses:28 | Used by:Timeline |
Symbol 30 Text | Uses:28 | Used by:32 |
Symbol 31 Graphic | Used by:32 | |
Symbol 32 Button | Uses:30 31 | Used by:Timeline |
Symbol 33 Bitmap | Used by:34 | |
Symbol 34 Graphic | Uses:33 | Used by:35 37 38 |
Symbol 35 MovieClip | Uses:34 | Used by:37 38 |
Symbol 36 Graphic | Used by:37 | |
Symbol 37 Button | Uses:35 36 34 | Used by:Timeline |
Symbol 38 Button | Uses:35 34 | Used by:Timeline |
Symbol 39 Graphic | Used by:42 47 50 199 | |
Symbol 40 Text | Uses:18 | Used by:42 |
Symbol 41 Text | Uses:18 | Used by:42 |
Symbol 42 Button | Uses:39 40 25 41 | Used by:Timeline |
Symbol 43 Text | Uses:4 | Used by:Timeline |
Symbol 44 Text | Uses:18 | Used by:Timeline |
Symbol 45 Text | Uses:18 | Used by:47 |
Symbol 46 Text | Uses:18 | Used by:47 |
Symbol 47 Button | Uses:39 45 25 46 | Used by:Timeline |
Symbol 48 Text | Uses:18 | Used by:50 199 |
Symbol 49 Text | Uses:18 | Used by:50 199 |
Symbol 50 Button | Uses:39 48 25 49 | Used by:Timeline |
Symbol 51 Text | Uses:18 | Used by:Timeline |
Symbol 52 Bitmap | Used by:53 | |
Symbol 53 Graphic | Uses:52 | Used by:Timeline |
Symbol 54 Font | Used by:55 56 57 59 63 64 70 72 77 87 90 92 98 100 200 | |
Symbol 55 Text | Uses:54 | Used by:Timeline |
Symbol 56 Text | Uses:54 | Used by:Timeline |
Symbol 57 Text | Uses:54 | Used by:Timeline |
Symbol 58 Text | Uses:18 | Used by:Timeline |
Symbol 59 Text | Uses:54 | Used by:Timeline |
Symbol 60 Text | Uses:18 | Used by:Timeline |
Symbol 61 Bitmap | Used by:62 66 81 | |
Symbol 62 Graphic | Uses:61 | Used by:Timeline |
Symbol 63 Text | Uses:54 | Used by:Timeline |
Symbol 64 Text | Uses:54 | Used by:Timeline |
Symbol 65 Text | Uses:18 | Used by:Timeline |
Symbol 66 Graphic | Uses:61 | Used by:Timeline |
Symbol 67 Bitmap | Used by:68 | |
Symbol 68 Graphic | Uses:67 | Used by:69 |
Symbol 69 MovieClip | Uses:68 | Used by:Timeline |
Symbol 70 Text | Uses:54 | Used by:Timeline |
Symbol 71 Text | Uses:18 | Used by:Timeline |
Symbol 72 Text | Uses:54 | Used by:Timeline |
Symbol 73 Video | Used by:74 | |
Symbol 74 MovieClip | Uses:73 | Used by:Timeline |
Symbol 75 Graphic | Used by:76 161 | |
Symbol 76 Button | Uses:75 | Used by:Timeline |
Symbol 77 Text | Uses:54 | Used by:Timeline |
Symbol 78 Text | Uses:18 | Used by:Timeline |
Symbol 79 Font | Used by:80 84 94 104 108 110 117 122 129 130 134 138 145 149 151 155 156 157 158 162 164 168 169 170 172 176 186 188 | |
Symbol 80 EditableText | Uses:79 | Used by:Timeline |
Symbol 81 Graphic | Uses:61 | Used by:82 |
Symbol 82 MovieClip | Uses:81 | Used by:Timeline |
Symbol 83 Text | Uses:18 | Used by:Timeline |
Symbol 84 EditableText | Uses:79 | Used by:Timeline |
Symbol 85 Graphic | Used by:86 | |
Symbol 86 MovieClip | Uses:85 | Used by:Timeline |
Symbol 87 Text | Uses:54 | Used by:Timeline |
Symbol 88 Font | Used by:89 | |
Symbol 89 Text | Uses:88 | Used by:Timeline |
Symbol 90 Text | Uses:54 | Used by:Timeline |
Symbol 91 Text | Uses:18 | Used by:Timeline |
Symbol 92 Text | Uses:54 | Used by:Timeline |
Symbol 93 Text | Uses:18 | Used by:Timeline |
Symbol 94 EditableText | Uses:79 | Used by:Timeline |
Symbol 95 Bitmap | Used by:96 | |
Symbol 96 Graphic | Uses:95 | Used by:97 |
Symbol 97 MovieClip | Uses:96 | Used by:Timeline |
Symbol 98 Text | Uses:54 | Used by:Timeline |
Symbol 99 Text | Uses:18 | Used by:Timeline |
Symbol 100 Text | Uses:54 | Used by:Timeline |
Symbol 101 Bitmap | Used by:102 | |
Symbol 102 Graphic | Uses:101 | Used by:103 |
Symbol 103 MovieClip | Uses:102 | Used by:Timeline |
Symbol 104 EditableText | Uses:79 | Used by:Timeline |
Symbol 105 Bitmap | Used by:106 | |
Symbol 106 Graphic | Uses:105 | Used by:107 |
Symbol 107 MovieClip | Uses:106 | Used by:Timeline |
Symbol 108 EditableText | Uses:79 | Used by:Timeline |
Symbol 109 Text | Uses:18 | Used by:Timeline |
Symbol 110 EditableText | Uses:79 | Used by:Timeline |
Symbol 111 Bitmap | Used by:112 | |
Symbol 112 Graphic | Uses:111 | Used by:113 |
Symbol 113 MovieClip | Uses:112 | Used by:Timeline |
Symbol 114 Bitmap | Used by:115 | |
Symbol 115 Graphic | Uses:114 | Used by:116 |
Symbol 116 MovieClip | Uses:115 | Used by:Timeline |
Symbol 117 EditableText | Uses:79 | Used by:Timeline |
Symbol 118 Bitmap | Used by:119 | |
Symbol 119 Graphic | Uses:118 | Used by:120 |
Symbol 120 MovieClip | Uses:119 | Used by:Timeline |
Symbol 121 Text | Uses:18 | Used by:Timeline |
Symbol 122 EditableText | Uses:79 | Used by:Timeline |
Symbol 123 Bitmap | Used by:124 | |
Symbol 124 Graphic | Uses:123 | Used by:125 |
Symbol 125 MovieClip | Uses:124 | Used by:Timeline |
Symbol 126 Bitmap | Used by:127 | |
Symbol 127 Graphic | Uses:126 | Used by:128 |
Symbol 128 MovieClip | Uses:127 | Used by:Timeline |
Symbol 129 EditableText | Uses:79 | Used by:Timeline |
Symbol 130 EditableText | Uses:79 | Used by:Timeline |
Symbol 131 Bitmap | Used by:132 | |
Symbol 132 Graphic | Uses:131 | Used by:133 |
Symbol 133 MovieClip | Uses:132 | Used by:Timeline |
Symbol 134 EditableText | Uses:79 | Used by:Timeline |
Symbol 135 Font | Used by:136 201 | |
Symbol 136 EditableText | Uses:135 | Used by:Timeline |
Symbol 137 Text | Uses:18 | Used by:Timeline |
Symbol 138 EditableText | Uses:79 | Used by:Timeline |
Symbol 139 Bitmap | Used by:140 | |
Symbol 140 Graphic | Uses:139 | Used by:141 |
Symbol 141 MovieClip | Uses:140 | Used by:Timeline |
Symbol 142 Bitmap | Used by:143 | |
Symbol 143 Graphic | Uses:142 | Used by:144 |
Symbol 144 MovieClip | Uses:143 | Used by:Timeline |
Symbol 145 EditableText | Uses:79 | Used by:Timeline |
Symbol 146 Bitmap | Used by:147 | |
Symbol 147 Graphic | Uses:146 | Used by:148 |
Symbol 148 MovieClip | Uses:147 | Used by:Timeline |
Symbol 149 EditableText | Uses:79 | Used by:Timeline |
Symbol 150 Text | Uses:18 | Used by:Timeline |
Symbol 151 EditableText | Uses:79 | Used by:Timeline |
Symbol 152 Graphic | Used by:Timeline | |
Symbol 153 Graphic | Used by:154 | |
Symbol 154 MovieClip | Uses:153 | Used by:Timeline |
Symbol 155 EditableText | Uses:79 | Used by:Timeline |
Symbol 156 EditableText | Uses:79 | Used by:Timeline |
Symbol 157 EditableText | Uses:79 | Used by:Timeline |
Symbol 158 EditableText | Uses:79 | Used by:Timeline |
Symbol 159 Video | Used by:160 | |
Symbol 160 MovieClip | Uses:159 | Used by:Timeline |
Symbol 161 Button | Uses:75 | Used by:Timeline |
Symbol 162 EditableText | Uses:79 | Used by:Timeline |
Symbol 163 Text | Uses:18 | Used by:Timeline |
Symbol 164 EditableText | Uses:79 | Used by:Timeline |
Symbol 165 Bitmap | Used by:166 | |
Symbol 166 Graphic | Uses:165 | Used by:167 |
Symbol 167 MovieClip | Uses:166 | Used by:Timeline |
Symbol 168 EditableText | Uses:79 | Used by:Timeline |
Symbol 169 EditableText | Uses:79 | Used by:Timeline |
Symbol 170 EditableText | Uses:79 | Used by:Timeline |
Symbol 171 Text | Uses:18 | Used by:Timeline |
Symbol 172 EditableText | Uses:79 | Used by:Timeline |
Symbol 173 Bitmap | Used by:174 | |
Symbol 174 Graphic | Uses:173 | Used by:175 |
Symbol 175 MovieClip | Uses:174 | Used by:Timeline |
Symbol 176 EditableText | Uses:79 | Used by:Timeline |
Symbol 177 Bitmap | Used by:178 | |
Symbol 178 Graphic | Uses:177 | Used by:179 |
Symbol 179 MovieClip | Uses:178 | Used by:Timeline |
Symbol 180 Bitmap | Used by:183 | |
Symbol 181 Bitmap | Used by:183 | |
Symbol 182 Bitmap | Used by:183 | |
Symbol 183 Graphic | Uses:180 181 182 | Used by:185 |
Symbol 184 Text | Uses:18 | Used by:185 |
Symbol 185 MovieClip | Uses:183 184 | Used by:Timeline |
Symbol 186 EditableText | Uses:79 | Used by:Timeline |
Symbol 187 Text | Uses:18 | Used by:Timeline |
Symbol 188 EditableText | Uses:79 | Used by:Timeline |
Symbol 189 Graphic | Used by:196 | |
Symbol 190 Graphic | Used by:196 | |
Symbol 191 Graphic | Used by:196 | |
Symbol 192 Graphic | Used by:196 | |
Symbol 193 Graphic | Used by:196 | |
Symbol 194 Graphic | Used by:196 | |
Symbol 195 Graphic | Used by:196 | |
Symbol 196 MovieClip | Uses:189 190 191 192 193 194 195 | Used by:Timeline |
Symbol 197 Graphic | Used by:Timeline | |
Symbol 198 Text | Uses:18 | Used by:Timeline |
Symbol 199 Button | Uses:39 48 25 49 | Used by:Timeline |
Symbol 200 Text | Uses:54 | Used by:Timeline |
Symbol 201 EditableText | Uses:135 | Used by:Timeline |
Instance Names
"bar_mc" | Frame 1 | Symbol 2 MovieClip |
"b_mc" | Frame 1 | Symbol 16 MovieClip |
"movie_mc" | Frame 9 | Symbol 74 MovieClip |
"movie2_mc" | Frame 18 | Symbol 160 MovieClip |
Special Tags
FileAttributes (69) | Timeline Frame 1 | Access local files only, Metadata not present, AS1/AS2. |
ExportAssets (56) | Timeline Frame 2 | Symbol 17 as "bounc3" |
Labels
"sample" | Frame 23 |
|