Tutorial:Shape tweening

From Anipedia

(Redirected from Shape tweening)
Jump to: navigation, search

Contents

[edit] About shape tweening

A shape tween is a feature in Flash used to transform certain vectors points in one frame to another in a transitional animation. Shape tweening is an often used feature in Flash, though due to it shaping actual vectors and fill rather than objects successful tweening is difficult to do.


Examples of shape tweens

Image:Shape_Tween_Example_1.gif

Variating shape tweens can allow for more flexible and detail shape tweens and can be incredibly useful for flash animation to depict realism. Shape tweening can be used to shift colours in fill, particularly gradient fills. This feauture can be used for smooth colour tranistion involving lighting and shadow.

Image:Shape_Tween_Example_2.gif

[edit] How to shape tween

First draw a simple image you wish to tween. Make sure you do not group the object or make it into a symbol because shape tweening only tweens the lines or fill of an object on its respected timeline. The on a seperate keyframe (F6) elsewhere on the timeline create a simlar object altering a few aspects to acheive the desired effect. To ensure success in the shape tween make sure that both keyframes have either the same amount of vector points or the shapes can easily transfer from one form to another. In this example a circle and square is used. Once the two keyframes are establish click between the two frames on the timeline then on your properties panel

Image:Shape_Tween_instruction_1.jpg‎

After completing the shapetween the timeline between the two keyframes will become green with an arrow on it. the shape of the frames between the two keyframes will also consist of transitional images. In this instance the is a shape that shows similarities between a square and circle.

Image:Shape_Tween_instruction_2.jpg‎

[edit] Shape Hinting

As Shape tweening relies on vectors and fill of an object, if the two keyframes differ greatly in these aspects the animation may become an undesired shape tween.

Image:Failed_Tween_example.gif‎

A method in flash used to help complete difficult shape tweens is shape hinting. Shape hinting is the method in which two vector points from the seperate keyframes that are being tweened are made to accompany each other throughout the transitional animation. In ored to utilize the shape hint first select the first frame of the shape tween animation. Then click "Modify", "Shape" and the select "Shape hint" (Ctrl+Shift+H).

Image:Shap_Hint_1.jpg‎

On the first frame of the shape tween a shape hint will appear, indicated by a red dot with an alphabetic representation on it. Dragging the shape hint onto a vector point, for example a corner of a square, will make it green in appearance signifying the shape hint has been attached to a vector point. On the second keyframe of the shape tween animation another shape hint will appear, yellow in appearance. This signifies the shape hint is currently incomplete. By dragging this second hint onto a corresponding vector point to the first shape hint the shape hint in the second keyframe will turn green signifying the completion of the shape hint.

Image:Shape_Hint_2.jpg‎

The shape tween animation will now change with the two corresponding vector points tweening in a more realistic fashion. Adding shape hints and completing them will allow for several vector points to tween desirably. If performed correctly then the final product will achieve the desired result.

Image:SuccessfulTween_example.gif‎

However in many cases with shape tweens using shape hints still does not convey the intended result, so exercise caution in using shape tweens. Many newer flash artists use shape tweens as opposed to motion tweens because they don't have complicated requirements when being set up. The result is usually a jumble of vectors and lines.

[edit] See Also

Motion Tweening Tutorial

Personal tools