1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 2<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-US" lang="en-US"> 3<!-- InstanceBegin template="/Templates/default_template.dwt" codeOutsideHTMLIsLocked="false" --> 4<head> 5<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 6<meta http-equiv="Content-Style-Type" content="text/css" /> 7<!-- InstanceBeginEditable name="CSS の相対パス指定" --> 8<link href="../../../common/manual.css" rel="stylesheet" type="text/css" /> 9<script type="text/javascript" src="../../../common/ibox.js"></script> 10<!-- InstanceEndEditable --> <!-- InstanceBeginEditable name="ページのタイトル" --> 11<title>Light animation</title> 12<!-- InstanceEndEditable --> 13</head> 14<body> 15<div> 16 <div class="body"> <!-- InstanceBeginEditable name="本文のタイトル" --> 17 <h1>Light animation</h1> 18 <!-- InstanceEndEditable --> <!-- InstanceBeginEditable name="本文" --> 19 <p>This page uses ToyMobile sample data to describe settings made when applying an animation to a light under CreativeStudio.</p> 20 <h2>Loading sample data</h2> 21 <p>An animation is created for the light diffuse color and transform of the sample data being used.</p> 22 <p>The transform animation being configured is used by exporting an animation created using the 3D CG tool.</p> 23 <p class="new_hint"><B>Note:</B> For information on exporting animations, see the Plug-in Manual provided separately.</p> 24 <h3>Loading Models and Effects</h3> 25 <p>Load the sample data by selecting <B>File > Open > Intermediate file</B> on the CreativeStudio menu</p> 26 <table> 27 <thead> 28 <tr> 29 <th>Intermediate files</th> 30 <th>Location</th> 31 </tr> 32 </thead> 33 <tbody> 34 <tr> 35 <th>Rocket and stars model</th> 36 <td>" %NW4C_ROOT%/SampleData/Graphics/Intermediate/ManualResource/TutorialToyMobile/ToyMobile.cres "</td> 37 </tr> 38 <tr> 39 <th>Fire and smoke effects</th> 40 <td>" %NW4C_ROOT%/SampleData/Graphics/Intermediate/ManualResource/TutorialToyMobile/ToyMobileEffect.cres "</td> 41 </tr> 42 </tbody> 43 </table> 44 <h3>Loading particle links (action)</h3> 45 <p>Load a particle link by selecting <B>File > Open > Particle link</B> on the CreativeStudio menu</p> 46 <table> 47 <thead> 48 <tr> 49 <th>Intermediate files</th> 50 <th>Location</th> 51 </tr> 52 </thead> 53 <tbody> 54 <tr> 55 <th>Particle link data</th> 56 <td>" %NW4C_ROOT%/SampleData/Graphics/Intermediate/ManualResource/TutorialToyMobile/ToyMobileAction.cact "</td> 57 </tr> 58 </tbody> 59 </table> 60 <img src="assets/light_anim_01.png" alt="Light animation image"/> 61 <p class="hint_warn">Caution:<br /> The flame effect will not track the rocket just by loading the particle link (action) as described above. <BR> To make the flame track the rocket, see <a href="../../effect/action/index.html"> Linking Particles and 3D Models</a></p> 62 <p>When the sample model animation is played, a yellow light strikes the moon along with the engine exhaust.</p> 63 <h2>Editing the Animation</h2> 64 <p>This section describes the procedure for changing the light color using the <B>CurveEditor</B> panel.</p> 65 <p>On the main menu, select <B>Window</B> > <B>CurveEditor</B> to open the <B>CurveEditor</B> panel.</p> 66 <p>Selecting the light displayed in the <B>Contents</B> panel displays the associated curve in the <B>CurveEditor</B> panel.</p> 67 <p>Figure 1 RGB Curves Set for the Diffuse Color of the Light for ToyMobile</p> 68 <a href="assets/light_anim_02.png" rel="ibox" title="Click to enlarge image"><img class="ui_thumb" src="assets/light_anim_02.png" alt="Light Animation Curve"/></a> 69 <p>Diffuse color settings for the Toy_Mobile light are given below.</p> 70 <table> 71 <thead> 72 <tr> 73 <th>Frame</th> 74 <th>Axes to be animated</th> 75 <th>Description of Curve</th> 76 <th>Description of Setting</th> 77 </tr> 78 </thead> 79 <tbody> 80 <tr> 81 <th rowspan="3">0 ~ 6</th> 82 <th>R</th> 83 <td>The curve for the R color component is created so that it approaches 0.4 between Frame 0 and Frame 6.</td> 84 <td rowspan="3">Since the G and B color components vary, the diffuse color of the light is animated from black to dark yellow.</td> 85 </tr> 86 <tr> 87 <th>G</th> 88 <td>The curve for the G color component is created so that it approaches 0 between Frame 0 and Frame 6.</td> 89 </tr> 90 <tr> 91 <th>B</th> 92 <td>The B color component is 0 until Frame 200.</td> 93 </tr> 94 <tr> 95 <th rowspan="3">6 ~ 102</th> 96 <th>R</th> 97 <td>There is no change to the curve during this period.</td> 98 <td rowspan="3">The diffuse color of the light remains dark yellow.</td> 99 </tr> 100 <tr> 101 <th>G</th> 102 <td>There is no change to the curve during this period.</td> 103 </tr> 104 <tr> 105 <th>B</th> 106 <td>The B color component is 0 until Frame 200.</td> 107 </tr> 108 <tr> 109 <th rowspan="3">102 ~ 111</th> 110 <th>R</th> 111 <td>The curve for the R color component is created so that it approaches 0 from Frame 102 to Frame 111.</td> 112 <td rowspan="3">Since the G and B color components change to 0 from Frame 0 to Frame 6, the diffuse color of the light is animated in reverse from dark yellow to black.</td> 113 </tr> 114 <tr> 115 <th>G</th> 116 <td>The curve for the G color component is created so that it approaches 0 between Frame 102 and Frame 111.</td> 117 </tr> 118 <tr> 119 <th>B</th> 120 <td>The B color component is 0 until Frame 200.</td> 121 </tr> 122 <tr> 123 <th rowspan="3">111 ~ 200</th> 124 <th>R</th> 125 <td>There is no change to the curve during this period.</td> 126 <td rowspan="3">The diffuse color of the light remains black.</td> 127 </tr> 128 <tr> 129 <th>G</th> 130 <td>There is no change to the curve during this period.</td> 131 </tr> 132 <tr> 133 <th>B</th> 134 <td>The B color component is 0 until Frame 200.</td> 135 </tr> 136 </tbody> 137 </table> 138 <p>In this section, we take a look at editing the diffuse color of the light for ToyMobile.</p> 139 <p>The key values in Frame 6 and Frame 102 for the G color component of the diffuse color on the <B>CurveEditor</B> panel vary from 0.4 to 0.2.</p> 140 <a href="assets/light_anim_03.png" rel="ibox" title="Click to enlarge image"><img class="ui_thumb" src="assets/light_anim_03.png" alt="Light Animation Curve"/></a> 141 <p>When the diffuse color is edited and the animation played, you can confirm that the light striking the moon varies from dark yellow to orange.</p> 142 <img src="assets/light_anim_04.png" alt="After light animation color change"/> <!-- InstanceEndEditable --> </div> 143 <div class="footer" /> 144</div> 145<hr><p>CONFIDENTIAL</p></body> 146<!-- InstanceEnd --> 147</html>