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>頂点ライトの作成と設定の基本を説明します。</p> 21 <h2>頂点ライト</h2> 22 <p>頂点ライトはポリゴンモデルの頂点に影響を与えるライトです。</p> 23 <p>CreativeStudio の頂点ライトは、以下の 3 種類のライト設定ができます。</p> 24 <table> 25 <thead> 26 <tr> 27 <th>ライトの種類</th> 28 <th>説明</th> 29 </tr> 30 </thead> 31 <tbody> 32 <tr> 33 <th><a href="#directional_light">ディレクショナルライト</a></th> 34 <td>太陽のように無限遠から一定の光を照射するライトです。<br /> 35 角度の設定ができます。</td> 36 </tr> 37 <tr> 38 <th><a href="#point_light">ポイントライト</a></th> 39 <td>1 点から放射状に光を照射するライトです。<br /> 40 距離による減衰の設定ができます。</td> 41 </tr> 42 <tr> 43 <th><a href="#spot_light">スポットライト</a></th> 44 <td>1 点から円錐状に光を照射するライトです。<br /> 45 距離と照射角度 ( 円錐形 ) による減衰の設定ができます。</td> 46 </tr> 47 </tbody> 48 </table> 49 <p>ここでは、サンプルモデルを読み込んで頂点ライトを作成した後に、ライトの種類別に基本的な設定方法を説明します。</p> 50 <h3>モデルの読み込み</h3> 51 <p>CreativeStudio のメニュー [ファイル]→[開く]→[中間ファイル] からモデルの中間ファイルを読み込みます。</p> 52 <p>例として、 lambert を使用した球体モデルで説明します。</p> 53 <a href="assets/vertex_light01.png" rel="ibox" title="画像をクリックして拡大"><img class="ui_thumb" src="assets/vertex_light01.png" alt="キューブモデルサンプル表示画像01"/></a> 54 <p>参考 : <br /> 55 使用しているサンプル球体の大きさと位置は以下になります。<br /> 56 3DCG ツールは、Maya を使用 (ツールの設定は初期状態 )</p> 57 <ul> 58 <li>半径 : 3.5</li> 59 <li>位置 X Y Z : 0 , 3.5 , 0</li> 60 </ul> 61 <h3>マテリアルパネルの設定</h3> 62 <p>CreativeStudio のマテリアルパネルを使用して、頂点ライトのみ影響を受けるマテリアルを設定します。</p> 63 <p>コンテンツパネルに表示されているマテリアルを選択して、マテリアルパネルを開きます。</p> 64 <h4>ライティングの設定変更</h4> 65 <p>マテリアルパネルのライティングで、頂点ライティングを有効にします。</p> 66 <img src="assets/vertex_light02.png" alt="描画設定画像"/> 67 <h4>テクスチャコンバイナの設定</h4> 68 <p>マテリアルパネルのコンバイナ 0 を以下の設定にします。</p> 69 <p>テクスチャコンバイナの詳細は、<a href="../../../ui_reference/panel/material/standard_panel/standard_panel_combiner/index.html#combiner">こちら</a>を参照してください。</p> 70 </p> 71 <img src="assets/vertex_light03.png" alt="キューブモデルサンプル表示画像01"/> 72 <p class="hint">マテリアルは頂点ライトからのみ影響を受ける設定です。<br /> 73 今回の設定では、B : ソース 1 と C : ソース 2 の設定は使用しません。</p> 74 <h3>頂点ライトの作成と設定</h3> 75 <p>CreativeStudio のメニュー [作成]→[ライト]→[頂点ライト] を選択して、頂点ライトを作成します。</p> 76 <a href="assets/vertex_light04.png" rel="ibox" title="画像をクリックして拡大"><img class="ui_thumb" src="assets/vertex_light04.png" alt="頂点ライト作成"/></a> 77 <h4>ライトパネルを開く</h4> 78 <p>コンテンツパネルに表示されているライトをクリックしてライトパネルを開きます。</p> 79 <h6>アンビエントカラーの調整</h6> 80 <p>ライトパネルのカテゴリで、アンビエントカラーにチェックを入れます。</p> 81 <img src="assets/vertex_light05.png" alt="ライトパネルプロパティ編集"/> 82 <p>アンビエントカラーにチェックを入れると、ライトパネルにアンビエントカラー設定項目が追加されます。</p> 83 <p>ライトパネルのアンビエントカラーを以下の数値に変更します。</p> 84 <img src="assets/vertex_light06.png" alt="ライトパネルアンビエントカラー設定項目"/> 85 <p class="new_hint">補足：<br /> 86 カラーサムネイルを左クリックすると、<a href="../../../ui_reference/panel/property/index.html#color_picker">カラーピッカー</a>がポップアップ表示され色の設定ができます。</p> 87 <p>上記設定を行うとプレビュー画面は以下のようになります。</p> 88 <a href="assets/vertex_light07.png" rel="ibox" title="画像をクリックして拡大"><img class="ui_thumb" src="assets/vertex_light07.png" alt="頂点ライト作成後画像"/></a> 89 <h3>ライトの種類と設定</h3> 90 <p>CreativeStudio で設定できる 3種類の頂点ライトの切り替え方法と基本設定を説明します。</p> 91 <p class="hint">ライトパネルの初期設定はディレクショナルライトになっています。</p> 92 <a name="directional_light" id="directional_light"></a> 93 <h4>ディレクショナルライト ( 平行光源 )</h4> 94 <p>ディレクショナルライトは、太陽のように無限遠から一定の光を照射するライトで、方向 ( 角度 ) の設定ができます。</p> 95 <p>図 1 ディレクショナルライト</p> 96 <img src="assets/vertex_light08.png" alt="ディレクショナルライト画像"/> 97 <h5>ライトの種類を選択</h5> 98 <p>ライトパネルの全般設定で、ディレクショナルライトを選択します。</p> 99 <img src="assets/vertex_light09.png" alt="ディレクショナルライト選択画像"/> 100 <h5>ライト方向の変更</h5> 101 <p>ライトパネルの方向を変更すると、モデルに対するライトの当たり方が変わるのが確認できます。</p> 102 <img src="assets/vertex_light10.png" alt="ライト方向の設定"/> <a name="point_light" id="point_light"></a> 103 <h4>ポイントライト ( 点光源 )</h4> 104 <p>ポイントライトは 1 点から放射状に光を照射するライトで、ライトの距離による減衰の設定ができます。</p> 105 <p>図 2 ポイントライト</p> 106 <img src="assets/vertex_light11.png" alt="ポイントライト画像"/> 107 <h5>ライトの種類を選択</h5> 108 <p>ライトパネルの全般設定で、ポイントライトを選択します。</p> 109 <img src="assets/vertex_light12.png" alt="ポイントライト選択画像"/> 110 <h5>距離減衰の設定</h5> 111 <p>ポイントライトの距離による減衰を、ライトパネルの距離減衰で設定します。</p> 112 <p class="warning">距離減衰の有効 ( チェックボックス ) の初期値は無効になっていますので、必ずチェックを入れて有効にしてください。</p> 113 <img src="assets/vertex_light13.png" alt="ポイントライト距離減衰"/> 114 <p><em>設定例</em></p> 115 <ul> 116 <li>減衰の初期値 : 0.5</li> 117 <li>減衰率 ( リニア ) : 0.001</li> 118 <li>減衰率 ( 二次 ) : 0</li> 119 </ul> 120 <h5>ライトの位置を変更</h5> 121 <p>ライトパネルの設定項目「位置」で、作成したライトの位置を変更します。</p> 122 <img src="assets/vertex_light14.png" alt="ライトの位置を変更"/> 123 <p>上記設定をすると、図 2 と同じポイントライトが作成できます。</p> 124 <p class="hint">距離減衰をスライダーなどで変更すると、ポイントライトの減衰変化がプレビューで確認できます。</p> 125 <a name="spot_light" id="spot_light"></a> 126 <h4>スポットライト</h4> 127 <p>スポットライトは 1 点から円錐状に光を照射するライトで、ライトの距離と角度による減衰の設定ができます。</p> 128 <p>図 3 スポットライト</p> 129 <img src="assets/vertex_light15.png" alt="スポットライト画像"/> 130 <h5>ライトの種類を選択</h5> 131 <p>ライトパネルの全般設定で、スポットライトを選択します。</p> 132 <img src="assets/vertex_light16.png" alt="スポットライト選択画像"/> 133 <h5>ライト方向の変更</h5> 134 <p>ライトパネルの方向で変更できます。</p> 135 <h5>距離減衰の設定</h5> 136 <p>スポットライトの距離と角度による減衰は、ライトパネルの距離減衰と角度減衰で設定します。</p> 137 <p class="warning">距離減衰の有効 ( チェックボックス ) の初期値は無効になっていますので、必ずチェックを入れて有効にしてください。</p> 138 <img src="assets/vertex_light17.png" alt="スポットライト距離減衰"/> 139 <p>角度減衰は、ライトの角度に対して光がどのように減衰するか設定します。</p> 140 <!-- InstanceEndEditable --> </div> 141 <div class="footer" /> 142</div> 143</body> 144<!-- InstanceEnd --> 145</html> 146
