こんばんは。ひろし@Y.C.LABです。
今構想段階にあるアプリで、以前リリースした「イロドリ」と同様に混色などの色を扱うことを考えています。
そこで、今日は前のブログでも紹介したプログラミング的に色を混ぜる方法を再掲したいと思います。
色の表現方法
色を表現する方法はいろいろとあって、よく知られているのは、RGB（レッド、グリーン、ブルー）の割合から色を表現するもの。ちなみに最大値は255。
赤だったらRGB = 255,0,0みたいな感じ。
これは、光の三原色である赤と緑と青を組み合わせていろんな色を表現しようというもので、加法混色と呼ばれていて、足せば足すほど白に近づいていくという方法。
主に映像の分野で使われている。
一方、印刷の分野で使われているのは、CMYK（シアン、マゼンタ、イエロー、キープレート（黒））というもの。
足していけば黒に近く減法混色と呼ばれるもの。
プリンタのインクなんかはこっちの表現ですね。
今回はプログラミングで色を混ぜることを考えたいと思うので、RGBの表現をベースに進めたいと思います。
色の足し算
プログラミングで、例えば赤（RGB=255,0,0）と青（RGB=0,0,255）を足すということを考えてみる。
（１）正規化混色（勝手に名前を付けています）
単純に足すと、RGB=255,0,255となってそれらしい紫になる。
では、それにさらに赤を混ぜたらどうなるか。
また単純に足すと、RGB=510,0,255となり、最大値の255を超えてしまう。
ここで、正規化をして、255を超えたものは255となるように調整すると、
RGB=255,0,127となる。
こんな感じで、単純に足して、255を超えた場合は、最大値が255となるように割り算をする方法をここでは正規化混色と呼ぶことにした。
プログラミング的に表すと次の感じだ。（混ぜる色を（R1,G1,B1）と（R2,G2,B2）として、混ぜ合わせた後の色を（R3,G3,B3）とする）
R3 = R1 + R2 ;
R3 = R1 + R2 ;
G3 = G1 + G2 ;
B3 = B1 + B2 ;
MaxRGB = Max(R3,G3,B3);
if(MaxRGB > 255){
n = MaxRGB / 255 ;
R3 = R3 / n ;
G3 = G3 / n ;
B3 = B3 / n ;
}
しっくり来る人とこない人がいそうな結果。。
これ例えば黒（0,0,0）あるいは、黒に限りなく近い色を足した場合、何も起こらないんです。0を足すだけなので。そこで次の方法を考える。
（２）平均化混色（これも勝手に名前付けてます）
名前から想像がつくと思いますが、混ぜる２色のRGBそれぞれの平均を取っていく方法。
赤（RGB=255,0,0）と青（RGB=0,0,255）を足すと、RGB=127,0,127となる。（念の為（255+0）/ 2 = 127）
これにさらに赤（RGB=255,0,0）を足すと、RGB=191,0,63となる。
R：（127 + 255）/ 2 = 191
B：（127 + 0）/ 2 = 63
のため。
プログラミング的に書く必要はないと思うけど、
R3 = ( R1 + R2 ) / 2 ; G3 = ( G1 + G2 ) / 2 ; B3 = ( B1 + B2 ) / 2 ;
なんとなくそれっぽく見えてきた！
からこれで良しとしよう。
ってか（１）の正規化混色で、正規化しないで255を超えたものは255のままにしておくというのもありだと思う。ただ、いずれにしろ、足していくだけでは、黒に近付けることができないという点は変わらない。
まさに加法混色をしているということだ。
ってか、色ってもっと複雑で、明度とか彩度とかいろんな要素があるし、そもそも人によってや目の色によっても見え方が違うからこれだって方法はないんじゃないかと思うし、ググればなんだか難しそうな式も見つけちゃったりしたんだけど、それらは一旦置いておくことにする。
という感じで、昔書いた記事を再掲してみました。
今回は配色することに焦点を絞ったアプリにしてみようかなと思っています。
まだ構想段階なので変わるかもしれませーん。
それでは、お休みなさい。
