feedburner
Enter your email address:

Delivered by FeedBurner

feedburner count

How To: Create Realistic Candle Effect (Part II)

Labels: , , ,

Following up the previous tutorial: How To Create Realistic Candle Effect (Part I) , today we will learn how to animate the flame of the candle using simple shape tweening.

I would recommend you to follow the last tutorial before going into this one as this will a continuation from the last.

The Final Effect:




Step 1) Starting from the last tutorial, you should have the following image: the candle body and the flame in separate layers.


Step 2) Insert -- New Symbol (Ctrl+F8) and create a new movie clip symbol called circle.

Step 3) Use the Oval Tool (R) and draw an oval which will indicate as the light around the flame. Select the circle and open up the Color Panel (Shift+F9) or Window -- Color.

Step 4) Settings for Color - Stroke: None, Fill: Radial.


The one on the left: #FFFF00 , Alpha: 100%.
The one in the middle: #FFFF6E , Alpha: 75%.
The one on the right: #FFFFCC , Alpha: 0%.

Step 5) Insert Keyframes at frame 15 and 30. Click on frame 15, select the circle and go to Modify -- Transform -- Scale and Rotate (Ctrl+Alt+S). Set Scale to 130%.



Step 6) Right-click anywhere from Frame 1-15 and select shape tween and do the same also to frame 15-30.


Step 7) Now exit that Movie Clip and onto your main scene with the Candle.


Step 8) Create a new layer on top of you flame and candle layers. Drag the circle you've just created from the Library (Window -- Library or Ctrl+L) and onto the stage. Place it over the flame and open up the Properties Panel via Ctrl+F3 (you should always keep the properties panel open as you will need to use it often). For color select Alpha and adjust it to 50%.




Step 9) Lock the Circle Layer and turn the Visibility to Off. At frame 50, Insert Keyframes (F6) for all three layers. On the flame layer, Insert a Keyframe at Frames: 7, 13, 19, 26, 33 ,39, 45.




Step 10) Use the Selection Tool (V) and alter the shapes of the flames in Frames: 7, 13, 19, 26, 33 ,39, 45 (It might take a while but be patient and adjust all the flames carefully). Frame 1 and 50 must maintain the same flame for a smooth transition when repeating the animation. See the image below.


  
Step 11) Shape Tween everything between frame 1 and 50.




Ctrl+Enter to test you movie and finished! That is all for animating a realistic candle.


Last Part: How to: Create Realistic Candle Effect (Part I)  


Please feel free to comment or ask any questions and finally, don't forget to Subscribe!



17 comments:
gravatar
shashi Al Mudhish said...
March 20, 2009 at 12:16 PM  

very good!good learning experience these cool tutes are actually the essence of knowledge

gravatar
Anonymous said...
March 26, 2009 at 11:14 AM  

thanx alot. in a simple effect u made us learn quite alot abt flash. n especially dis was da perfect tutorial for newbies

gravatar
Anonymous said...
March 30, 2009 at 2:01 PM  

Thanks a lot this is so helpful.

gravatar
Anonymous said...
March 30, 2009 at 11:49 PM  

very good

gravatar
Anonymous said...
March 30, 2009 at 11:50 PM  

very good tutorial

gravatar
Maggie Zhang said...
April 3, 2009 at 12:23 AM  

To Everyone:
It is my pleasure to share my knowledge with everyone, hope they were helpful and thanks for supporting my blog.
-Learn2Flash-

gravatar
Unknown said...
April 8, 2009 at 12:02 AM  

superb animation for beginners,
helped me a lot,
thanks.

gravatar
Unknown said...
April 8, 2009 at 12:03 AM  

Too good for beginners,
helped me a lot,
thanks.

gravatar
Anonymous said...
April 9, 2009 at 7:04 AM  
This comment has been removed by a blog administrator.
gravatar
Anonymous said...
April 27, 2009 at 11:00 PM  

Excellent. Excellent. Excellent. Best tutorials around. Good work.

gravatar
Anonymous said...
May 14, 2009 at 7:39 AM  

Really Good Animation! Thanks!

gravatar
Gunasekar said...
June 18, 2009 at 10:04 PM  

excellent animation, simple but superb... thanks

gravatar
Anonymous said...
June 23, 2009 at 1:43 AM  

thnks a lot

gravatar
Anonymous said...
June 23, 2009 at 1:45 AM  

thnks a lot..its very nice

gravatar
modified cars said...
August 19, 2010 at 5:45 AM  

Always need this kind good quality information on the web which helps us even to learn new things. Rocked with photoshop and i wish you to post more interesting topics.

gravatar
Anonymous said...
December 12, 2010 at 1:30 PM  

Awsum tutorial Thank you so much for this! (^^) 5*

gravatar
PSK said...
February 22, 2011 at 7:32 AM  

Simply Gr8!

Post a Comment

Post a Comment