Home / Articles / Adobe After Effects / Animating Layers in After Effects CS3

Animating Layers in After Effects CS3

  • Article is provided courtesy of Adobe Press.
  • Date: Nov 13, 2008.

Article Description

Animation is all about making changes over time to an object or image's position, opacity, scale, and other properties. In this step-by-step exercise, the Adobe Creative Team explores some of the fun possibilities for animating a Photoshop file in After Effects CS3.

Retiming the Composition

So far, you've created a straightforward time-lapse simulation. That's fine, but After Effects offers more ways to play with time by using the time-remapping feature. Time remapping lets you dynamically speed up, slow down, stop, or reverse footage. You can also use it to do things like create a freeze-frame result. The Graph Editor and the Layer panel are a big help when remapping time, as you'll see in the following exercise when you retime the project so that the time-lapse speed changes dynamically.

For this exercise, you'll use the movie that you just rendered as the basis of a new composition, which will be easier to remap.

  1. Drag the Lesson06_retime movie onto the Create a New Composition button at the bottom of the Project panel. After Effects creates a new composition named Lesson06_retime and displays it in the Timeline and Composition panels. Now you can remap all of the elements of the project at once.
  2. With the Lesson06_retime layer selected in the Timeline panel, choose Layer > Time > Enable Time Remapping. After Effects adds two keyframes, at the first and last frames of the layer, visible in the time ruler. A Time Remap property also appears under the layer name in the Timeline panel; this property lets you control which frame is displayed at a given point in time (see Figure 37).
  3. Double-click the Lesson06_retime layer name in the Timeline panel to open it in the Layer panel. The Layer panel provides a visual reference of the frames you change when you remap time. It displays two time rulers. The time ruler at the bottom of the panel displays the current time; the Source Time ruler above that has a remap-time marker that indicates which frame is playing at the current time (see Figure 38).
  4. Drag the current-time indicator across the time ruler in the Timeline panel, and notice that the source-time and current-time markers in the two Layer panel rulers are synchronized. That situation will change as you remap time.
  5. Go to 4:00 and change the Time Remap value to 2:00. This setting remaps time so that frame 2:00 plays at 4:00 (see Figure 39). In other words, the composition now plays back at half-speed for the first four seconds of the composition.
  6. Press the spacebar to preview the animation. The composition runs at half-speed until 4:00, and at a regular speed thereafter. Press the spacebar again when you're finished previewing the animation.

Viewing Time Remapping in the Graph Editor

Using the Graph Editor, you can view and manipulate all aspects of effects and animations, including effect property values, keyframes, and interpolation. It represents changes in effects and animations as a two-dimensional graph, with playback time represented horizontally from left to right. By contrast, in layer bar mode the time ruler represents only the horizontal time element, without showing a visual representation of changing values.

  1. Make sure that the Time Remap property is selected for the Lesson06_retime layer in the Timeline panel.
  2. Click the Graph Editor button to display the Graph Editor.

    The Graph Editor displays a time-remap graph that shows a white line connecting the keyframes at 0:00, 4:00, and 10:00. The angle of the line is shallow up to 4:00, and then it becomes steeper (see Figure 40). The steeper the line, the faster the playback time.

Using the Graph Editor to Remap Time

When remapping time, you can use the values in the time-remap graph to determine and control which frame of the movie plays at which point in time. Each Time Remap keyframe has a time value associated with it that corresponds to a specific frame in the layer; this value is represented vertically on the time-remap graph. When you enable time remapping for a layer, After Effects adds a Time Remap keyframe at the start and end points of the layer. These initial Time Remap keyframes have vertical time values equal to their horizontal position.

By setting additional Time Remap keyframes, you can create complex motion effects. Every time you add a Time Remap keyframe, you create another point at which you can change the playback speed or direction. As you move the keyframe up or down in the time-remap graph, you adjust which frame of the video is set to play at the current time. Have some fun with the timing of this project.

  1. In the time-remap graph, drag the middle keyframe vertically from 4:00 up to 10 seconds.
  2. Drag the last keyframe down to 0 seconds.
  3. Press the Home key to go to 0:00 and then press the spacebar to preview the results. Watch the time ruler and Source Time ruler in the Layer panel to see which frames are playing at any given point in time. Now the animation progresses rapidly over the first four seconds of the composition and then plays in reverse for the rest of the composition.
  4. Press the spacebar to stop the preview.

    Having fun yet? Keep going.

  5. Ctrl-click (Mac OS: Command-click) the last keyframe to delete it. The composition is still in fast-forward mode for the first four seconds, but now it holds on a single frame (the last frame) for the rest of the composition.
  6. Press the Home key and then the spacebar to preview the animation. Press the spacebar again when you're done.
  7. Ctrl-click (Mac OS: Command-click) the dotted line at 6:00 to add a keyframe at 6:00 with the same value as the keyframe at 4:00.
  8. Ctrl-click (Mac OS: Command-click) at 10:00 to add another keyframe, and then drag it down to 0 seconds. Now the animation progresses rapidly, holds for two seconds on the last frame, and then runs in reverse.
  9. Press the Home key and then the spacebar to preview the changes. Press the spacebar again when you're done.

Adding an Easy Ease Out

Next, you'll soften the shift in time that occurs at six seconds, using an Easy Ease Out.

  1. Click to select the keyframe at 6:00.
  2. Click the Easy Ease Out button at the bottom of the Graph Editor. This action slows the shift into reverse—the footage runs slowly in reverse at first, and then gradually speeds up (see Figure 41).

Scaling the Animation in Time

Finally, use the Graph Editor to scale the entire animation in time.

  1. Click the Time Remap property name in the Timeline panel to select all of the Time Remap keyframes.
  2. Make sure that the Show Transform Box button at the bottom of the Graph Editor is on; a free transform selection box should be visible around all of the keyframes.
  3. Drag one of the upper transform handles from 10 seconds to 5 seconds to reduce the top keyframe values and slow the playback (see Figure 42).
  4. Press the Home key and then the spacebar to preview the change. Press the spacebar again when you're done.
  5. Choose File > Save.

Congratulations. You've completed a complex animation, complete with shifts in time. You can render the time-remap project if you like; just follow the instructions in the earlier section "Rendering the Animation."

Adobe Press Promotional Mailings & Special Offers

I would like to receive exclusive offers and hear about products from Adobe Press and its family of brands. I can unsubscribe at any time.


Pearson Education, Inc., 221 River Street, Hoboken, New Jersey 07030, (Pearson) presents this site to provide information about Adobe Press products and services that can be purchased through this site.

This privacy notice provides an overview of our commitment to privacy and describes how we collect, protect, use and share personal information collected through this site. Please note that other Pearson websites and online products and services have their own separate privacy policies.

Collection and Use of Information

To conduct business and deliver products and services, Pearson collects and uses personal information in several ways in connection with this site, including:

Questions and Inquiries

For inquiries and questions, we collect the inquiry or question, together with name, contact details (email address, phone number and mailing address) and any other additional information voluntarily submitted to us through a Contact Us form or an email. We use this information to address the inquiry and respond to the question.

Online Store

For orders and purchases placed through our online store on this site, we collect order details, name, institution name and address (if applicable), email address, phone number, shipping and billing addresses, credit/debit card information, shipping options and any instructions. We use this information to complete transactions, fulfill orders, communicate with individuals placing orders or visiting the online store, and for related purposes.


Pearson may offer opportunities to provide feedback or participate in surveys, including surveys evaluating Pearson products, services or sites. Participation is voluntary. Pearson collects information requested in the survey questions and uses the information to evaluate, support, maintain and improve products, services or sites; develop new products and services; conduct educational research; and for other purposes specified in the survey.

Contests and Drawings

Occasionally, we may sponsor a contest or drawing. Participation is optional. Pearson collects name, contact information and other information specified on the entry form for the contest or drawing to conduct the contest or drawing. Pearson may collect additional personal information from the winners of a contest or drawing in order to award the prize and for tax reporting purposes, as required by law.


If you have elected to receive email newsletters or promotional mailings and special offers but want to unsubscribe, simply email ask@peachpit.com.

Service Announcements

On rare occasions it is necessary to send out a strictly service related announcement. For instance, if our service is temporarily suspended for maintenance we might send users an email. Generally, users may not opt-out of these communications, though they can deactivate their account information. However, these communications are not promotional in nature.

Customer Service

We communicate with users on a regular basis to provide requested services and in regard to issues relating to their account we reply via email or phone in accordance with the users' wishes when a user submits their information through our Contact Us form.

Other Collection and Use of Information

Application and System Logs

Pearson automatically collects log data to help ensure the delivery, availability and security of this site. Log data may include technical information about how a user or visitor connected to this site, such as browser type, type of computer/device, operating system, internet service provider and IP address. We use this information for support purposes and to monitor the health of the site, identify problems, improve service, detect unauthorized access and fraudulent activity, prevent and respond to security incidents and appropriately scale computing resources.

Web Analytics

Pearson may use third party web trend analytical services, including Google Analytics, to collect visitor information, such as IP addresses, browser types, referring pages, pages visited and time spent on a particular site. While these analytical services collect and report information on an anonymous basis, they may use cookies to gather web trend information. The information gathered may enable Pearson (but not the third party web trend services) to link information with application and system log data. Pearson uses this information for system administration and to identify problems, improve service, detect unauthorized access and fraudulent activity, prevent and respond to security incidents, appropriately scale computing resources and otherwise support and deliver this site and its services.

Cookies and Related Technologies

This site uses cookies and similar technologies to personalize content, measure traffic patterns, control security, track use and access of information on this site, and provide interest-based messages and advertising. Users can manage and block the use of cookies through their browser. Disabling or blocking certain cookies may limit the functionality of this site.

Do Not Track

This site currently does not respond to Do Not Track signals.


Pearson uses appropriate physical, administrative and technical security measures to protect personal information from unauthorized access, use and disclosure.


This site is not directed to children under the age of 13.


Pearson may send or direct marketing communications to users, provided that

  • Pearson will not use personal information collected or processed as a K-12 school service provider for the purpose of directed or targeted advertising.
  • Such marketing is consistent with applicable law and Pearson's legal obligations.
  • Pearson will not knowingly direct or send marketing communications to an individual who has expressed a preference not to receive marketing.
  • Where required by applicable law, express or implied consent to marketing exists and has not been withdrawn.

Pearson may provide personal information to a third party service provider on a restricted basis to provide marketing solely on behalf of Pearson or an affiliate or customer for whom Pearson is a service provider. Marketing preferences may be changed at any time.

Correcting/Updating Personal Information

If a user's personally identifiable information changes (such as your postal address or email address), we provide a way to correct or update that user's personal data provided to us. This can be done on the Account page. If a user no longer desires our service and desires to delete his or her account, please contact us at customer-service@informit.com and we will process the deletion of a user's account.


Users can always make an informed choice as to whether they should proceed with certain services offered by Adobe Press. If you choose to remove yourself from our mailing list(s) simply visit the following page and uncheck any communication you no longer want to receive: www.adobepress.com/u.aspx.

Sale of Personal Information

Pearson does not rent or sell personal information in exchange for any payment of money.

While Pearson does not sell personal information, as defined in Nevada law, Nevada residents may email a request for no sale of their personal information to NevadaDesignatedRequest@pearson.com.

Supplemental Privacy Statement for California Residents

California residents should read our Supplemental privacy statement for California residents in conjunction with this Privacy Notice. The Supplemental privacy statement for California residents explains Pearson's commitment to comply with California law and applies to personal information of California residents collected in connection with this site and the Services.

Sharing and Disclosure

Pearson may disclose personal information, as follows:

  • As required by law.
  • With the consent of the individual (or their parent, if the individual is a minor)
  • In response to a subpoena, court order or legal process, to the extent permitted or required by law
  • To protect the security and safety of individuals, data, assets and systems, consistent with applicable law
  • In connection the sale, joint venture or other transfer of some or all of its company or assets, subject to the provisions of this Privacy Notice
  • To investigate or address actual or suspected fraud or other illegal activities
  • To exercise its legal rights, including enforcement of the Terms of Use for this site or another contract
  • To affiliated Pearson companies and other companies and organizations who perform work for Pearson and are obligated to protect the privacy of personal information consistent with this Privacy Notice
  • To a school, organization, company or government agency, where Pearson collects or processes the personal information in a school setting or on behalf of such organization, company or government agency.


This web site contains links to other sites. Please be aware that we are not responsible for the privacy practices of such other sites. We encourage our users to be aware when they leave our site and to read the privacy statements of each and every web site that collects Personal Information. This privacy statement applies solely to information collected by this web site.

Requests and Contact

Please contact us about this Privacy Notice or if you have any requests or questions relating to the privacy of your personal information.

Changes to this Privacy Notice

We may revise this Privacy Notice through an updated posting. We will identify the effective date of the revision in the posting. Often, updates are made to provide greater clarity or to comply with changes in regulatory requirements. If the updates involve material changes to the collection, protection, use or disclosure of Personal Information, Pearson will provide notice of the change through a conspicuous notice on this site or other appropriate way. Continued use of the site after the effective date of a posted revision evidences acceptance. Please contact us if you have questions or concerns about the Privacy Notice or any objection to any revisions.

Last Update: November 17, 2020