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="ja" lang="ja"> 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 --> 11<!-- InstanceBeginEditable name="ページのタイトル" --> 12<title>ライトアニメーション</title> 13<!-- InstanceEndEditable --> 14</head> 15<body> 16<div> 17 <div class="body"> <!-- InstanceBeginEditable name="本文のタイトル" --> 18 <h1>ライトアニメーション</h1> 19 <!-- InstanceEndEditable --> <!-- InstanceBeginEditable name="本文" --> 20 <p>CreativeStudio でライトにアニメーションをつける際の設定をサンプルデータ ToyMobile を使用して説明します。</p> 21 <h2>サンプルデータの読み込み</h2> 22 <p>使用するサンプルデータには、ライトのディフューズカラーと Transform にアニメーションが作成されています。</p> 23 <p>設定されている「Transform」アニメーションは、3DCG ツールで作成したアニメーションをエクスポートして使用しています。</p> 24 <p class="new_hint">補足：<br /> 25 ライトアニメーションのエクスポートについては、別途用意されている「プラグインマニュアル」を参照してください。</p> 26 <h3>モデルとエフェクトの読み込み</h3> 27 <p>CreativeStudio メニュー [ファイル]→[開く]→[中間ファイル] で読み込みます。</p> 28 <table> 29 <thead> 30 <tr> 31 <th>中間ファイル</th> 32 <th>場所</th> 33 </tr> 34 </thead> 35 <tbody> 36 <tr> 37 <th>ロケットと星のモデル</th> 38 <td>" %NW4C_ROOT%/SampleData/Graphics/Intermediate/ManualResource/TutorialToyMobile/ToyMobile.cres "</td> 39 </tr> 40 <tr> 41 <th>炎と煙のエフェクト</th> 42 <td>" %NW4C_ROOT%/SampleData/Graphics/Intermediate/ManualResource/TutorialToyMobile/ToyMobileEffect.cres "</td> 43 </tr> 44 </tbody> 45 </table> 46 <h3>パーティクル連携（アクション）の読み込み</h3> 47 <p>CreativeStudio メニュー [ファイル]→[開く]→[パーティクル連携] で読み込みます。</p> 48 <table> 49 <thead> 50 <tr> 51 <th>中間ファイル</th> 52 <th>場所</th> 53 </tr> 54 </thead> 55 <tbody> 56 <tr> 57 <th>パーティクル連携データ</th> 58 <td>" %NW4C_ROOT%/SampleData/Graphics/Intermediate/ManualResource/TutorialToyMobile/ToyMobileAction.cact "</td> 59 </tr> 60 </tbody> 61 </table> 62 <img src="assets/light_anim_01.png" alt="ライトアニメーション画像"/> 63 <p class="hint_warn">注意：<br /> 64 上記のパーティクル連携（アクション）を読み込むだけでは、「炎のエフェクト」はロケットに追従しません。<br /> 65 ロケットに炎を追従させたい場合は、<a href="../../effect/action/index.html"> パーティクルと 3D モデルの連携 </a>を参照してください。</p> 66 <p>サンプルモデルのアニメーションを再生するとエンジンの噴射と共に「月に黄色いライト」が当たるようになっています。</p> 67 <h2>ライトアニメーションの編集</h2> 68 <p>ここでは、カーブエディタパネルを使用して、ライトカラーを変更する手順を説明します。</p> 69 <p>メインメニュー[ウィンドウ]→[カーブエディタ]を選択して、カーブエディタパネルを開きます。</p> 70 <p>コンテンツパネルに表示されている、ライトを選択すると、カーブエディタパネルにカーブが表示されます。</p> 71 <p>図 1 . ToyMobile のライトのディフューズカラーで設定されている R G B のカーブ</p> 72 <a href="assets/light_anim_02.png" rel="ibox" title="画像をクリックして拡大"><img class="ui_thumb" src="assets/light_anim_02.png" alt="ライトアニメーションのカーブ"/></a> 73 <p>Toy_Mobile の ライトのディフューズカラー の設定は以下になります。</p> 74 <table> 75 <thead> 76 <tr> 77 <th>フレーム</th> 78 <th>アニメーション対応軸</th> 79 <th>カーブの説明</th> 80 <th>設定内容</th> 81 </tr> 82 </thead> 83 <tbody> 84 <tr> 85 <th rowspan="3">0 ～ 6</th> 86 <th>R</th> 87 <td>R のカラー成分は、0 フレームから 6 フレームまでの間に 0.4 に向けてカーブが作成されています。</td> 88 <td rowspan="3">G と B のカラー成分が変化しますので、ライトのディフューズカラーは黒から暗い黄色にアニメーションします。</td> 89 </tr> 90 <tr> 91 <th>G</th> 92 <td>G のカラー成分は、0 フレームから 6 フレームまでに 0.4 に向けてカーブが作成されています。</td> 93 </tr> 94 <tr> 95 <th>B</th> 96 <td>B のカラー成分は、200 フレームまで固定で 0 です。</td> 97 </tr> 98 <tr> 99 <th rowspan="3">6 ～ 102</th> 100 <th>R</th> 101 <td>この間、カーブに変化はありません。</td> 102 <td rowspan="3">ライトのディフューズカラーは暗い黄色のままです。</td> 103 </tr> 104 <tr> 105 <th>G</th> 106 <td>この間、カーブに変化はありません。</td> 107 </tr> 108 <tr> 109 <th>B</th> 110 <td>B のカラー成分は、200 フレームまで固定で 0 です。</td> 111 </tr> 112 <tr> 113 <th rowspan="3">102 ～ 111</th> 114 <th>R</th> 115 <td>R のカラー成分は、102 フレームから 111 フレームまでに 0 に向けてカーブが作成されています。</td> 116 <td rowspan="3">0 フレームから 6 フレームとは逆に G と B のカラー成分が0に変化しますので、ライトのディフューズカラーは暗い黄色から黒にアニメーションします。</td> 117 </tr> 118 <tr> 119 <th>G</th> 120 <td>G のカラー成分は、102 フレームから 111 フレームまでに 0 に向けてカーブが作成されています。</td> 121 </tr> 122 <tr> 123 <th>B</th> 124 <td>B のカラー成分は、200 フレームまで固定で 0 です。</td> 125 </tr> 126 <tr> 127 <th rowspan="3">111 ～ 200</th> 128 <th>R</th> 129 <td>この間、カーブに変化はありません。</td> 130 <td rowspan="3">ライトのディフューズカラーは黒のままです。</td> 131 </tr> 132 <tr> 133 <th>G</th> 134 <td>この間、カーブに変化はありません。</td> 135 </tr> 136 <tr> 137 <th>B</th> 138 <td>B のカラー成分は、200 フレームまで固定で 0 です。</td> 139 </tr> 140 </tbody> 141 </table> 142 <p>ここでは、ToyMobile のライトのディフューズカラーを編集してみます。</p> 143 <p>カーブエディタパネルでディフューズカラー の G の 6 フレームと 102 フレームにあるキーの値を [0.4] → [0.2] へ変更します。</p> 144 <a href="assets/light_anim_03.png" rel="ibox" title="画像をクリックして拡大"><img class="ui_thumb" src="assets/light_anim_03.png" alt="ライトアニメーションのカーブ"/></a> 145 <p>ディフューズカラーを編集してアニメーションを再生すると、「月にあたるライト」が編集前の「暗い黄色」から「オレンジ色」に変わったことが確認できます。</p> 146 <img src="assets/light_anim_04.png" alt="ライトアニメーションカラー変更後"/> <!-- InstanceEndEditable --> </div> 147 <div class="footer" /> 148</div> 149</body> 150<!-- InstanceEnd --> 151</html> 152
