CG系雑学その他その他

ブレンドモードの研究 <暗くする系>

素材

背景                   重ね素材
重ね結果
比較(暗) 乗算 焼き込みカラー
焼き込みカラー(クラッシック) 焼き込みリニア カラー比較(暗)

比較(暗)

RGBの3つの値を比較し、暗い方(数値の低い方)を選ぶ
前回の比較(明)の逆バージョン
キノピオの色がそのまま残っている場合は、RGBの3つが全て背景の数値に負けている場合
どちらの色でもない場合は、2勝1敗などのとき

<処理例1> 1勝2敗パターン
RGB(143、 50、 17)   ■■■
RGB( 50、122、 19)   ■■■
======↓結果↓============
RGB( 50、 50、 17)   ■■■

<処理例2> 全勝パターン
RGB(143、 50、 17)   ■■■
RGB(150、122、 19)   ■■■
======↓結果↓============
RGB(143、 50、 17)  ■■■

乗算


暗くしたいときに一番よく使うモード
加算と対をなすモードと思いがちだが、どちらかというとスクリーンの逆バージョン
重ね素材と背景の両方が真っ黒 RGB(0、0、0)でない限り、真っ黒にはならないので使い勝手が良い

計算式も単純

<背景をA、重ね素材をBとした場合の式>
乗算処理結果=A×B

前回と同じで、RGBの255を1とすると分かりやすい。
AもBも0以上1以下なので、絶対に結果の値は低くなるし、
どちらかが0なら、絶対に結果は0だと分かる。

<処理例> 1勝2敗パターン
RGB(143、100、 17)   ■■■
RGB(240、  5、 19)   ■■■
======↓結果↓============
RGB(135、  2、  1)   ■■■

<処理例のGの値のみに注目する (四捨五入あり)>

100
÷255≒0.392
  5÷255≒0.0196

結果=0.392×0.0196
結果=0.00770.0077×255=1.9635≒2

焼き込みカラー


覆い焼きカラーの逆バージョン
覆い焼きカラーは背景が明るければ明るくする効果(大)、背景が暗ければ明るくする効果(小)があった。この効果により背景の明暗の差がより強調され、コントラストが高い処理結果が生まれる。
焼き込みカラーは背景が暗ければ暗くする効果(大)背景が明るければ暗くする効果(小)になる。
このモードもRGBの最大値を1として考える。

<背景をA、重ね素材をBとした場合の式>
焼き込みカラー処理結果=1-{(1-A)÷B}

覆い焼きカラーより分かりにくい式だが、基本的に覆い焼きカラーの逆と覚えておけばよさそう。
下記の処理例を見ると、重ね素材の暗くする効果をより発揮するには、背景素材の明暗がとても重要なのが分かる。同じ重ね素材の値でも、Rは15しか下がっていないが、Gは50以上も値が下がっている。この差がコントラストを生み出す。

RBGが0側にカンストするには式の{(1-A)÷B}の部分が1より大きければよい。
つまり、背景の値を逆転させたもの(1-B)が、重ね素材より大きければ値は1以上なので、結果が0側にカンストするといえる。処理例のGで言えば、200の逆は55で、55は背景の50より大きいから、値はカンストすると暗算で分かる。ここを抑えておけば、実際使うときも黒トビ?を防げるかも。

<処理例>
RGB(200、200、200)   ■■■ 重ね素材
RGB(200、 50、125)   ■■■ 背景
======↓結果↓============
RGB(185、  0、 89)   ■■■

<処理例のRの値のみに注目する (四捨五入あり)>
200÷255≒0.784
200÷255≒0.784

結果=1-{(1-0.784)÷0.784}
結果=1-{0.216÷0.784}
結果=1-0.276
結果=0.724

0.724×255≒185

焼き込みカラー(クラッシック)



覆い焼きカラー(クラッシック)と同様に旧バージョンと互換性を持たせるためのモード。
処理結果は覆い焼きカラーと全く同じ、はず。
まず使うことは無いので割愛。

焼き込みリニア


加算の逆バージョンという感じ。乗算より暗くなる。
乗算では黒トビ?RGB(0.0.0)しない部分が真っ黒になる。
実際の作業では、じゃあ安定感のある乗算でいいよね、となることが多そう。

<背景をA、重ね素材をBとした場合の式>
焼き込みリニア処理結果=1-{(1-A)+(1-B)}

各素材を反転させたものを加算し、それをさらに反転させる形になる。
もう少し分かりやすくすると、結果=A+B-1となるので、加算(上限なし)した後に1を引いた値になると覚えた方がよさそう。
当然、A+Bの値が1より小さければ、値は0になってしまう。

<処理例>
RGB(110、225、208)   ■■■
RGB(129、227、 87)   ■■■
======↓結果↓============
RGB(  0、197、 40)   ■■■

<処理例のGの値のみに注目する (RGB値の上限を255で計算)>

結果=225227ー255
結果=452ー255
結果=197

カラー比較(暗)

比較(暗)と似ているが、重ね素材と背景どちらの色を選択するかの方法が結構違う。
比較(暗)の場合はRGBの3つの値の小さい方を選択していくが、
カラー比較(暗)はRBGの合計値{RGB(30、100、11)なら30+100+11で141}の小さい方が選ばれるので、重ね素材か背景のどちらかの色が必ず結果として出る。
カラー比較(明)の逆ですね。

<処理例>
RGB(143、 50、 17)   ■■■ 合計210
RGB( 50、122、 19)   ■■■ 合計191
======↓結果↓============
RGB( 50、122、 19)  ■■■ 

次はオーバーレイなどの複雑系?を調べてみます。

gesomaをフォローする
CGすくいどる

コメント