Animating anchor points in Flash CS5 - Shape goes mad!
I'm having problems creating a very simple shape animation in Flash CS5.
I have 20 frames, 3 keyframes (at 1, 10 and 20).
The following screenshots are from Flash, with onion skin turned on for all 20 frames. (Had to pud link to the images since I can't embed them)
When I move a single anchor point, sometimes it's OK, like this:
But if I move the point a little futher, the whole shape morphs into something I never created, like this:
In both cases, I only moved the same single anchor point - the point of the upper spike.
Is there a way of telling Flash that I only want the movement I made and no random morphing ?
It really messes with your mind, doesn't it? Fortunately, it's not hard to understand and it's not hard to fix.
When you Shape Tween (Flash-speak for morphing), the Flash authoring environment does some very fancy mathematical calculations on the geometry of the shape to try to figure out the shortest "distance" from Point(s) A to Point(s) B. If the change is not too great, and/or the shape is simple, you get what you expect. If it's a big change, or a complex shape, things can look pretty weird.
The answer is to use Shape Hinting (Modify > Shape > Add Shape Hint). Rather than get into a detailed explanation, here's the Flash Help Page, and here's a good tutorial by Todd Perkins. He begins, appropriately enough, with the words: "Creating a Shape Tween can be a challenging process..."