This animation will be created using cylinder shapes and simple tween animation all in Swift3D.
Our tutorial will be divided into three part:
- Modeling the battery using cylinder shapes.
- Animating the battery run-out effect using the Animate Button.
Modeling the Battery
Start off by creating a new Swift 3D file, access the Properties Toolbar and change the Layout width to 240 and the height to 320 - these are the dimensions of our output SWF.
Our battery is divided into two four parts: the body, the lower cap, the upper cap, and the terminal. We are going to do each of these on its own in the numbered order shown in the diagram below.
As we said previously, our entire battery will be made up of cylinder shapes, so to create the body of our battery, simply click on the Create Cylinder icon 
Our body is done, now to create the lower cap click once again on the Create Cylinder icon to add another cylinder on stage. It should cover up our existing cylinder. Access the Properties Toolbar on the left of the screen, and under the Cylinder section change the length of the cylinder to 0.100 units. That will make our cylinder shorter. We need to position this cap right below our battery body, we can use the mouse to move it around, but to get a more precise position we can simply click on the Position section of the Properties Toolbar and set the Y coordinate of our Object Position to -0.55 to get at the right spot.
The position is now right, we just need to apply the right material for this part and that is a reflective black material. Again, simply access the Gallery Toolbar and drag and drop one onto your object.
Our lower cap is now done as well, we will create the upper cap next which is identical to the one we just finished. So to save time, we can just select the lower cap by clicking on it on the front viewport and then going through Edit>Copy (Ctrl+C) and then Edit>Paste (Ctrl+P). You will not see the second copy because it is right above the old one. We are going to move this one by accessing the Properties Toolbar, then going through the Position options and setting the Y coordinate of the Object Position to 0.55.
This completes both caps, the final remaining part is the terminal. Once again, because it identical to the cylinder we just completed but smaller, we can select the upper cap and then copy and paste it to create a duplicate. Now access the Properties Toolbar and reduce the size of the terminal by going through the Cylinder section and setting the radius to 0.200 units. We can then reposition it by going through the Position section and setting the Y coordinate of the Object Position to 0.65. That should do it, the cap might not be clearly visible from the default front view port, but you can see it on the left viewport.
We are now finished modeling our battery and will move on to the animation part in the next section.
Animating the Battery
We are going to animate our battery using the Animate Button in Swift 3D. Using this button we can create animation tweens similar to those in Flash in that the user simply provides the first and last frames and the animator generates all the frames in between. We are going to provide the first frame when the battery is fully and the last frame when the battery is almost empty. The starting state has already been made. We just need to provide the last stage.
Creating tween animation in Swift 3D are made using the following procedure:
- Activate the Animate Button
- Move the Current Frame Indicator to the required frame
- Apply the change(s) you wish to animate
- Deactivate the Animate Button
The procedure is pretty simple as you can see. We are going to start off by activating the Animate Button, simply do that by clicking on it once.
Our animation is going to be 20 frames long, so simply click on the number 20 on the timeline to move the Current Frame Indicator to that point.
We are now going to apply the changes we need to our battery. Start off by changing the colour of the body to red. You can do that by dragging a Reflective Red material from the Gallery Toolbar.
The second change we need to apply to our battery is change of size in the length of the body cylinder. We can do that by clicking once on the body cylinder and then accessing the Scale section of the Properties Inspector and changing the Y Factor to 0.1. That should shrink our body cylinder.
We do not want our empty red body to float in the center, we want it to settle at the bottom of the battery, so we need to reposition it. Access the Position section of the Properties Toolbar and set the Y coordinate to -0.45.
We are done. Simply click once on the Animate Button to deactivate it. You can test the animation now by clicking on the tiny Play button 
We are now going to rotate our grouped object by simply accessing the Rotation Trackball on the lower left corner of the screen and rotating it to get the desired orientation.
You can notice that the battery goes beyond the yellow borders of our viewport, meaning that it will not be fully visible in our output SWF. To fix this we can zoom out a little bit by clicking on an empty spot on the viewport and then accessing the Camera section of the Properties Toolbar and decreasing the Lens Length to 40. This should work as a zoom out.
We are done! You can play the animation again to see it from this new perspective.
Rendering the Animation
We are using the RaviX renderer of Swift 3D to create vector animations. To get the same result I got will need to first access the Gallery Toolbar and drag a Black environment colour to the viewport. This will affect the overall colour of the render.
Second, you need to access the Preview and Export Editor tab in the Main Toolbar and then apply the following settings to the RaviX Renderer. Most of these are self explanatory.
- Under General, if you are planning on using this in Flash, set the Target File Type to SWFT, if you are planning on using this on the web then set it to SWF.
- Under Fill Options, set the Type to Area Gradient Shading, and activate the options to include Specular Lights and Reflections but not Shadows.
- Under Edge Options, set the Edge Type to Outlines and activate the options for Outlines at Intersections and to Include Detail Edges.
When you are done you can click on Generate All Frames and then Export All Frames to get your animation!
This concludes our tutorial. You can download the end source file from here. I hope that you've learnt something helpful from it.