WarLord’s Workshop Newbies Information: The Timeline Simplified

A timeline is maybe a very powerful primary idea that an animator should grasp. The timeline permits animations to occur. Permits motion to happen. Usually a timeline is demonstrated with the easy act of transferring a primitive like a field throughout the display screen. Whereas that adequately reveals what a timeline does in its most simple kind… it’s not a lot enjoyable. 

With that in thoughts, we’re going to substitute the primitive with an plane. One thing that can make this train a bit extra fascinating to animate. 


I bear in mind the primary time I needed to take care of a timeline. The idea eluded me at first as a result of till then all the things I did was static, digital artwork. Primarily for illustration and net graphics.  I had gone from Corel Paint to Photoshop, Home windows was a beast that required backups for those who labored with it and the rising demand from the online meant transferring onto audio and video with apps like The Actual Participant and this new child on the block, Flash. 

In the event you had been concerned with net graphics or website improvement within the early days of the web, Flash was an actual boon to your workflow. This was significantly so within the mid-Nineteen Nineties when 33.6kb was a standard pace earlier than any sort of client broadband was even on the horizon. Safety points weren’t on the minds of many net builders both. We had been simply making an attempt to get significant, interactive web sites deployed which took lots of time and expense.  

I knew Flash was vector graphics and was able to animation and that was the extent of all of it. The one “timelines” I used to be aware of again then had been in video enhancing however for some cause, the connection wasn’t made to what a timeline actually meant. 

If you’re studying this and you don’t have any thought what the timeline is then you aren’t alone, as lots of us have been there, however it’s a idea you need to finally grasp.  

The timeline is kind of chance essentially the most single vital idea/device that have to be understood to be an animator. You don’t have to make use of curves despite the fact that they vastly enhance animation. You don’t need to mix motions or use attain targets, however you do have to know the timeline. 


What’s a keyframe? From StudioBinder

A keyframe, additionally written as “key body,” is one thing that defines the beginning and/or ending level of any easy transition. That one thing is usually a drawing in animation or a selected body of a shot when coping with movie or video. Any shot, animated or dwell motion, is damaged down into particular person frames. You’ll be able to consider keyframes as a very powerful frames of a shot that set the parameters for the opposite frames and point out the adjustments that can happen all through as transitions.  

You received’t actually need to be involved with a keyframe or what they’re throughout this train, however it’s a time period you want to concentrate on and grow to be aware of throughout your animation journey. 

The timeline is kind of presumably the only most vital idea/device that have to be understood to be an animator.


For this state of affairs, I used the free S-14 Jet over at Sketchfab  (“S-14 Fighter Jet (Excessive Poly)” (https://skfb.ly/owLXP) by Kamran Mughal is licensed below Inventive Commons Attribution (http://creativecommons.org/licenses/by/4.0/) because it comes configured for flight with the touchdown gear retracted and had a pleasant cockpit too.   

I loaded a Pilot character into the cockpit in a sitting place and positioned the arms close to the joystick and throttle on either side.  Any iClone humanoid character will work, simply bear in mind to hyperlink the character to the plane.  

The primary technique. Transfer the jet.


Step 1: Load the plane. Set the plane shadow to “Obtain Solely” within the Scene Supervisor. 

Step 2: Load, hyperlink, and place the pilot throughout the plane. Set the Pilot Shadow to “Obtain Solely”. 

Step 3: Load a sky from CONTENT->SET->SKY within the Content material Supervisor. I used “Cloudy” sky. 

Step 4: Set the Z axis on the sky to one thing like –10000 to decrease the sky and fill the viewport with clouds. This may increasingly fluctuate relying on the sky you selected. 


Step 5: Choose the PREVIEW digital camera and pull again till you see the plane and lots of sky.  

Step 6: Use the Zoom device to zoom out and the Pan device to maneuver the Plane to the left of the viewport.  

Step 7: Transfer the Play head slider to the final body or click on on the top button.  

Step 8: Use the transfer device to maneuver the plane in the direction of the alternative facet of the display screen till the nostril of the plane is nearly off-screen. 

Return the play head to the beginning and play the animation. You’ll discover two issues instantly. It takes some time for the plane to get going and strikes very slowly throughout the display screen. 

And… Congratulations as you could have simply created your first keyframes with the start and the ending frames of the plane motion. IClone takes care of all the things in-between therefore the time period tween or tweener, which isn’t generally utilized in iClone terminology however is a normal animation time period it’s possible you’ll run throughout. 

The primary drawback on this train is the default curve that begins and stops every movement. In the event you don’t know what a curve is then simply observe alongside as it is advisable to be a bit extra aware of animation earlier than we go into curves. Curves will not be a newbie’s matter for many new customers however the sooner you perceive and correctly use curves the extra polished your animations will probably be.  


Step 1: With the airplane chosen, open the timeline by urgent the Present Timeline button within the play space. Maintain down the Alt button and scroll the center mouse button till the whole timeline is seen.   
Step 2: Proper-click on the final keyframe (small inexperienced image on the correct facet of the timeline) and choose Transition Curve.  

Step 3: Change the transition curve from Default to Linear. The plane ought to now be transferring at a relentless pace between keyframes. 


To hurry up the plane because it goes throughout the display screen it is advisable to choose the final keyframe on the correct (within the timeline with the plane chosen) and transfer it in the direction of the left to about midway. You’ve now doubled the pace of the plane.  Preserve transferring this keyframe to the left to extend pace.  

You need to now see the connection between the plane and the timeline because it provides the animator a possibility to mark the start and finish of this animation (the fly throughout), its length, and pace. 


If you need the plane to maneuver from offscreen left to offscreen proper, then all you want do is transfer the play head to the primary keyframe (body 0 within the case), and with the plane chosen transfer it to the left till it’s offscreen sufficient to not be seen. 

Do the identical factor on the final keyframe of the animation and transfer the plane offscreen to the correct. You have to be on the primary body and final body as instructed above for this to work. It makes use of these frames as a beginning and ending level after which creates the frames in between.  

NOTE: To extend the space the plane flies you will want to zoom out far sufficient to have the house wanted for the longer distance. 

How did this Contain the Timeline? I used it to time the motion from body 0 to the final body which captures the motion of the plane.  

A video tutorial protecting each strategies described on this article.


For one airplane it does probably not matter for those who transfer the plane or the sky. If, nonetheless, you could have a number of plane then it turns into a lot simpler to maneuver the sky (one object) versus a number of plane objects.  

That is my most well-liked technique of constructing this kind of shot with a number of objects. This additionally permits for simple animation of the assorted plane coming up and down or transferring about. It can’t be performed with an ordinary sky however as a substitute, it must be a prop so it may be moved and keyframed. 

Methodology two… transfer the sky.


I used Props->Props->3D House->Dome because the sky.  

  • Improve the Dome scale to 2000 
  • Add a cloudy sky to the Dome diffuse channel or Drag and Drop it straight on the Dome. 
  • Add Water, I used Water 8 within the Nonetheless Regular folder. 
  • Set the Water to –100 Top, 270 Path (so it’s going to stream reverse the route of the plane) Water measurement to 1000. 
  • Set Wave Measurement to round 335 to extend measurement. Set Wave Pace to round 100. 
  • Whereas at Body 1 transfer the Sky right down to the water or its edge just a bit beneath the floor.  
  • At Body 1 choose the sky and transfer all of it the way in which to the left whereas nonetheless having the ability to seize the gizmo to maneuver it. 
  • Go to the final body and transfer and transfer the sky to the correct facet of the display screen ensuring to not go too far or the curve of the dome could present. 
  • We now want to pick the final keyframe (final body) and right-click then choose Transition Curve and choose Linear. You will note a brief preview. Now the sky ought to transfer easily from the primary to the final body. 
  • In the event you duplicate the Plane, be certain that to pick the Plane and the Pilot. Relink every pilot to its applicable plane for those who get a popup message relating to unusual habits from hyperlinks. 

As you’ll be able to see it doesn’t take that a lot for a easy animation of transferring an object or objects throughout the display screen, up and down or in any route for that matter. You’d mainly do the identical steps for launching a rocket altering the item to angle throughout or go straight up for a launch. 

That is for props, strolling characters are one other difficulty as they rely upon distance and pace to not have foot sliding points. If, nonetheless, you wish to fly a superhero throughout the display screen then the identical ideas would apply.  


The timeline will maintain the keys to the animation kingdom and the extra you perceive what it could do, the extra advanced your animations could be. What you could have seen right here is simply a place to begin. And, on this case, significantly, using the guide and Reallusion assets will restrict frustration whilst you develop as an animator. 

MD McCallum - WarLord

MD McCallum – WarLord

Digital Artist MD “Mike” McCallum, aka WarLord, is a longtime iClone consumer. Having authored free tutorials for iClone in its early years and chosen to jot down the iClone Newbies Information from Packt Publishing in 2011, he was lucky sufficient to fulfill and change methods and ideas with customers from all around the world and likes to share this info with different customers. He has authored lots of of articles on iClone and digital artwork on the whole whereas reviewing a number of the hottest software program and {hardware} on the earth. He has been printed in most of the main 3D on-line and print magazines whereas staying true to his greatest ardour, 3D animation. For extra info click on right here.