PRODUCT
Follow

The Effects library can be used to quickly and easily animate layers thanks to a list of predefined animations. They save designers time by removing steps in the creation process.

Important

Effects have predefined properties that can’t be edited. For more design flexibility in animations, see Animation using keyframes.

Animation_using_effects_1.png

Types of effects

Effects come in three different types:

  • In Effects - Provide methods for introducing new content to the Creative Stage. The layers start the animation with properties that make them invisible.

  • Out Effects - Provide methods for hiding content from the Creative Stage. The layers end the animation with properties that make them invisible.

  • Intermission Effects - Provide methods for creating movement for layers on the Creative Stage. The layers are animated to draw attention to the content.

List of effects

Name

Description

In effects

Slide

This effect changes the position of the layer from off of the Creative Stage to on, giving it the appearance of sliding into the content to introduce it into the creative.

Bounce

This effect moves it onto the creative stage to introduce it into the creative.and then moves it up and down multiple times, making it look as though it is bouncing.

Fade

This effect will fade in the layer from 0% opacity to 100% opacity to introduce it into the creative.

Scale

This effect scales the layer from an unviewable size to a larger size to introduce it into the creative.

Out effects

Slide

This effect changes the position from on the creative to off, giving it the appearance that is is sliding out of the creative.

Roll

This effect both slides the layer from the Creative Stage, rotating it, making it look as though it is rolling off.

Fade

This effect will fade in the layer from 100% opacity to 0% opacity to remove it from the creative.

Scale

This effect scales a layer from a starting size to size that is no longer visible to remove it from the creative.

Intermission effects

Shake

This effect moves a layer back and forth a few time making it look like it's shaking.

Rotate

This effect rotates the later around its centerpoint while scaling it up and down.

Pulse

This effect scales the layer up and down a couple of times.

Using effects

Follow these steps to add an effect to your selected layer:

  1. In the Timeline Panel, select the layer that will be animated.

  2. Move the scrubber to the desired timing.

  3. Click the fx button. A window will pop up displaying all of the effects available in Creative Studio.

  4. Navigate through the multiple types of effects.

  5. Select the effect, it will automatically apply to the select layer, starting at the position of the timeline’s scrubber.

The new effect is displayed as a light blue bar on the Timeline.

Animation_using_effects_2.png

Changing the timing and duration of effects

By grabbing the Effect bar, the animation can be positioned to another point on the Timeline.

By grabbing the handle on the right side of the Effect bar, the timing of the animation can be changed. Shortening the time, makes the animation happen faster and lengthening the time makes the animation happen slower.

Note

Multiple effects cannot overlapped for an individual layer. Potential collisions between keyframes contributed by the different Effects can result in poor experiences.

Expanding the effect displays the keyframes that contribute to the animation. Keyframes of effects can’t be edited, but can serve as a guide for building custom effects. For more design flexibility in animations, see Animation using keyframes.

Animation_using_effects_3.png

Converting effects to keyframes

Effects are locked to prevent collisions of keyframes which can cause animations to jump unexpectedly. To build upon the effects or change some aspects of them, convert them to keyframes. By right-clicking or control-clicking on the effect, a contextual menu is invoked. Selecting Detach from the menu will remove the constituent keyframes from the effect, placing them on the timeline where they can be manipulated. The Detach command will also indicate the number of keyframes that will be created when they are detached.

Before

image__40_.png

After

image__41_.png
Was this article helpful?
0 out of 0 found this helpful
Have more questions? Submit a request

Comments