Unity初心者がシェーダーでお絵描きする 4

 

ブログの目的

Unityシェーダーでいろんなお絵描きができるようになること

 

参考にしている資料

KotaMatsusita さんがtwitterに公開をして下さっている、Unityシェーダーでお絵かきができるようになるためのスライド

docs.google.com

  

今日のUnity基本用語

GPU

画像を出力するためのメモリ。

 

OpenGL

Android, iOSなどのネイティブアプリの製作において主に用いられるAPI

GPUを利用して、細緻な3次元空間を描画する。

 

WebGL

OpenGLのWeb版。Web上で、質の高い3D空間を描画することができる。

スマホのブラウザからでも高度な3Dアニメーションを見れるという点において、スマホが広く普及している現代においては自然と重宝されてしまうAPI

 

●バーテックスシェーダー

画面の頂点座標を計算するところ。

 

●フラグメントシェーダー

 画面の各ピクセルの色を計算するところ。

 

●Cg/HLSL

シェーダーのプログラミング言語。CgとHLSLには、言語としての違いは殆どないらしい。

 

●Albedo(アルベド

オブジェクトそのものの色。

   

●Standard Surface Shader

Unity側が、オブジェクト表面の 光の反射 に関する設定を、いくつか(恐らくは2つ)用意してくれているシェーダー。

 

まず、オブジェクト表面の凸凹度合いを制御するための Smoothness

表面の凸凹度合いを調整することによって、光の反射の仕方を制御することができる。

1つの反射光の中には、いくつもの方向に反射をする diffuse反射 と、1つの方向にだけ反射をする specular反射 とが存在する。

この2種類の反射光の比率を Smoothness で指定することができ、それにより光の反射の仕方を制御することができる。

 

そして、オブジェクトの金属度合いを制御するための、Metallic 

公式では 金属度合い といった言葉で説明をされていたが、より良い理解のためには、物体のアルベド色と、周囲の景色を物体表面に映そうとする環境光 の比率を Metallic で指定しているという解釈の方が、より具体的でいい気がする。

 

Standard Surface Shader を利用すれば、これらの物理的なパラメータを、初期の段階からUnity上で調整することができる。 

 

理解を試みるにあたり、以下のブログをとても参考にさせていただいた。

indie-du.com

 

かなりの時間をかけて調べたが、結局、完全な理解には及んでいない気がする。

実際、Smoothness と Metallic って、パラメータも調整した結果得られるものは、どちらも ”物体のてかり具合” なんじゃないの? だとしたらどう使い分けるの? みたいな点を理解していない。

 

●Unlit Shader

自分で内容をカスタマイズするシェーダー。vertex / fragment シェーダーはUnlitシェーダーである。このような、プログラムによって動作の指示を与えられる性質を指して、プログラマブルと呼ぶこともある。

 

所感

第一の目的はシェーダーでお絵描きできるようになることだから、今 Standard Surface Shader にあまり時間を使わなくてもよかったな。。

話は逸れるけど、シェーダーのコードは、リファレンスなしで0から書けるようになりたい。。

 

Unity初心者がシェーダーでお絵描きする 3

 

ブログの目的

Unityシェーダーでいろんなお絵描きができるようになること

 

参考にしている資料

KotaMatsusita さんがtwitterに公開をして下さっている、Unityシェーダーでお絵かきができるようになるためのスライド

docs.google.com

  

今日のUnity基本用語

 

●ポリゴン

3次元コンピュータグラフィックスにおいて、立体物の表面を形作る小さな多角形。

三角形が用いられることが多い。

ポリゴンは、特に曲面を表現する際に役に立つ。その理由として、曲面は、多角形に分解せずそのまま描画をすると、多大な計算量がかかるためである。

 

少数の大きなポリゴンで曲面を表現すると、コスト(計算量・計算時間)は少ないが、角張った不自然な描画となる。多数の小さなポリゴンで曲面を表現すると、コストはかかるが、滑らかで精細な描画となる。

 

●メッシュ

 

ポリゴンが複数集まってできたもの。3D世界の大半はメッシュで構成されている。

 

ポリゴンとメッシュに関しては、以下の理解で恐らくは大丈夫、と。

f:id:Dongame:20180504002132p:plain

 

●Quad(クワッド)

形状が Plane(平面)と似ているが、異なる点として、Planeは200個の三角形ポリゴンから生成されているが、Quadは2つの三角形ポリゴンから生成されている。(またPlaneの1辺が10単位なのに対し、Quadの1辺は1単位である。つまりPlaneはでかくQuadは小さい)

クワッドは、画像や動画の再生をするための、ディスプレイ画面として使うと便利とのこと。

今回の私の取り組み内では、シェーダーでお絵描きをするための、ある意味でキャンバスのような役割を果たすと思われる。

 

     f:id:Dongame:20180506005702p:plain      f:id:Dongame:20180506005323p:plain    

     Quad(小さい)             Plane(でかい)

 

別称で、板ポリ(板ポリゴン の略)とも呼ばれる。 

 

マテリアルとシェーダーとテクスチャ

マテリアル・シェーダー・テクスチャの関係性については、Unity公式マニュアルで紹介されていたワークフロー図の説明が分かり易かったです。前回のブログの所感でも触れましたが、再度掲載をします。

 

f:id:Dongame:20180501003647p:plain

(引用元:マテリアルの作成と使用 - Unity マニュアル

 

正確には恐らく違いますが、マテリアルの一部の要素として、シェーダー・テクスチャというパラメータが存在する、という言語化をここでは一旦しておきます。

 

所感

新しいことを知るの楽しいです。

Unity初心者がシェーダーでお絵描きする 2

 

 

ブログの目的

Unityシェーダーでいろんなお絵描きができるようになること

 

参考にしている資料

KotaMatsusita さんがtwitterに公開をして下さっている、Unityシェーダーでお絵かきができるようになるためのスライド

docs.google.com

 

Game Asset Studio さんが提供されている、3Dゲーム作成に関する用語集

www.gameassetstudio.com

 

Unity基本用語

超ざっくりと理解をする。

 

レンダリング

シーンビュー又はゲームビュー上に描画をすること。

 

スクリプト

物体の振る舞いを描写したプログラム

 

◯マテリアル

物体表面をどのように画面に描画するかを決める、パラメータの総称。

 

◯シェーダー

物体表面がどのような模様となるかを決めるプログラム。数学的な計算かつアルゴリズムを内包している。

 

◯テクスチャ

物体の材質を擬似的に表現する為に、表面に貼り付ける画像のようなもの

 

 

現時点でしたこと

 

●新しい種類のシェーダーを作成する

コードの1番最初に、shader "〇〇"
という記述をするが、この〇〇に好きな名前を新しく付けることで、新たなシェーダーの種類を作ることができる。例えば、〇〇にHeartという名前を記述すると、Heartという種類のシェーダーが新規作成される。

 

ちなみにシェーダーの種類は、〇〇の中でさらに細かい種類に分類することも可能で、

その際はコードの1番最初に、shader "〇〇/△△"と記述をする。

 

Unityのシェーダー言語の関数リスト

関数 形式 機能
distance
distance(a,b)
二点間の距離を計算する
step
step(a,d)
d>aならば、関数は1の値を返し、d<aならば、0の値を返す
 
所感

マテリアルとシェーダーの定義に対する言語化が、下手すぎて辛いです。

 

Unity公式マニュアルの中で使用をされていたワークフロー図が、

マテリアル・シェーダー・テクスチャ間の関係性を理解し易かったです。以下その図です。

 

(出典:Unity マニュアル)

f:id:Dongame:20180501003647p:plain

(引用元URL)

docs.unity3d.com

Unity初心者がシェーダーでお絵描きする 1

自己紹介

こんにちは。ysakuと申します。
3日前からUnityを触っているのですが、備忘録代わりに、得た知識を今日からブログにまとめていきます。

 

ブログの目的

Unityシェーダーでいろんなお絵描きができるようになること

 

参考にしている資料

KotaMatsusitaさんがtwitter上で公開をしている、以下のスライドを参考にしています。

docs.google.com

現段階で行ったこと

Quad(クワッド)の作成

絵を描くための下地となる、Quadを新規作成する。

 

手順:「Hierarchyウィンドウ上で右クリック」→「3d object」→「Quad」

マテリアルの作成

この文脈で言うマテリアルとは、ゲームビューに表示されている、Quadの表面部分。模様。

Quadに対して、マテリアルを選択する

Quadに模様をつける為、適当なマテリアルを選択する。

 

手順:「Hierarchyウィンドウで、新規作成したQuadを選択」→

(「Window」→「inspector」→「Mesh rendererの▽ボタンを押す」→ )

「element 0 の項目の右側にある◯ボタンを押し、適当なマテリアルを選ぶ」

シェーダーの作成

マテリアルがどんな模様となるか を、プログラムによってカスタマイズする役割を持つ、シェーダーを新規作成する。

 

手順:「Projectウィンドウ上で右クリック」→「Create」→「Shader」→「Standard Surface Shader」

 

所感

明日も更新します。