さわぐちFMオキーステーション

幸せの鐘が鳴り響き僕はただ嬉しいふりをする

Shader Graphの超入門レシピ その9~モノクロ、セピア、ネガポジ、モザイク、二階調化~

前回の記事

amidamangrove.hatenablog.com

今回の記事

今回は1枚のテクスチャにシンプルな画像処理を施してみたいと思います。ノード数も多くないのでさくっと試せるんじゃーないかなーと思います。 f:id:amidaMangrove:20200329213334p:plain

モノクロにする

モノクロに変換には以下の式を適用します

color = r *0.3 + g * 0.59 + b * 0.11

この計算は内積 = Dot Productで簡単に行う事ができます。 f:id:amidaMangrove:20200329113211p:plain

計算後に「Stepノード」を追加することで二階調化も簡単に行えます。 f:id:amidaMangrove:20200329205845p:plain

ネガポジ反転

ネガポジ反転は「One Minus」を使用する方法とその名の通り「Invert Color」を使用する2つの方法があります。 f:id:amidaMangrove:20200329113605p:plain

Invert Colorは色の要素単位で反転が可能です。 f:id:amidaMangrove:20200329113659p:plain

セピアにする

セピアはモノクロに変換した値に対してそれぞれ以下のスケールをかけ合わせれば実現できます。

mono = r *0.3 + g * 0.59 + b * 0.11

color.r = mono * 1.07

color.g = mono * 0.74

color.b = mono * 0.43

モノクロで出力した値をCombineノードで結合し各要素に対してセピアのスケール値を乗算すればできそうです。 f:id:amidaMangrove:20200329115121p:plain

モザイクにする

「Posterrizeノード」を使用することでモザイクを実現できます。このノードは入力された値を指定した階調で出力してくれるノードです。このノードをUVの入力値として使用します。 f:id:amidaMangrove:20200329120928p:plain

レトロ風にする

写真に縦線を入れてレトロっぽく表現してみます。モノクロのに対してノイズのX方向のみを取り出し掛け合わるだけでそれっぽい表現となります。 f:id:amidaMangrove:20200329213819p:plain

シンプルなシェーダーが連続しましたがエフェクトの隠し味として色々使えそうですね。