Unity
Shader

1行で描けるかんたんシェーダ5点盛り

シェーダを描きたい

 Unityでシェーダを描きたい! でも何を書けばいいかわからない! という方へ。
 1行で描ける(正確には改変できる)シェーダを5つ程考えたので、コピペなり写経するなりしてシェーダを触ってみる手がかりになれば幸いです。

導入

image.png

 Assets欄から

Create > Shader > Unlit Shader

 を選んでシェーダを作ります。

image.png

 新しく作成された「New UnlitShader」を選んで、右上に表示される「Open」ボタンを押します。

image.png

 60行ぐらいの難しそうなコードが出てきますが、大事なのは53行目の「return col;」です。ここを書き換えれば簡単なシェーダならここ1行で表現できます。

 では、実例を見ていきましょう。

グリーンバック

green.PNG

return float4(0,1,0,0);

 背景撮影に便利です。右の方にいるのは私のアバターです(かわいい)。ソースの中身は至極簡単で、コンマで区切った最初の数字がR,G,Bを表しているので、0,1,0を入れれば緑色になります。

マケドニア国旗

マケドニア.PNG

return float4(1,step(sin(10*atan2(i.uv.y-.5,i.uv.x-.5)),0),0,0);

 正式名称は不明ですが、マケドニア国旗に良く似ているのでマケドニア国旗と呼ばれているアレです。実際のマケドニア国旗は8分割ですが、20分割ぐらいした方がマケドニア感(マケドニア感とは?)が増すのでそうしています。

 赤は全部1を入れておいて、緑を放射状に入れることによりマケドニア感を出しています。xy平面内の点の角度は、$tan^{-1}(\frac{y}{x})$で出ますので、角度によって周期的に緑を足すようにしています。周期性を出すにはstep(frac(ほげ),0.5)でも可能ですが、step(sin(ほげ),0)の方が短いのでそうしています。

スペクトラム

rainbow.PNG

return float4(step(cos(20*i.uv.x),0),step(cos(20*(i.uv.x+2.09)),0),step(cos(20*(i.uv.x+4.19)),0),0);

 一行が長くてあまりエレガントなワンライナーではないですね。すいません。RGBをそれぞれ違う周期で足していくことにより虹色を表現しています。Unityのシェーダでは円周率の定数を使えないので(使えるのかもしれませんが、デフォルトでは使えませんでした)有効数字3桁で近似しています。線の幅がまちまちなのはそのせいです。

target.PNG

return 1-step(sin(50*distance(float2(.5,.5),i.uv)),0);

 弓道に使われてそうな的です。ちなみにこのタイプの、同心円がいくつも並ぶものは霞的と言います。distance関数(2次元ベクトル同士の距離を計算する)を使えば極めてシンプルに表現できます。ちなみに先頭に「1-」をつけて白黒反転させているのは、霞的の中心が白いのを再現するためです(弓道経験者のこだわり)。言い忘れましたが、returnに白黒を返す場合は、4次元配列ではなく1次元の変数を指定するだけで良いようです。

グリッド

grid.PNG

return step(sin(20*i.uv.x),0)+step(sin(20*i.uv.y),0)*(1-2*step(sin(20*i.uv.x),0));

 F1に使われてそうな白黒グリッドです。なんだかアバターがレースクイーンに見えてきました。これもあまりエレガントなやり方ではないですね。良い実装があったら教えてください。