はじめに
動画での説明
よろしければサイト維持のためにチャンネル登録をよろしくお願いしますm(_ _)mモチベになっていますm(_ _)m
絵を描く方法の全体の体系
絵の基礎は「線(ドローイング)」、「光と陰影(ライティング)」、「色彩(カラーリング)」の3つの領域にあると仮定する。そしてこのシリーズは「色彩」の領域に属する。※体系に関する詳細は第一回を参照。
色彩学(英:Color Science):一般に、色の物理的性質・心理的影響・知覚・応用を体系的に研究する学問分野のこと。
※本記事シリーズでは、色を理解し、視覚的・心理的・文化的効果を意図的に操作できる能力を身につけることを目標とする。
このシリーズは「カラーアンドライト」を理解するための知識の獲得を目指している。
※光学や生理学だけではなく、塗料や物体の性質といった化学の知識、さらに心理学の知識もその射程となる。
今回学ぶ範囲はこのような図のイメージとなる。
記事の分割について
絵を描く場合の表色系の利用
ペイントソフトにおけるRGBやHSV、CMYKは表色系か?
たとえばクリップスタジオペイント(以降、クリスタと略)というペイントソフトでは、初期設定でカラーサークルがHSVに設定されている。カラーサークルをHLSに変更することもできる。
カラーサークルとは、「色相(色み)を円形に並べ、色を選択・変更するためのUI(ユーザーインターフェース)」のことである。このカラーサークルから色を選べば、その色をペンで使用することができる。
上の画像はクリスタのカラーサークルである。
絵を描く人はこのカラーサークルから直接色を選んだり、あるいはカラーパレットから色を選んだりする。
キャンバス上で色を調合して作る、ということもあるかもしれない。カラーサークルそのものが活用されない場合もある(パレットなどからでも色を切り替えられる)。
クリスタでは色を言語化(数量化)する場合、RGBが基本となっている。RGBの他にはHLS、HSVやCMYKの言語化も行うことができる。先程のカラーサークルで任意に選んだ色をRGB、HLS、CMYKの各言語で表現できるというわけだ。
まず、それぞれの用語を定義していこう。
デジタルRGBとはなにか、意味、定義、わかりやすく解説
##
デジタルRGB:赤(R)、緑(G)、青(B)の3つの光の強さを組み合わせる色表現方式のこと。R、G、Bそれぞれの値を調整して描画色を指定できる。クリスタではRGBはそれぞれ256段階(0~255)で光の強さが表されている。※デジタルという呼称は、他のRGBと区別するために今回使用している。
##
例:R=255、G=0、B=0なら赤、R=255、G=255、B=0なら黄色、R=0、G=0、B=0なら黒。255,0,0よりも100,0,0のほうが暗い赤である。
デジタルHLSとはなにか、意味、定義、わかりやすく解説
##
デジタルHLS:色を色相(H)、輝度(L)、彩度(S)の3つを組み合せる色表現方式のこと。H、L、Sそれぞれの値を調整して描画色を指定できる。クリスタではそれぞれ101段階(0~100)で光の強さが表されている。
##
HSV(HSBともいう)の場合は輝度(Luminance)の代わりに明度(Value,Brightness)が採用されている。ライトネスとバリューの違いは、今後の動画で詳しく扱う予定である。
##
デジタルCMYK:シアン(C)、マゼンタ(M)、イエロー(Y)、ブラック(K)の4色のインクの割合で組み合わせる色表現方式のこと。クリスタではCMYKはそれぞれ101段階(0~100)でインクの割合が近似的に表されている。
##
デジタルペイントにおけるRGBやHSV、CMYK表示は厳密に言うと「色空間」と呼ばれることが多く、「表色系」とは区別される。
たとえば「デジタル色彩マニュアル」では「一般に色彩学で言う表色系には含まれないことが多い」と説明されている。たしかにほかの色彩検定や色彩学の書籍でも、表色系として扱われているところを見たことがない。
ただし、RGBやHSV、CMYKも「色の分類」や「色空間」の機能をもつことから、表色系と表現することは可能である。
ほかの典型的な表色系との違いは「機器依存色」かどうかだろう。たとえばRGBが255,0,0という情報はそれ自体ではどんな色を想定しているのかわからない。高機能ディスプレイでは鮮やかな赤であり、低機能ディスプレイではより鈍い赤かもしれない。自分に見えている色と他の人に見えている色は同じではない(機器だけではなく部屋の明かりや色、角度なども関わる)。
一方で、CIE-XYZ表色系は特定のディスプレイやプリンターなどの機器に依存しない表色系である。これは、CIE-RGB表色系が、標準観察者が「3つの基準光をどの割合で混色すれば同じ色に見えるか」を表したものであり、その考え方を引き継いでCIE-XYZ表色系が作られたためである。
顕色系のマンセル表色系であっても「規定の環境で、特定の色票(アナログの紙)を基準にするもの」であり、機器に依存した体系ではない。
カラーマネジメントとガマットマッピング
RGB値は単体では色味がわからない
りんごの画像の任意の赤い部分をスポイトで吸い取ると、右の画像のように数値が表示される。クリップスタジオペイントの場合は、RGB、HSV、CMYKとして言語化(定量化)される。
そもそもスポイトで吸い取った「RGB値(195,19,27)」はどういう情報なのか。
RGB値はいわば「楽譜」で、ディスプレイは「楽器」であるといえる。安い楽器で素人がピアノを弾くのと、高い楽器でプロがピアノを弾くのとでは同じ楽譜でも聴こえ方がまるで違う。
さらに同じ楽器でも、周囲が騒がしかったり、聞き手の聴力が悪かったり、集中していないと聴こえ方が変わってくる。
安いディスプレイでは鈍い色だが、高いディスプレイでは鮮やかな色を出せるのである。同じ色情報でも違った見え方をするという点がポイントである。
同じディスプレイであってもPCの性能や設定、あるいは周りの光の性能、目の角度、ベゼルの色、心理的状況によって変わることがある。「色そのもの」が我々に届くのではなく、「色を包む関係・セット」が我々に届くのである。
色域とはなにか、意味、定義、わかりやすく解説
##
色域##(英:Color Gamut)##:ある色空間や機器が表現・再現できる色の範囲のこと。
##
たとえばAmazonで安い人気のモニターを探すと、「Dell SE2426H 23.8インチ モニター」が出てくる。ネットで取扱説明書を調べてみると、色域は「NTSC 72% (CIE 1931) (最小) 」と出てくる。NTSCは全米テレビジョンシステム委員会の略である。細かい説明を省くと、だいたいsRGBを100%表示できるくらいの色域である。
sRGBとはなにか、意味、定義、わかりやすく解説
##
sRGB##(英:Standard Red Green Blue)##:RGBの数値と実際に表示される色の対応関係を定めた標準的な色空間のこと。
##
さきほどのNTSC 72%は、sRGBをほぼ100%表示できるので、インターネットにあるほとんどの画像を正確に表示することができることになる(なぜならほとんどの画像はsRGB環境を想定しているため)。
しかし、インターネットにはより広い色域を指定した(カラープロファイルが埋め込まれた)画像が存在する。たとえばAdobe RGB(1998)がよくとりあげられる。ハイクラスのディスプレイでは「Adobe RGBカバー率99%」などと表示され、値段もNTSC 72%のディスプレイの数倍以上する。
色差の例
では、色差を見ていこう。
RGB(51,255,122)という色をsRGBとAdobe(1998)で近似的に比較した図がこちらである。(ただし、、私の環境では色差は小さく見える)。
さきほどのりんごの赤色を同じように比較するとこうなる。こちらはよりわかりやすい(明度や彩度が低いほうが差異がわかりやすくなる)。
たとえばクリップスタジオペイントでは初期のカラープロファイルがsRGBであり、Adobeのような広範囲の色域が前提とされていない。CMYKのようなより狭い色域も同様である。
最も普及している(廉価な)ディスプレイはsRGBの色域程度しかカバーできず、Adobeやmacをカバーしていない。自分のディスプレイがAdobeに対応しており、かつペイントソフトのカラープロファイルをAdobeに変えても、多くの人には違った色の見え方(より鈍い見え方)で届けられることになる。
そもそもなぜ「カラープロファイルを変えただけでsRGBとAdobeの色の表示が変わるのか」という疑問が生じる。
私のディスプレイはAdobeに対応していないが、クリスタでAdobeのカラープロファイルを変えたり、色の分析ソフトでAdobe表示をすると色が変わって見えるのはなぜか。
ガマットマッピングとはなにか、意味、定義、わかりやすく解説
##
ガマットマッピング##(英:Gamut Mapping)##:ある色空間で表現できる色を、別の色空間で表現できる範囲(ガマット)に収まるように変換する処理のこと。
##
例えば、Adobe RGBにはあるがsRGBにはない鮮やかな緑を、sRGBでも表示できるように少し彩度を下げて近い色へ変換する処理がガマットマッピングである。
カラーマネジメントとはなにか、意味、定義、わかりやすく解説
##
カラーマネジメント##(英:Color Managemen)##:媒体ごとに異なる色の表現を調整し、色をできるだけ一致させるための管理のこと。
##
たとえば家庭のプリンターでカラー印刷する場合、インクに備わっている色域を調べる必要がある。プリンターのCMYKの色域ではデジタルで作ったsRGBやAdobeRGBのカラープロファイルのデータを再現できないかもしれない。この場合、「自分が思っていた色とは違う色」で印刷される可能性が高い。
キャリブレーションとはなにか、意味、定義、わかりやすく解説
##
キャリブレーション##(英:Calibration)##:ディスプレイが表示する色を測定し、目標とする色にできるだけ一致するように調整すること。
##
パソコン側で色の出力を補正して、ディスプレイの表示を目標の色に近づける場合をソフトキャリブレーション、専用の測色器などの物理的な機器を使うことをハードキャリブレーションという。たとえばディスプレイの設定でsRGB表示、Adobe表示、mac表示などを近似、あるいは実際に表示できる。
たとえばクリップスタジオで保存した画像の詳細を見てみると、sRGBカラープロファイルが埋め込まれていることがわかる。Adobeで保存することもできる。もしカラープロファイルが埋め込まれていない場合、見る側の環境によって画像が表示され、ガマットマッピングは行われない。
AdobeRGBのディスプレイの人のために絵を描く場合、自分のディスプレイがsRGBだと十分に色の表示をチェックできない。ペイントソフトでカラープロファイルを変更し、ガマットマッピングによって色を近似しても限界がある。
印刷の場合も色によってはsRGBより広い色域がありうるため、近似にすぎない。しかし近似であっても、あらかじめ印刷用のカラープロファイルで絵を描き、印刷したほうが色差は少なくて済む。こうした作業をカラーマネジメントと呼ぶ。
表示可能な範囲で見え方が変更されているとは?
たとえば上の画像は私のsRGBのディスプレイにおいて、明確に違う色に見える。
同じRGB値なのに違って見えているのである。
しかしsRGBの範囲でしか色を表示できないディスプレイで、Adobe(1998)の色が表示されているとしたらおかしな話である。
実はクリップスタジオペイントのカラープロファイルの変更や色分析ツールの変更で「本来、表示不可能な色が見えている」のではない。ディスプレイの表示できる範囲内(この場合はsRGB)の中で最も近い色が代わりに表示されているのである。たとえるなら、普段セーブしてる力を解放しているイメージ。
たとえばsRGBよりもAdobeのほうが色域が鮮やかだとすれば、すこし彩度を上げて表示させるといった修正が行われるのである。
このことを証明する方法としては、(255,0,0)のような最大の明度と彩度をもった赤色で試すとわかりやすい。sRGBで表示させている255,0,0よりも高い明度や彩度はないため、修正を行うことは不可能であり、同じ色が表示されることになる。
画像分析ツールの説明でも、Adobe RGBではなくsRGBプロファイルを使って変換されている趣旨が記載されていた。
明度や彩度を適度に落とすと、明確に違いがわかるようになる。
つまり、sRGBでAdobeの色を表現(近似)できる範囲と、表現できない範囲があることになる。
上の画像のCMYKが一般的な印刷における色域だとすれば、sRGBでは表現できない範囲があることがわかる。
逆に、sRGBよりも広い範囲を表示できる色もある。
クリスタでカラープロファイルを変えて表示したものがこちらである。sRGBとAdobeの違いはわかりやすいが、CMYKとの違いはわかりにくい。色によって違うのだろう。
マンセル表色系
マンセル表色系とはなにか、意味、定義、わかりやすく解説
##
マンセル表色系葉##(英:Munsell Color System)##:「色を、色相・明度・彩度という3つの独立したものさしで測り、実際の色見本と見比べて記号(数字)で表す仕組み」のこと。
##
1905年、アメリカの美術教育者アルバート・マンセルが考案した。 ※詳細な説明はこの動画では行わない。明度や彩度の動画の後で扱う予定である。
マンセル表色系をたとえるならば、「色を住所のように表す方法」だといえる。「赤っぽい色」ではどこの住所かわからない。「日本に住んでいる」と言っているようなものである。
CIE-XYZのような混色系と違うのは、実際に人間の目で「色票」に再現可能な色のみを住所として設定している点である。架空の土地を設定したりすることも基本的にはない。
たとえば上のりんごの赤色は、マンセル値でいえばおよそ5R 4/12付近であると近似的に表現することができると仮定する。
もちろん、どの機器で表示されているかによって赤色の見え方が変わるので、固定的に変換することはできない(RGBやHSVはこの意味で住所とはいえず、定義を目的とする表色系に属さない)。
マンセル値の言語化の具体例を解説
「5R 4/12」とはどういう意味か。
- 5Rは色相であり、「どんな色か」を意味している。1Rや10Rなど、さまざまな色(住所)がほかにも存在する。
- 4は明度であり、「どれくらい明るいか」を意味している。理論上は0から10の尺度で定義されている。
- 12は彩度であり、「色の強み、鮮やかさ」を意味している。0から10ではなく、最大値は色によって異なる(現在は18程度)。
マンセルは色票として表現できる色のみを扱い、彩度も0から10ではないため、デコボコの色立体になる。
青系は彩度が全体的に低く、赤系は高いことがわかる。色相は10色相や、さらに分割された100色相が用いられることがある。右下の図は、5GYと5Bの比較である(彩度の最大値が違う)。
したがって、「5R 4/12」は「赤色相の中心付近で、少し暗く、非常に鮮やかな赤」であると言語化することができる。
ちなみにRGBでの表記は195,19,27で、HLSは357,42%,82%である。4割なので平均よりすこし暗く、8割なので平均よりだいぶ鮮やかだと直観的にわかる。
ただし、マンセルカラーを機器依存色(デバイスRGBやデバイスHLS)で完全に表現することは難しい。そもそもマンセルはディスプレイのような光源色ではなく物体色を基準としている。
ディスプレイの画像の色ではなく、絵の具の色や自然の色を言語化する場合は「マンセル色票」が適している。
もちろん絵の具や自然を「写真」で撮ってデジタル化し、色を調べる機器で近似的にマンセル値を獲得するという妥協も可能である。しかし原則的にはアナログの色票と目で比較し、言語化する必要があるといえる。
絵を描く人が学ぶべき表色系はどれか?
アナログで絵を完結させる場合
まず、デジタルかアナログのどちらをメインで活用するかによって変わってくるといえる。
アナログならば「マンセル表色系」や「PCCS表色系」を学ぶといいかもしれない。アナログの色票で色を見比べることが中心である。測色機で値を近似的に表示させてから、アナログの色票を見比べるという組み合わせもいいだろう。
もちろん、アナログで描いたものをパソコンに取り込んでデジタルデータ化する場合に、カラーマネジメントの知識が必要になることもある。
しかしCIE-XYZやL*a*b*がどういう仕組みかを本格的に学ぶ必要性は小さいと考える。たとえば我々のほとんどはパソコンがどういう仕組みで動いているか知らないが、パソコンを使えていれば十分であると考えている。同じように、「便利な変換ツールだ」という薄い理解で絵を描く人は十分だと考える。
マンセル表色系の場合は、「色を言語化するだけ」、「色を翻訳するだけ」という役割に留まらない。
明度とはなにか、彩度とはなにか、色相とはなにかといった基本的な理解を体系的に学ぶことができる。色相同士の関係から、補色や調和する色などを理解することもできる。紙に表現できる限界の物体色を踏まえて、色を設計できるようになる。
とはいえ、外出先で何百枚もの色票を持ち歩くわけにもいかず、ある程度絞った活用が必要になるだろう。
最初のうちは、マンセル色票でいうとどの色なのか、皆目見当がつかない場合があるかもしれない。
しかし自転車に乗るように、身体が色と言語の対応を自然と覚えてくることを期待することができる。机の上にあるりんごを見ただけで、「5R 4/12付近である」と予測することができるようになるかもしれない。そして、そのマンセル値を再現するためにはどのような色材(絵の具など)が必要なのかもすぐにわかるようになることを期待できる。
デジタルで絵を完結させる場合
デジタルの場合はデジタルRGB、HSV、CMYKといった色空間をまずは把握すると色を言語化しやすくなるといえる。
デジタルRGB(機器依存色)は各数値が0から255であり、0から100の割合で直観的に把握しにくい。
たとえば195が0から100でいうとどの程度かすぐに答えられるだろうか。正解は≒76%である。その点、HSVやHLS表記の場合は0から100で表示されるので直観的にわかりやすい。
RGB、HLS、HSV、CMYKはデジタル上では変換可能になっており、RGBの値がわかればHSVの値も同時に分かる。
たとえばRGBが195,19,27の場合、HLSは357,42%,82%であり、HSVは357,90%,76%である。HLSだと明るさが42%なのに対し、HSVだと明るさが76%である。
※明るさの度合いが違うのは両者の明るさの概念が違うためである。HSVは単純に195/255で計算し、HLSは((195+19)/2)/255で計算する。その理由は別の動画で扱う。
いずれにせよデジタル色空間を把握することで、色相、彩度、明るさを数値によってコントロールすることが可能になる。
しかしこれらの色空間だけでは、「どのようにコントロールしたらいいか」、「どのような色が調和するか」を把握することはできない。また、簡易的な数値以上の細かい色のコントロールをすることはできない。コントロールの仕方のヒントとして、マンセルやPCCSはデジタルで絵を描く場合も参考になる。
便利なデジタルツール
デジタル上でマンセルやPCCSそのものの色は扱えないが、近似の色(ディスプレイごとの性能で限界があり、ディスプレイという特性上のそもそもの限界もあるが)を扱うことはできる。
たとえばマンセルやPCCSで使いたい色の組み合わせを考え、それに近いデジタル上の色を選択する使い方である。マンセルやPCCSの色はRGBやHSVで近似的に変換できるツール(今回使っているのはBable color)もある。
ツールで調べると、RGB195,19,27(sRGB環境)のマンセル近似は7.5R 4/16と出てきた。※ほとんど同じ色に見えるが、これはsRGBディスプレイの限界によるものである。実際の色差はΔ3.04と出ている。3以上が許容範囲を超えるイメージ。
7.5R 4/18をRGBへより近似するような色を探すために逆に変換し直してみると、195,0,23と出る。色差は0.48に変化している。※分析は簡易的な近似
たとえばあるサイト(https://artistpigments.org)では、マンセル色票をデジタルで近似した一覧を公開している。
ディスプレイで明確に再現できないような色は空白になっている。ただし、空白になったものは右側に近似の色が提示してある。
結局、両方学んだほうが勉強になる(比重を気にすればいい)
まず、「7.5R 4/18をりんごの色に使いたい」というように、先にマンセル色票で選び、色彩設計を行う。次に、デジタルではデジタルRGBにおいて195,0,23に近似的に変換させ、どのような発色なのかを確認するという手順を考えてみる。
しかし、色そのものだけを選ぶのなら、最初からwebサイトの「近似マンセルデジタル色票」のようなものを見たほうが早い。わざわざアナログのマンセル色票を経由する理由は小さい。マンセル以外にも使いやすい色空間があるかもしれない。
したがって、デジタルでイラストを描き、デジタルで公開する場合にアナログのマンセル色票を目で見て確認したりする必要性は小さい。
マンセルの体系を把握したり、マンセル基準の明度や彩度のスケールを用いたい場合であっても、デジタルで完結するならばアナログのマンセル色票をわざわざ使う理由はない。デジタルで近似されたマンセルの体系を使えばいいからである。
もちろん、デジタルからアナログへの変換や、アナログのみで絵を描く場合はアナログの実物であるマンセル色票やPCCS色票を見ながら作業する必要がある。
マンセル色票に近い絵の具を調べたり、調合したりするといったことが可能になる。
まとめると上の図のようになる。
さいごに
次回の予定
次回はおそらく「有彩色・無彩色」を扱う予定。
参考文献
基礎本
ベティ・エドワーズ 「色彩・配色・混色: 美しい配色と混色のテクニックをマスターする」
ベティ・エドワーズ 「色彩・配色・混色: 美しい配色と混色のテクニックをマスターする」
・初心者にもわかりやすい平明な言葉で説明されており、ドローイングとの関わりを特に重視している書籍。初心者ならこれを買っておけば間違いない。
千々岩 英彰「色彩学概説」
・初心者にはわかりにくい難しい言葉で説明されているが、科学的な説明であり、体系的で網羅的な説明がされている良書。ドローイングのためという限定的な目的ではないが、色彩学を単なるハウツーではなく学問として学びたい人には必須の本であると言える。
上級者向け
ジェームス・ガーニー「カラー&ライト ~リアリズムのための色彩と光の描き方~」
ジェームス・ガーニー「カラー&ライト ~リアリズムのための色彩と光の描き方~」
・色彩学の基礎を一通り理解したうえで、美しい絵や個性的な絵、限定的な絵をよりもっと上達させたい人に向いている。色の扱いだけではなく、光の扱いにも言及されている有名な書籍である。この記事シリーズでは、この書籍の理解を中間的な目標として目指している。
ジョセフ・アルバース「配色の設計 ―色の知覚と相互作用 Interaction of Color」
ジョセフ・アルバース「配色の設計 ―色の知覚と相互作用 Interaction of Color」
理論の説明ではなく、実践に特化した本。まずは塗ったり、見たり、触ったりして覚えるという手法をとっている。私の記事シリーズとは方向性が違うが、しかし絵を描く人にとっては良書だといえる。
「色彩用語事典」
・あったら便利だろう。とはいえ、現代ではネットで探したほうが早いかもしれない。
使用している汎用書籍
「対策色彩検定カラ-コ-ディネ-タ-検定 (2級・3級)」,新紀元社
「対策色彩検定カラ-コ-ディネ-タ-検定 (2級・3級)」,新紀元社
小林嗣幸「理・美容の造形と色彩」





























コメント