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>material_sss</title> 13<!-- InstanceEndEditable --> 14</head> 15<body> 16<div> 17 <div class="body"> <!-- InstanceBeginEditable name="本文のタイトル" --> 18 <h1>MaterialSSS</h1> 19 <!-- InstanceEndEditable --> <!-- InstanceBeginEditable name="本文" --> 20 <p>MaterialSSS は 肌の表現です。</p> 21 <p>肌の透明感の演出に NV を効果的に使用しています。</p> 22 <p>ここでは、マテリアルサンプル MaterialSSS の設定について説明します。</p> 23 <img src="assets/chess05.png" alt="material_sss画像"/> 24 <p class="hint_warn">注意：<br /> 25 このサンプルを見るときはシーン内にフラグメントライトがあることを確認してください。<br /> 26 なければフラグメントライトを作成してください。</p> 27 <h2>マテリアルの設定</h2> 28 <p>CreativeStudio のコンテンツパネルに表示されている sss_mat をクリックしてマテリアルパネルを開きます。</p> 29 <h3>全般</h3> 30 <p>マテリアルパネルの「全般タブ」を確認します。</p> 31 <p>ライティングの設定が「フラグメントライティング」になっています。</p> 32 <p>これは MaterialSSS の参照テーブルがフラグメントライトで行われていることを意味します。</p> 33 <img src="assets/sss_chess02.png" alt="thinfilm_chess画像02"/> 34 <p class="new_hint">補足：<br /> 35 ライティングの設定は使用するライトに合わせて変更する必要があります。</p> 36 <h3>カラー設定</h3> 37 <p>マテリアルパネルの「カラータブ」を確認します。</p> 38 <p> MaterialSSS ではスペキュラー 0 にグレーを設定しています。</p> 39 <p>この設定は、参照テーブルの「分布 0」で設定している「スペキュラーの調整」のために設定しています。</p> 40 <img src="assets/sss_chess03.png" alt="thinfilm_chess画像03"/> 41 <h3>フラグメントの設定</h3> 42 <p>マテリアルパネルの「フラグメントタブ」を確認します。</p> 43 <p>MaterialSSS のフラグメントシェーダーのレイヤーコンフィグは「コンフィグレーションタイプ 4」です。</p> 44 <p>この設定は、参照テーブルの 要素「反射 R」「反射 G」「反射 B」「分布 0」「分布 1」を有効にする設定です。</p> 45 <img src="assets/sss_chess04.png" alt="thinfilm_chess画像04"/> 46 <p>レイヤーコンフィグの詳細は、<a href="../../../../user_guide/material/layer_configuration/index.html">こちら</a>を参照してください。</p> 47 <h4>参照テーブルの確認</h4> 48 <p>参照テーブルでは、「参照テーブルセット」と「参照テーブルで使用されている要素」を確認します。</p> 49 <h5>参照テーブルセット</h5> 50 <p>参照テーブルセットに LookupTableSetContentCtr0 が選択されています。</p> 51 <img src="assets/sss_chess05.png" alt="thinfilm_chess画像05"/> 52 <p class="new_hint">補足：<br /> 53 参照テーブルセットは、作成した参照テーブルをまとめて管理しています。<br /> 54 CreativeStudio のコンテンツパネルに表示されている LookupTableSetContentCtr0 をクリックすると参照テーブルセットパネルが表示され、管理されている参照テーブルが確認できます。</p> 55 <h5>要素</h5> 56 <p>次に参照テーブルの要素を確認します。</p> 57 <p>MaterialSSS では「反射 R」「反射 G」「反射 B」と「分布 0」「分布 1」が設定されています。</p> 58 <img src="assets/sss_chess06.png" alt="thinfilm_chess画像06"/> 59 <p>参照テーブル <em>「sss_reflectance_r」「sss_reflectance_g」「sss_reflectance_b」</em> は光の陰影に対する肌色の変化を表しています。</p> 60 <p>参照テーブル <em>「sss_distribution0」「sss_distribution1」</em>は強い光の分布を調整しています。</p> 61 <h5>入力角</h5> 62 <p>次に入力角を確認します。</p> 63 <p>MaterialSSS では要素毎に以下の入力角を使用しています。</p> 64 <img src="assets/sss_chess07.png" alt="sss_chess画像07"/> 65 <h6><span class="text_color">●</span>「反射 R」「反射 G」「反射 B」は 入力角 LN</h6> 66 <p>入力角 LN はディフューズ表現です。</p> 67 <p>モデルがライトに照らされる効果を表現します。</p> 68 <p>MaterialSSS では光の強く当たる所から、当たらない所に向け肌色を変化させます。</p> 69 <h6><span class="text_color">●</span>「分布 0」は入力角 NH</h6> 70 <p>分布 0 はスペキュラー0 の色を NH の入力角で分布させます。</p> 71 <p>サンプルの平らなカーブを調整すると、肌の弱いスペキュラーが表現できます。</p> 72 <h6><span class="text_color">●</span>「分布 1」は入力角 NV</h6> 73 <p>分布 1 はリフレクションファクターがチェックされている場合は、スペキュラー1 ではなく 反射 R 反射 G 反射 B の色分布を調整します。</p> 74 <p>NV はカメラ正面からモデルのふちに向かって光の流れを作ります。</p> 75 <h4>テクスチャコンバイナ</h4> 76 <p>テクスチャコンバイナを確認します。</p> 77 <p>MaterialSSS では「コンバイナ 0 カラー」を設定しています。</p> 78 <img src="assets/sss_chess09.png" alt="thinfilm_chess画像09"/> 79 <table> 80 <thead> 81 <tr> 82 <th>設定項目</th> 83 <th>設定</th> 84 </tr> 85 </thead> 86 <tbody> 87 <tr> 88 <th>計算式</th> 89 <td>A</td> 90 </tr> 91 <tr> 92 <th>A : ソース 0</th> 93 <td>セカンダリカラー</td> 94 </tr> 95 </tbody> 96 </table> 97 <p>この設定は、セカンダリカラーをそのまま使うことを意味します。</p> 98 <p class="new_hint">補足：<br /> 99 ソース 1 と ソース 2 に頂点シェーダーの出力結果が入っていますが「計算式で使用されていません」ので、モデルに対して何も影響を与えません。</p> 100 <h2>参照テーブルの確認</h2> 101 <p>MaterialSSS で実際に使用されている参照テーブルをカーブエディタパネルで確認します。</p> 102 <p>CreativeStudio のコンテンツパネルにある LookupTableSetContentCtr0 を選択します。</p> 103 <p>上記状態で、メニュー [ウィンドウ]→[カーブエディタ] を選択してカーブエディタパネルを開きます。</p> 104 <a href="assets/sss_chess10.png" rel="ibox" title="画像をクリックして拡大"><img class="ui_thumb" src="assets/sss_chess10.png" alt="sss_chess画像10"/></a> 105 <ul> 106 <li>横軸 : 入力角の要素同士が作る角度で 0 → 1 ( 90 度 → 0 度 ) の変化になります。</li> 107 <li>縦軸 : 色 ( 光 ) の強さです。</li> 108 </ul> 109 <h3>sss_reflectance_r / g / b の設定</h3> 110 <p>カーブエディタパネルに表示されている「sss_reflectance_r / g / b」を選択してカーブを確認します。</p> 111 <a href="assets/sss_chess11.png" rel="ibox" title="画像をクリックして拡大"><img class="ui_thumb" src="assets/sss_chess11.png" alt="sss_chess画像11"/></a> 112 <p>陰影の変化に合わせた肌色の変化を表現しています。</p> 113 <h3>sss_distribution0</h3> 114 <p>カーブエディタパネルに表示されている「sss_distribution0」を選択してカーブを確認します。</p> 115 <a href="assets/sss_chess12.png" rel="ibox" title="画像をクリックして拡大"><img class="ui_thumb" src="assets/sss_chess12.png" alt="sss_chess画像12"/></a> 116 <p>肌の弱いスペキュラー表現をするためのカーブです。</p> 117 <h3>sss_distribution1</h3> 118 <p>カーブエディタパネルに表示されている「sss_distribution1」を選択してカーブを確認します。</p> 119 <a href="assets/sss_chess13.png" rel="ibox" title="画像をクリックして拡大"><img class="ui_thumb" src="assets/sss_chess13.png" alt="sss_chess画像13"/></a> 120 <p>視点から見た肌の透明感を「反射 R」「反射 G」「反射 B」を調整して表現しています。</p> 121 <p class="hint"><em>ヒント：</em><br /> 122 このカーブは、ふちが暗くなるような表現を設定しています。半透明モデルは正面が透けて、ふちが透けないため結果中央が明るく見えます。<br /> 123 カーブをさらに調整してモデルのふちを明るくすると、半透明の肌のふちから光が漏れだすような表現ができます。</p> 124 <!-- InstanceEndEditable --> </div> 125 <div class="footer" /> 126</div> 127</body> 128<!-- InstanceEnd --> 129</html> 130
