A Flash Developer Resource Site

Results 1 to 4 of 4

Thread: How'd they do this drawing effect?

  1. #1
    Junior Member
    Join Date
    Feb 2002
    Posts
    13
    Can anyone tell me how you would create a drawing effect like this one from a FreeHand tutorial? Go to http://209.41.112.127/clients/macromedia/default.html, then to slide 19 in tutorial number 1.

  2. #2
    Senior Member
    Join Date
    Feb 2002
    Posts
    117

    animated line

    What I usually do is draw out the line, extend the frame over like 40 frames or so, select the frames and go to Modify/Frames/Converttokeyframes. Then I edit each keyframe, starting by erasing all but a small portion of the line, then going to the next frame and erasing all but a small portion of the line, but longer then the first frame. It's a bit pain staking, and slow, but it does the trick.

  3. #3
    Junior Member
    Join Date
    Feb 2002
    Posts
    13
    Thanks. I've experimented a bit and have come up with a close approximation.
    1. Create a new Mask layer, and use the pen tool to draw an elongated spiral pattern (or whatever pattern you want).
    2. Select the line, and then use the convert lines to fills command.
    3. Create several masked layers underneath the first layer.
    4. On the masked layers, create shape tweens using rectangles or whatever to follow the contours of the line at the desired speed. For example, when you get to a curve, have the tween stop, and then use another layer for the curve, and so on.

    This seemed to make a convincing drawing effect. Remember, the only visiible portion of the tween is that which the mask line reveals.

    huah!

  4. #4
    Aquaverse gdstudios's Avatar
    Join Date
    Mar 2002
    Location
    Washington, DC
    Posts
    1,789
    there has to be an easier way to do that effect, don't you think?

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  




Click Here to Expand Forum to Full Width

HTML5 Development Center