【TA】浮彫りマッピング(Relief Mapping)

1. 原理

  • 精度の高いUVオフセットの計算(視差が大きすぎると破綻することもある)により、より深い奥行きを提供でき、自己シャドウや遮蔽効果も実現可能です。

  • 例えば下図のように、浮彫の凸凹の深さがよりはっきりと表れ、自己シャドウ効果も見られます。

  • (a)(b)視差マッピング
    (c)(d)浮彫マッピング

2. 実装(実装)

  • Relief Mappingは一般的にレイマーチング2分探索を用いてUVオフセット量を決定します。

    ○ 第一步:レイマーチングステップ。視差マッピングと同様に進める
    ○ 後半:2分探索パート。レイマーチングで適切なステップに到達した後、その範囲内で2分探索を用いて精確なオフセット値を求めます。

  • なぜ最初から二分探索を使わないのか?
    ○ 大きな誤差が発生する可能性がある

//浮雕贴图
            float2 ReliefMapping(float2 uv, real3 viewDirTS)
            {
                float2 offlayerUV = viewDirTS.xy / viewDirTS.z * _HeightScale;
                float RayNumber = 20;
                float layerHeight = 1.0 / RayNumber;
                float2 SteppingUV = offlayerUV / RayNumber;
                float offlayerUVL = length(offlayerUV);
                float currentLayerHeight = 0;
                
                float2 offuv= float2(0,0);
                for (int i = 0; i < RayNumber; i++)
                {
                    offuv += SteppingUV;

                    float currentHeight = tex2D(_HeightMap, uv + offuv).r;
                    currentLayerHeight += layerHeight;
                    if (currentHeight < currentLayerHeight)
                    {
                        break;
                    }
                }

                float2 T0 = uv-SteppingUV, T1 = uv + offuv;

                for (int j = 0;j<20;j++)
                {
                    float2 P0 = (T0 + T1) / 2;

                    float P0Height = tex2D(_HeightMap, P0).r;

                    float P0LayerHeight = length(P0) / offlayerUVL;

                    if (P0Height < P0LayerHeight)
                    {
                        T0 = P0;

                    }
                    else
                    {
                        T1= P0;
                    }

                }

                return (T0 + T1) / 2 - uv;
            }

 

3. パララックスオクルージョンマッピング(POM = Parallax Occlusion Mapping)

  • 浮彫りマッピングとの違いは、最後のステップにあります
    ○ 浮彫りマッピングは、最終ステップが決定した後に二分探索を行います(反復回数が多い場合はコストが高くなります)
    ○ パララックスオクルージョンマッピングは、最後のステップの両端のUV値でサンプリングを行い(下図の赤い矢印)、この2つのサンプル結果を線形補間し、その補間値をP点の最終的なオフセットとして使用します

  • メリット:
    ○ 浮彫りマッピングと比べて、最終的に補間のみを行うためパフォーマンスが良い
    ○ 視差マッピングと比べて、精度が高い

  • 要件:
    ○ 最後に補間が必要なため、テクスチャ表面は比較的滑らかで連続している必要があります。急な凸凹や不連続部分があると、結果が誤る可能性があります

【TA】視差マッピング Parallax Mapping

1. 原理

  • 視差マッピング(Parallax Mapping)は、Offset MappingやVirtual Displacement Mappingとも呼ばれ、2001年にKanekoが導入し、Welshが改良および普及させた。

  • 主にモデル表面の遮蔽関係のディテールをシミュレートするために用いられ、「高さマップ(ハイトマップ)」を導入する。

  • 法線マップと併用することで、よりリアルな効果を得ることができる。

  • 高さマップは通常、視点位置を移動させることで効果を確認するため、十分な三角形数を持ち、モデルが精細でなければブロック状に見える可能性がある。

  • 三角形の数が限られている場合はどうするか?その際に視差マッピング技術を利用する。

  • 視差マッピング技術:

    • 核心:テクスチャ座標の変更

    • モデル情報を格納した高さマップが必要であり、表面の高さ情報を用いてテクスチャをずらす(例えば、低い位置の情報が高い位置の情報によって遮られるため、最も高い位置の情報を優先的に採用する)

 

2. 視差マッピングの実装

  • 法線マップと同様に、視覚を欺く手法(テクスチャ座標のみを変更し、ポリゴン数は増やさない)

    • 例えば図の場合
    • 視差マップを使用しない場合、現在の視点からフラグメントA点(黄色)の情報を取得すると、図中のHaになる
    • 視差マップを使用する場合、視線とA点の延長線が物体と交差する点(B点)を参照するため、その値はHbになる

    • 視差マッピングの具体アルゴリズム:AのUV値が分かっている状況で、BのUV値を算出する方法
    • AB間のオフセット量が分かればよい
    • オフセット量の取得:近似的な方法で計算
      まずAの高さ情報をサンプリングし、物体表面から水平面(0.0)までの深度値Haを得る。
      深度値Haと視線との三角関係から、物体上で等比的なオフセット方向を算出し、近似的なB点を計算する(図中の近似B点と実際のB点には大きなズレがあるため、再現精度は低い)。

      d = v.xy * ha * scale / v.z

      // 高さマップから深度値を取得(0~1 → 1~0 に反転)
      float height    = 1 - tex2D(_HeightMap, i.uv2.xy).r;
      // ワールド空間の視線ベクトルをタンジェント空間に変換
      float3 viewDirTS = TransformWorldToTangent(viewDirWS.xyz, T2W);
      // UV オフセットを計算:XY 平面成分 ÷ Z 成分 × 深度 × スケール
      float2 offuv     = viewDirTS.xy / viewDirTS.z * height * _HeightScale;
      // テクスチャ座標をずらす
      i.uv.xy         += offuv;
      i.uv.zw         += offuv;

      オフセットを取得した後、B点のUVを用いて法線マップをサンプリングおよび計算するため、A点ではなくB点の法線が参照される。

      モデルはタンジェント空間内で、すべての頂点がタンジェントおよびビタンジェントで構成される平面(図中の0.0点)上に配置されているが、実際の物体にはより豊富なディテールが存在する。

理解:視差マッピングがどのようにオクルージョン効果を生み出すか

  • 視線がA点のように深度が大きい点を見ている場合、視差マップで計算されるオフセット量も大きくなり、A点は他の点にサンプリングされる機会が増えるため、最終的にレンダリングされる可能性が低くなる
  • 視線がB点のように深度が小さい点を見ている場合、計算されるオフセット量は小さくなり、元の点付近にサンプリングされるため、描画される可能性が高くな

  • 深度が大きい点は深度が小さい点に覆い隠されやすく、これが遮蔽(オクルージョン)効果として表現される



     



【TA】Normal Mapping 法線マッピング

1. 紹介

  • Normal Map(ノーマルマップ)とは、物体の局所表面における法線情報を保存したテクスチャのこと。

  • ライティング計算時に、プログラムはこのマップを読み込み、現在のピクセルに対応する法線ベクトルを取得し、それを照明方向と組み合わせてライティングを行う。

  • 効果:ノーマルマップを用いることで、通常のテクスチャだけでは表現できない豊かなディテールを視覚的に再現でき、照明方向の変化に応じてリアルタイムに見た目が変化する。

  • 生成方法

    • ノーマルマップは、一般的にハイポリゴンモデルからローポリゴンモデルに投影して作成される。

    • 金属や木材など、表面ディテールが豊富な素材は、**Photoshop(PS)やSubstance Designer(SD)**などのソフトで補助的に生成可能。

 

2. 実装

法線の格納は、通常モデルの接線空間(Tangent Space)に保存される。

① 保存:接線空間

  • 接線空間とは、物体表面の接線・副接線・法線によって構成されるローカル空間のこと。

  • Tangent Space では、座標原点は頂点の位置を基準とする。

  • 頂点法線(n)をZ軸とする。

  • 残りの2本のベクトルで X軸とY軸 を定義する必要がある。

  • 一般的な接線(t)は、テクスチャ座標(UV)と同じ方向の接線ベクトル。

  • 副接線(b)は、法線ベクトルと接線ベクトルの外積によって求められる。

 

なぜ接線空間(Tangent Space)を導入するのか?

1. 自由度が高い

もし法線情報をモデル空間に保存する場合、法線は絶対的な方向であり、
その法線情報は特定のモデル専用となり、他のモデルには使えなくなってしまう。

一方、接線空間で法線を記録する場合は、相対的な方向ベクトルとなるため、
すべてのモデルに再利用可能となる。

2. 圧縮と利便性

接線空間では、法線ベクトルはすでに正規化されており、
3つの座標成分はいずれも [0, 1] の範囲内に収まる。
また、ベクトルの長さが1に固定されているため、
2つの成分があればもう1つの成分を導出可能で、データ圧縮やシェーダ処理に有利。

 

② ワールド空間と接線空間の変換

ライティング計算を行う際、光の計算に用いるベクトルは共通の座標系で扱う必要がある。
そのため、接線空間で得た法線ベクトルをワールド空間に変換するための行列、
またはワールド空間のベクトルを接線空間に変換するための行列が必要になる。

処理手順:

  • ワールド空間の頂点の法線(Normal)・接線(Tangent)・副接線(Bitangent) を使用し、この3つのベクトルからなる**直交基底(標準正規直交基)**で変換行列を構築する。
  • これにより、法線 → Z軸、接線 → X軸、副接線 → Y軸 のように基準を定義する。

変換行列(TBN行列):

  • 3×3の行列として空間ベクトルの変換を行う。これを TBN行列 と呼ぶ。

  • 接線空間 → ワールド空間 の変換には TBN 行列を使用する。

  • ワールド空間 → 接線空間 の変換には TBN⁻¹(逆行列) を使用する。

  • TBN は直交行列なので、逆行列 = 転置行列である。

 

行列表記:

 

③ Unity におけるノーマルマップの圧縮形式

  • モバイル以外のプラットフォームでは、Unity はノーマルマップを DXRT5nm形式 に変換する。
    この形式では、有効なチャンネルは GチャンネルとAチャンネル のみであり、
    これによりメモリ使用量を削減できる。
    DXRT5nm形式では、GとAにそれぞれ 法線のX成分とY成分 を格納し、
    Z成分は簡単な計算式で復元される。

  • モバイルプラットフォームでは、Unity は従来通り RGBチャンネル を使用する。

    法線マップをデコードする際に「*2-1」の操作を行うことについての説明

    法線テクスチャには表面法線が格納されており、法線ベクトルの成分範囲は[-1,1]、ピクセル値の範囲は[0,1]であるため、通常以下のマッピングを行う:pixel = (normal + 1) / 2  デコード時にはこの逆操作を行う必要がある。

    normal.xy *= scale; の説明

    法線の摂動(ディストーション)効果をスケールするための操作。




\text{TBN}^{-1} = \begin{bmatrix} T_x & T_y & T_z \\ B_x & B_y & B_z \\ N_x & N_y & N_z \\ \end{bmatrix} = \text{TBN}^T
 

【TA】Bump Mappingの紹介

1. 物体にディテールを与える方法

物体のディテールは大きく3つに分類できる:マクロ視点、ミドル視点、ミクロ視点

 

  • マクロ視点(宏観)

    • 特徴は多数のピクセルを覆う

    • トポロジー的には頂点、三角形、その他の図形で表現される

    • 例:キャラクターの四肢や頭部

  • ミドル視点(中観)

    • 特徴は数ピクセルにわたる

    • マクロとミクロの中間のスケールの特徴を描写

    • 単一の三角形では表現できないほど細かく、ある程度の解像度が必要

    • 高い技術力により、数ピクセルの変化でも視認可能

    • 例:顔のしわ、筋肉の膨らみ、頭皮の縫い目など

  • ミクロ視点(微観)

    • 特徴は1ピクセル以下である可能性がある

    • 通常、シェーダ内で色としてエンコードされ、テクスチャマップとして使用される

    • 物体表面の粗さや凹凸との相互作用を模倣する

    • 例えば:

      • ハイライトを持つ物体では滑らかに見え、

      • 拡散表現の物体ではザラザラとした質感になる

    • キャラクターの肌や衣服が同じマテリアルでも違う見え方をするのは、
      使用するバンプマップやシェーディングモデルが異なるためである

 

2. バンプマッピング(BUMP)

中観スケールのディテールを模倣する代表的な手法の一つで、
モデルよりもさらに微細なディテールを視覚的に表現できる。

中心的な考え方:

  • テクスチャでスケールに関する情報をエンコードする

  • 視覚的に照明を受けた表面の凹凸を、実際の凹凸表現に置き換える

  • 表面に小スケールのディテールを持たせるように見せる

原理:

  • モデルの表面法線を画像によって変化させ、それを元にライティングを計算する

  • 複雑なジオメトリを追加せずに、現実感のある視覚効果を実現する効率的な方法

  • 法線マップなどを用いた例では、明暗のディテールが大幅に増加するのが確認できる

     

 

3. 分類(マッピング方式の比較)


 

Bump Mapping                                                                                                                      

頂点の元の法線方向を直接使用するのではなく、法線方向に微小な摂動(擾乱)を加えて新しい法線を生成し、照明計算を行うことで凹凸感を表現。
No self-occlusion, No self-shadow, No silhouette(自己遮蔽・影・輪郭なし)
1978

 

Displacement Mapping                                                                                    

頂点の位置に直接作用し、対応する変位マップ(Displacement Map)の値に基づいて頂点を移動させ、実際の幾何的な凹凸面を生成。 1984
Normal Mapping                                              頂点の法線情報を直接必要とせず、法線方向はノーマルマップから取得。
RGBの各チャネルでXYZ方向の法線を表現し、照明計算に使用する。
No self-occlusion, No self-shadow, No silhouette
1996
Parallax Mapping
Virtual Displacement Mapping(仮想変位マッピング
頂点位置は変更せず、視差によりheight mapを参照してテクスチャ座標を補正し、より立体的に見せる。
見かけ上、凹凸があるように見えるが、自己遮蔽・影・輪郭は表現できない。
2001

 

Relief Mapping

Steep Parallax Mapping                                                                                            

より高精度でリアルな視差と深度感を実現する手法。
Texture Offset を詳細に調整することで、self-occlusion, self-shadowing, view-motion parallax, silhouette のような表現も可能。
2005

 

 



【TA】照明モデル

一、定義


照明モデルは、物体のある点における光の強さ(色)を計算するために用いられる。
光と物体表面の相互作用として理解することができる。

計算理論に基づいて、次の2種類に分類できる:


◦ 物理理論に基づく照明モデル:物理を重視し、結果はリアルだが、計算が複雑である
◦ 経験モデル:実験結果に基づき、簡略化を行い、効果もなかなか良い

 

  • 1967 第一次光照効果

  • 1970 Lambert拡散反射モデル

  • 1971 Gouraudモデル

  • 1975 Phong照明モデル

  • 1977 Blinn-Phongモデルの改良

  • 1980 Whitted光線追跡モデル

  • 1982 Cook-Torranceモデル

  • 1986 Kajiyaが照明モデルを統一し、レンダリング方程式を開発

 

二、局所照明モデル

局所照明モデルの定義

局所照明モデルは、直接照明のみを対象とし、複数回の反射による光線は考慮しない。

 

     

 

局所照明モデルの分類

◦ 拡散反射
◦ 鏡面反射
◦ 環境光
◦ 自己発光

 

1. 拡散反射

定義: 

全方向に分散して反射される光

拡散反射では、光線は吸収と反射を伴い、吸収によって色が変わり、反射によって方向が変わる。

計算: 一般的に Lambert モデルを用いて照明を計算する。

 

理論的基礎

光学では、通常、放射照度を用いて光を定量化する。
その中で、光源が放つ全ての光量は放射束 PP
特定面に照射された光の量は単位面積あたりの照度(照度)で表され、P/AP / A

  • 点光源が面 A1A_1 に垂直に照射された場合、照度 E1=P/A1E_1 = P / A_1

  • 同じ光を別の傾いた面 A2A_2 に照射した場合、照度 E2=P/A2E_2 = P / A_2

よって、以下の関係式が得られる:

簡単に言えば:反射光の強さは、表面法線ベクトルと光源方向との間の余弦の比に比例する。

照明の公式

拡散反射の効果は観察者の位置には無関係であり、光源の位置に依存する。

 

Lambert モデルは高品質な光効果を提供できず、作成されたマテリアルはゴムっぽく見える傾向がある。

 

2. 鏡面反射(スペキュラ反射)

定義

鏡面反射とは、光線が物体表面に当たって生じる反射のこと。
光の強さは変わらず、方向が変わる。

何が鏡面反射か

当観察者が反射光線の方向に近い位置から物体を見ると、鏡面反射を観察することができる。

鏡面反射とは、光が物体表面で反射される際に発生する現象である(光の強さは変わらず、方向のみ変化)。
鏡面反射の効果は、観察者の位置と反射方向の一致度によって決定される。

通常は視線方向と反射ベクトルとの一致度に基づいて反射強度を計算し、
ハイライトの大きさは視差(視線ベクトルと反射ベクトルの角度差)によって決まる。

 

どうやって計算するか?

 

  • mglossm_{\text{gloss}}:材質の光沢度
  • mspecularm_{\text{specular}}:材質の反射率

  • RR:反射光ベクトル

  • VV:視線ベクトル

 

エネルギー分布図:

  • 光沢度が小さい → ハイライト範囲が広い

  • 光沢度が大きい → ハイライト範囲が狭い

3. 環境光(アンビエントライト)

定義:

間接照明の影響を考慮し、物体が直接照らされていない部分にもある程度の明るさが必要とされる

 

どうやって計算する?

Cambient=Albedo×Ambientlight

 

環境光による反射光量は、通常、拡散反射の反射率を使って示される。
このモデルでは、シーン内で多重散乱や反射が発生し、
すべての方向から均等に目標物体に放射されると仮定している。C_{\text{ambient}} = \text{Albedo} \times \text{Ambient}_{\text{light}}環境光による反射光量は、通常、拡散反射の反射率を使って示される。
このモデルでは、シーン内で多重散乱や反射が発生し、
すべての方向から均等に目標物体に放射されると仮定している。

 

4. 自己発光(エミッシブ)

定義:

物体が自ら発する光であり、単独で加算される。

 

 

【TA】モデルとマテリアルの基礎

一、レンダリングパイプラインとモデルの基礎

1.レンダリングパイプライン

おなじみの内容なので、講義のスクリーンショットをそのまま貼ります。

  • 青い背景:プログラマブルパイプライン
  • 頂点シェーダー:モデルの頂点を計算する
  • フラグメントシェーダー:ラスタライズ段階で補間された情報を計算する
  • 例:ライティング計算

 

2.uv

  • テクスチャマッピング:すべての3Dオブジェクトの表面は2Dである → テクスチャは1枚の画像 → テクスチャマッピングとは、この画像を3Dオブジェクトにかぶせること
  • uvとは、この画像をu軸とv軸のある座標系上に展開すること
  • 各頂点はuv座標を使って、テクスチャに保存された情報を取得できる

 

3.モデルに含まれる情報

  • v:頂点座標データ(モデル空間における1つの頂点のxyz座標)
  • vt(texcoord):テクスチャ座標(uv座標)
  • vn(normal):頂点法線
  • 頂点カラー

 

二、マテリアルの基礎

1.ディフューズ(拡散反射)

  • 光が四方八方に反射する。
  • 補足:(GAMES101)入射するRadiance(放射輝度)は均一である → 入射と出射のIrradiance(照度)は等しい、かつそれぞれのRadianceも均一 → 入射Radianceと出射Radianceは等しい
  • Lambertモデルはすべての方向に対して均一であると単純に仮定している。

 

2.鏡面反射


滑らかな鏡面反射

  • 入射角と出射角が等しい。
  • 入射光は表面法線に基づいて反射し、反射方向にのみエネルギーが存在し、それ以外の方向にはエネルギーが存在しない(すべて0)。

 

 粗い鏡面反射(マイクロファセット反射)
法線のずれが小さいため、反射はある特定の範囲に集中し、マット(艶消し)のような質感になる。

 

3.屈折(リフラクション)


屈折

  • 特殊な媒質では、反射に加えて屈折も発生する現象がある。
  • 反射と屈折それぞれのエネルギー量はFresnelの法則によって決まる:
    R = refract(View,Normal,ration);
    ReflColor = tex2D(skybox,R);

 

粗い鏡面屈折(マイクロファセット屈折)

  • 粗い鏡面反射と同様に、屈折もある特定の範囲に集中する。

     

   


 4.多層マテリアル(マルチレイヤーマテリアル)

  • 物体自体のマテリアルに加えて、表面にも何かが存在しており(例えばコーティングなど)

   

 

5.サブサーフェススキャタリング / SSS(BSSRDF)

  • // 参考ノート:GAMES101-L18
  • 半透明の物体。例えば、翡翠、ろうそく、牛乳、肌など。
  • 光が皮膚の内部に入ると、毛細血管を照らし出すため、
  • 明暗の境界部分では、反射された赤い光がより目立って見える。

   

   

 

6.マテリアル表面の変更

  • 現実世界には完全に滑らかな表面は存在せず、モデルの頂点に含まれる法線情報も限られているため、
  • 私たちはノーマルマップを使って効果を表現する。
    ライティング計算では法線が関与するため、この法線を調整することでライティングの結果を変えることができる。
  • 例えば『GUILTY GEARギルティギア)』のトゥーンシェーディングでは、手動で法線を調整している。
  • 補足:(GAMES101):レンダリング方程式において、マテリアルに関わる項はBRDFである。CGにおいて、Material = BRDF と考えられる。

 

三、モデルデータの解析(レンダリングパイプラインにおける役割)

1.頂点アニメーション

  • 頂点シェーダーはモデルの各頂点を計算し、それぞれの頂点データは異なる。
  • そのため、同じ計算式を使っても、異なる頂点からは異なる結果が得られる。
  • 頂点アニメーションとは、頂点シェーダー内でモデルの頂点を操作し、アニメーション効果を生み出す手法である。
  • 一定数以上の頂点が必要であり、頂点数が多いほどアニメーション効果がはっきりする(必要に応じてテセレーションと併用することもある)。
  • 1つの頂点が頂点シェーダーに入力されると、頂点シェーダーがその位置を制御し、すべての頂点に対して同じアルゴリズムが実行される。
  • 一部の3Dソフトウェアでは、アニメーションのキー(Kフレーム)も頂点アニメーションと呼ばれる。
    ※補足:(GAMES101でのShaderの概念補足)各頂点/ピクセルはそれぞれ一度ずつShaderを実行する。これは汎用的に処理されるため、ループを記述する必要がない。

2.テクスチャアニメーション

  • レンダリング中にテクスチャ座標(UV)を変更し、サンプリング時にオフセットをかけることでアニメーション効果を実現する。(例:UE4の「Panner」ノードは、テクスチャ座標を取得して移動させることができる)
  • 通常、UVのオフセットは頂点シェーダーで行われるが、その理由を個人的に以下の2点にまとめる:
    ① テクスチャの読み込み依存が発生するため、パフォーマンスに影響を与える(頂点シェーダーから直接フラグメントシェーダーへ渡さない限り、依存テクスチャ読み込みが発生する)
    ② 一般的に、頂点数 < ピクセル数(フラグメント数)なので、頂点シェーダーで処理すれば実行回数が少なく済む

 

3.頂点カラー(バーテックスカラー

  • 頂点カラーを判定条件として、さまざまな処理を行うことができる。
    例:頂点カラーがある値に達したら影をつける。
    例2:庄懂先生の授業の後半では、モデルの頂点カラーをマスクとして使用している事例が紹介されている。
  • Mayaでは、頂点カラーを直接ペイントすることが可能。
  • すべての四角形ポリゴンはゲームエンジンに取り込まれる際、三角形に変換されて計算される
  • GAMES101 ― 幾何部分の補足:コンピュータグラフィックスでは、物体の表現に最も一般的に使用されるのは三角形ポリゴンである。

 

4.補間(インターポレーション):バリセンター座標(重心座標)

// 詳細な内容は『GAMES101』- L9「補間」の講義ノートを参照

  • まとめ:三角形が存在する平面上の任意の点(x, y)は、三頂点(α, β, γ)による線形結合で表現できる。
  • 補足:重心座標は投影後にそのまま維持されるとは限らないため、三次元のケースでは、まず三角形の3D空間での重心座標を求めてから補間を行う必要がある。

         

  • この公式を利用することで、現在のピクセルの頂点カラー、法線、テクスチャ座標などを求めることができ、
    周囲の3つの頂点からこれらの値を補間することが可能になる。
  • 例:重心座標によるカラーの補間(インターポレーション)

  • B点の色が青、C点の色が緑だとすると、
    D点の色は青と緑の線形結合(リニアブレンド)になります。

    例えば:D点のX軸座標が3で、B点とC点のX軸距離が4の場合、
    D点はC点に近いので、

    → D点の色 = 3/4 緑 + 1/4 青
    (緑の割合が75%、青の割合が25%)

 

5.頂点法線と面法線

  • 面法線も本質的には頂点法線であり、異なるのはその「保存方法」である。
  • 原理:面法線:3つの頂点が1つの法線を共有するため、補間の結果はすべて同じになる。頂点法線:各頂点に個別の法線があり、それぞれの法線を補間することで、滑らかなシェーディングが可能になる。

 

拡張:NPR(ノンフォトリアリスティックレンダリング)におけるアウトライン(輪郭線)描画

  • NPRレンダリングでは、通常、頂点シェーダー内で頂点の法線方向に少しオフセットし、その後、フラグメントシェーダーで単一の色を出力することで、アウトライン効果(輪郭線)を表現する。
  • BackFacing(裏面)を使ったアウトライン描画では、頂点間の法線がスムーズでないと、線が途中で途切れてしまうことがある。

 

 

 
 
 
 

【TA】色空間の紹介

色をどう表現するか

感覚的な認識ではなく、ここでは真面目に議論し、問題の本質を探ります ——> 色彩科学です。

色の送信者(光源の発射角度)

オブジェクト指向の考え方で理解すると:

出生点:光源
Object:光線。光源から発せられた光線が、直射・反射・屈折などの経路を経て最終的に人間の目に入ります。
人間の目が光線を受け取ると、目の細胞が一連の反応を起こし、最終的に脳に伝達されて認識されます。

→ //補足:色とは実は人間の「知覚」です。具体的にどうやって知覚されるか → 後述の「人間の感光細胞の分布」を参照。

 

光源
光を発する物体。(光の発生源)
光:物理現象の一種であり、認識・測定の指標としては「波長」や「エネルギー分布」があります。

  • 理論的に言えば、光は無限に広がっていますが、私たちが見ることができる光の波長は限られています。
  • 補足:どのような光であっても——必ずそれに対応する光のスペクトル(波長分布)があります。
    可視光線の範囲:およそ 400~700nm
  • 400nm より左側:紫外線(UV)

  • 700nm より右側:赤外線(IR)

  • 太陽が最も明るく見える部分では、白色として認識されます。

 

エネルギー分布
光は波であり、実在する物理的な現象です。そのため、当然「エネルギー」も持っています。

例:ある種の光は、複数の波長が組み合わさって構成されています。

光のエネルギーの単位:焦耳(Joule

では、色を表現する際に「波長」だけで説明すれば良いのでは?
問題:それでは人間にとって直感的ではなく、理解しづらい。つまり、波長だけでは簡潔に色を表現することができず、人間の感覚に合いません。

そこで登場するのが:分光光度計
これは、光を波長ごとに分けて、その強度(エネルギー分布)を測定する装置です。

補足:波長が異なれば、屈折率も異なります。
これは光が異なる媒質を通過する際に曲がる程度(屈折率)が、波長によって変化するためです。

 

分光光度計

作用:
① 光を分解し、単一波長の光を生成する
② その単一波長の光の実際のエネルギーを測定する

これは、光の具体的なエネルギー強度を記述・分析するために用いられます。
「分光」操作を通じて、ある波長範囲の光を検出・測定し、
最終的に得られる**光のスペクトル(波長ごとのエネルギー分布)**では、
光のエネルギーが 550nm付近(緑色領域) に集中していることが分かります。

 

 

光の伝播

光が物体の表面に到達すると、多かれ少なかれ一部のエネルギーが吸収されます。そして、どの色の光が吸収されたかによって、私たちが見える色が決まります。

例えば:

黒色:すべての光を吸収 → 反射しない → 何の色も見えない(黒に見える)

白色:すべての光を反射 → どの波長も吸収されない → 全部の色が混ざって白に見える

 

色の受信者(光源の受信角度)

相対的な明るさの知覚

人間の目による光の知覚は絶対的ではなく相対的です。

例:暗い場所と明るい場所、それぞれで同じランプを見るとしましょう。
→ 目に入る光は同じでも、感じ方(明るさの印象)はまったく異なります

つまり、人間の視覚は環境に依存して適応的に変化するのです。

人間の目のHDR(ハイダイナミックレンジ)

※ここでは絞り・露出などの概念が登場します。詳細は →《GAMES101》-L19 を参照

弾幕の中である学生がこれらの概念を次のようにたとえて説明していました:

  • 露出(Exposure):水桶に水をためることにたとえる

  • 絞り(Aperture):蛇口の口の大きさ

  • シャッター(Shutter Speed):蛇口を開けている時間

  • ISO感度:水が出る圧力(感光度)

  • 露出量:水桶に最終的にどれだけ水がたまったか

 

このように理解できます:
人間の目は、明るい場所では明るい部分の細かな階調やディテールを認識できます。
暗い場所でも同様に、暗部の細部を認識することができます。

ただし、極端に明るい部分と極端に暗い部分を同時に正確に見ることはできません(ダイナミックレンジが広すぎて人間の目の処理が追いつかないため)。

 

人間の目の感光細胞の分布(人間はどうやって色を知覚するのか)

 

瞳孔 → 絞り(Aperture)
水晶体 → レンズ(Lens)
網膜 → 感知の場所(Retina

 

網膜には「感光細胞」が存在します。
感光細胞には主に2種類あります:

  1. 桿体細胞(Rod):
     → 明るさ(光の強さ)を感知(=白黒・グレースケール)

  2. 錐体細胞(Cone):
     → 色を感知

 

錐体細胞は3種類に分類されます:

  • S錐体(S-cone):短波長(高周波) → 青色領域を感知

  • M錐体(M-cone):中波長 → 緑色領域を感知

  • L錐体(L-cone):長波長(低周波) → 赤色領域を感知

 

人によってこれら3種類の細胞の構成比や感度にはかなり個体差があります。
このことからも、「色」は人間の主観的な感知によるものであることがよく分かります。

 

どうやって色を感じるのか?
S・M・Lの3つの刺激量の組み合わせが、私たちが見る「色」の正体です。

錐体細胞
これは、人間の目が「色」を感知するための細胞です。

人間の目の本質

人の目は光源の受信機です。

  • 入力:外部からの光線

  • 出力:神経電気信号 → 脳へ伝達され、最終的に「色」として認識されます。

色空間

色空間の定義

ある色空間を定義するためには、少なくとも以下の3つの重要な要素を満たす必要があります:

① 色域(Gamut):三原色(RGB)の座標。
 → この3点を結ぶことで、色域の三角形を形成します。

② ガンマ補正(Gamma):
 → 三角形の内部に対して、白色点(ホワイトポイント)に向かって非線形な分割を行います。
 → これは人間の視覚特性に合わせた補正であり、計算の効率化にも役立ちます。

詳解:色彩空間における Gamma(ガンマ)

  • Gamma は色空間そのものではなく、「色をどのようにサンプリング(分布)するか」を定義する方式です。
  • Gamma = 1:
     → 均等に切り分ける、つまり線形(リニア)な分布。

  • Gamma ≠ 1:
     → 非線形な分布(人間の視覚特性に基づく)。
     → 暗部に対して高い感度を持ち、明部に対しては鈍感。
     → 人間の目は「暗い部分を細かく観察」し、「明るい部分をざっくり観察」する傾向があるため、非線形なガンマカーブが使われます。

  • これは、初期のコンピュータのハードウェア制限にも関係しており、
    より効率的にデータを扱うためにも導入されていました。
    (※詳細は「Gamma 補正」の講義を参照)

③ 白点(White Point):
 → 色域三角形の中央あたりにある基準点。
 → 「白色」とは、もっとも明るい基準の色を指します。

④ 補足:

  • 色域(Gamut):
     → ある色空間で表現可能なすべての色の範囲。

  • RGB は、色域三角形の三つの頂点によって構成される中間の表現領域です。
     → 色域はこの三角形によって大まかに定義されますが、RGB だけではカバーできない色も多く存在します。

⑤ カスタム色空間(自定義色彩空間)

  • 色域、白点の位置、Gamma 値のいずれかを変更すれば、
    それだけでまったく新しい色空間になります。

 

よく使われる色空間と色モデル

色彩模型(Color Model)

→ 色をどう表現・並べるかのルールや構造のこと。
(※色空間ではない)

代表的な例:

  • RGB:赤・緑・青の加法混色モデル(ディスプレイ用)

  • CMYK:シアン・マゼンタ・イエロー・黒の減法混色モデル(印刷用)

  • LAB:L(明度)、A(赤緑軸)、B(青黄軸)で構成される、視覚に基づいたモデル

  • HSV / HSL:色相(Hue)、彩度(Saturation)、明度(Value / Lightness)

色彩空间(Color Space)

→ 色を具体的に表現するための規格化された構造・基準
→ 色域、白点、ガンマ の3つの要素を備える必要があります。

 

CMYK システム:(典型的な減法混色モデル)

小さな疑問:もともと黒色を混ぜて作れるのに、なぜわざわざ黒のKを使うの?
→ コストだよ。黒が一番安いから。