Realistic Fire Animation

From Synfig Studio :: Documentation
Jump to: navigation, search
(start of writing.)
 
m (step 1)
Line 1: Line 1:
 
<!-- Page info -->
 
<!-- Page info -->
 
{{Title|Realistic Fire Animation}}
 
{{Title|Realistic Fire Animation}}
{{Navigation|Category:Tutorials|Category:Tutorials Advanced|Doc:Realistic Fire Animation}}
 
 
{{Category|Manual}}
 
{{Category|Manual}}
 
{{Category|Tutorials}}
 
{{Category|Tutorials}}
Line 8: Line 7:
  
 
==Introduction==
 
==Introduction==
This tutorial will guide you in making a realistic fire animation with [[Synfig]]. It is currently being written... so please come back soon! [[File:Realistic_fire_tutorial_completed.png|right|The result of this tutorial]]
+
{{l|File:Realistic_fire_tutorial_completed.png|right|The result of this tutorial}} This tutorial will guide you in making a realistic fire animation with {{l|Synfig}}. Check out the [http://www.vimeo.com/11569415 raging fire video] that uses this technique! ''It is currently being written... so please come back soon!''
  
This tutorial is not "advanced" as in "difficult", but it requires that you are familiar with the Synfig [[Doc:Interface|Interface]] and [[Doc:Quick_Overview|tools]], as these will not be covered here. Start with the more [[Category:Tutorials_Basic|basic tutorial]] and keep an eye on the [[Category:Manual|Manual]] if you are not familiar with terms such as "[[Blend_Method_Parameter|blend method]]" or "[[Encapsulate]]".
+
This tutorial is not "advanced" as in "difficult", but it requires that you are familiar with the Synfig {{l|Doc:Interface|interface}} and {{l|Doc:Quick_Overview|tools}}, as these will not be covered here. Start with the more {{l|Category:Tutorials_Basic|basic tutorials}} and keep an eye on the {{l|Category:Manual}} if you are not familiar with terms such as "{{l|Blend_Method_Parameter}}" or "{{l|Encapsulate}}".
  
For alternative set-ups, additional settings, variants and more, kindly refer to the [[Doc_talk:Realistic_Fire_Animation|talk page]].
+
For alternative set-ups, additional settings, variants and more, kindly refer to the {{l|Doc_talk:Realistic_Fire_Animation|talk page}}.
 +
 
 +
 
 +
 
 +
The '''basic idea of the technique''' we'll be using is inspired from the tutorial "[http://graffiti.hbfx.com/?p=219&lang=en-us Fire in Photoshop]", by Eros:
 +
* a vertically moving background, filled with black & white clouds (i.e.: noise). The light areas will become bright, yellow flames, and the dark ones will become red-ish flames.
 +
* a fixed mask to darken the top of the fire, hence extinguishing the flames (i.e: a black & white vertical gradient)
 +
* an orange color layer to turn on the heat
 +
 
 +
 
 +
==step 1: a moving noisy background==
 +
[[File:Realistic_fire_tutorial_flame_intensity.png|200px|thumb|right|The ''intensity mask'' layer]]
 +
 
 +
Start with a blank Synfig file, any size will do. To match a good-looking widescreen ratio this tutorial uses 360x203.
 +
 
 +
# Add a new black & white {{l|Noise Gradient Layer}}, name it '''base noise''' and change its ''size'' to 20x35pt... as flames are vertically oriented.
 +
# On top of ''base noise'', add a {{l|Linear Gradient Layer}}, name it '''intensity mask''', and move the gradient ''point 1'' & ''point 2'' to leave some white space on top and some black space bellow, as illustrated in the picture. Change its ''blend mode'' to {{l|Blend_Method_Parameter#Subtract|subtract}}.
 +
# On top of ''intensity mask'', add a {{l|Solid Color Layer}}, name it '''fire color'''. Change its ''color'' to some warm orange, we used #ff6700, and its blend mode to {{l|Blend_Method_Parameter#Color|color}}.
 +
# Change the ''amount'' of both '''fire color''' and '''intensity mask''' to achieve an effect you like. We used amounts of 0.7 color and 1.3 mask to achieve the result illustrated in the picture at the end of step 1.
 +
[[File:Raging fire tutorial step1.png|center|Result after step 1]]
 +
 
 +
==Fine tuning & fooling around==
 +
Various settings allow you to achieve very different fire types and effects. Contribute to this section or discuss them in the {{l|Doc_talk:Realistic_Fire_Animation|talk page}}!
 +
 
 +
 
 +
Some "easy" tailoring include:
 +
* play with the ''gradient'' of '''base noise''' to change the ratio between bright and dark flames.
 +
 
 +
 
 +
A few fun but less realistic tunings:
 +
* play with the ''color'' of '''fire color''' to get a blue or pink fire.
 +
* check ''turbulent'' of '''base noise''' to get a psychedelic effect.

Revision as of 03:08, 10 May 2010

Languages Language: 

English • español • français


Introduction

Realistic fire tutorial completed.png
This tutorial will guide you in making a realistic fire animation with Synfig. Check out the raging fire video that uses this technique! It is currently being written... so please come back soon!

This tutorial is not "advanced" as in "difficult", but it requires that you are familiar with the Synfig interface and tools, as these will not be covered here. Start with the more basic tutorials and keep an eye on the Manual if you are not familiar with terms such as "Blend Method" or "Encapsulate".

For alternative set-ups, additional settings, variants and more, kindly refer to the talk page.


The basic idea of the technique we'll be using is inspired from the tutorial "Fire in Photoshop", by Eros:

  • a vertically moving background, filled with black & white clouds (i.e.: noise). The light areas will become bright, yellow flames, and the dark ones will become red-ish flames.
  • a fixed mask to darken the top of the fire, hence extinguishing the flames (i.e: a black & white vertical gradient)
  • an orange color layer to turn on the heat


step 1: a moving noisy background

The intensity mask layer

Start with a blank Synfig file, any size will do. To match a good-looking widescreen ratio this tutorial uses 360x203.

  1. Add a new black & white Noise Gradient Layer, name it base noise and change its size to 20x35pt... as flames are vertically oriented.
  2. On top of base noise, add a Linear Gradient Layer, name it intensity mask, and move the gradient point 1 & point 2 to leave some white space on top and some black space bellow, as illustrated in the picture. Change its blend mode to subtract.
  3. On top of intensity mask, add a Solid Color Layer, name it fire color. Change its color to some warm orange, we used #ff6700, and its blend mode to color.
  4. Change the amount of both fire color and intensity mask to achieve an effect you like. We used amounts of 0.7 color and 1.3 mask to achieve the result illustrated in the picture at the end of step 1.
Result after step 1

Fine tuning & fooling around

Various settings allow you to achieve very different fire types and effects. Contribute to this section or discuss them in the talk page!


Some "easy" tailoring include:

  • play with the gradient of base noise to change the ratio between bright and dark flames.


A few fun but less realistic tunings:

  • play with the color of fire color to get a blue or pink fire.
  • check turbulent of base noise to get a psychedelic effect.


Languages Language: 

English • español • français