SfC Home > Web Design > Adobe Flash >
Scanning in Drawings for Flash Animations
by Ron Kurtus (revised 3 February 2001)
A good graphics artist can use a special drawing tablet or even a mouse to create illustrations and graphics to use in Flash animations. For those of us that do not have such skills, a sheet of paper, a pen and a scanner can provide the pictures you need.
Questions you may have include:
- What are the basic steps to follow?
- What are detailed steps?
- What is a sample of the result of this method?
This lesson will answer those questions.
Basic steps
The procedure for using a pen and scanner in creating an animations in Flash consists of:
- Plan out your animation
- Draw a picture on a sheet of paper
- Scan, edit and save picture as a bitmap
- Import it into Flash, adjust size of stage, and trace the bitmap
- Build your animation around the image
Details of steps
The following explains the steps to use a scanner for some of your animations.
1. Plan out your animation
When you scan in a bitmap and use it in an animation, plan to have the bitmap as your background or in a separate layer. You will have to add other layers for your animation.
2. Draw a picture on a sheet of paper
Use a dark felt tip pen. Try to make the lines dark and connected.
3. Scan, edit and save picture
- Scan your drawing and save as a bitmap (BMP, GIF, or JPG).
- Use a drawing program such as PaintShop Pro to rotate, edit, and scale the picture to a size that will fit on your web page.
- Save picture. You might save it as another name in case your scaling was incorrect.
4. Import, adjust size of stage, and trace bitmap
- Choose File > Import.
- Choose Modify > Movie to adjust the size of the stage to fit the image.
- Choose Modify > Trace Bitmap to change the bitmap to a vector drawing.
- You may have to adjust settings and repeat to get the desired smoothing, resolution and look you want.
5. Build animation
- Touch up your picture. Add color.
- You may have to touch up and close lines if using Paint Bucket colors the rest of the stage.
- Name your layer and lock it.
- Add a new layer and build your animation.
- Save and publish the animation.
Example
The following animation shows a man and his echo.
I drew the man and the wall on apiece of 8 x 11 paper with a black felt tip pen. The picture was scanned in and saved it as a bitmap. Then it was rotated 90 degrees, so it was in the landscape view. I had to rotate it another 1 degree, because it did not scan in exactly straight. Also, the picture was scaled down about 50%.
The picture was imported into Flash and the stage was scaled to fit the image. The bitmap was then traced. This had to be done and undone several times for adjustments to be made. Then coloring was added to add some pizzazz to the picture. The layer was locked and two new layers were added, one for the "Hey!" animation and another for the waves animation.
Demonstration of an echo, from a pen and paper drawing
Summary
You can draw a picture on a sheet of paper, scan it into Adobe Flash and then touch it up, as an alternative to using your mouse or a drawing pad to input an illustration to a drawing program. The method is simple and produces reasonable results.
Clever techniques can make you seem smart
Resources and references
Websites
Books
(Notice: The School for Champions may earn commissions from book purchases)
Top-rated books on Adobe Flash
Students and researchers
The Web address of this page is:
www.school-for-champions.com/flash/
scanning_in_drawings_for_animations.htm
Please include it as a link on your website or as a reference in your report, document, or thesis.
Where are you now?
Scanning in Drawings for Flash