Color Scheme

画像から配色パターンを分析するプログラムを作ってみました。

学生をしていた頃のことですがアメリカの美術大学の色彩のクラスでカラースキームというものを習いました。カラースキームとは色の持つ心理的な性質を利用して雰囲気をつくる色彩設計といったところです。

今でも印象に残っているのは先生が「いい絵は必ず配色パターンを守っている」と昔の名画等を例に説明をしてくれたことでした。無意識に何となくいいなと思わせる絵はしっかり色の設計がなされているものなんだなと思いました。

そしてそんな風に絵の背景にある配色パターンを視覚化できたらいいなと思いプログラムに取り組んでみました。

 

カラーウィール

カラーウィールとは片側が暖色に、反対側が寒色になっている色相環チャートです。実はひとつだけではなく色々と種類があるのですがプログラムではRGBとRYBを使うことにしました。

 

RGBカラーウィール

デジタルではおなじみの光の三原色(赤、緑、青)をもとにしたカラーウィールです。一般的に広く利用されているのはこのカラーウィールだろうと思います。

 

RYBカラーウィール

赤と青と黄色を原色とした伝統的なカラーモデルで、近代の科学的な色彩理論に先立つものです。今でも絵画や美術教育の現場で使われています。自分もこのカラーウィールで習いました。RGBカラーウィールと比べると赤から黄色までの幅が広いですね。画像処理のソフトウェアでもTraditional Color Wheelといった名前で用意されていたりします。

 

カラースキーム

代表的なカラースキームを紹介していきます。色彩や油彩の授業ではRYBカラーウィールを使って色を習ったのでRYBをもとに説明していきます。

Analogous Color Scheme

隣り合った色を組み合わせる配色です。色相の差がないので目に優しいグラデーションの構成になります。

画像例。黄色からオレンジ、緑色のグラデーション。調和が取れた配色ですね。

 

Complimentary Color Scheme

反対側にある色を使った配色です。暖色と寒色のコントラストのある引き締まった配色になります。

画像例。赤い花に緑色の背景を置くことで赤がさらに赤く見えます。

 

Split-Complimentary Color Scheme

Complimentary Color Schemeとの違いは反対色の隣りの色を使うことでコントラストを和らげています。

画像例。黄緑色の背景に紫や赤がちりばめられています。

その他にもTriadicやSquare等といったパターンがあります。余談ですが個人的にはSplit-Complimentaryが好きな配色パターンです。絵を描くときは完全にチャート通りの配色にするのではなくAnalogousで大まかな色を埋めた後に適度に幅のある反対色をちりばめていくというパターンを好んで使っています。

 

プログラム

WPFを使って上記の要素をプログラムに実装してみました。カラーウィールはRYBとRGBを用意しました。ウィールによって結果の分布は変わりますね。分布は中央ほど彩度が低く、外側ほど彩度が高くなるようにしています。

 

画像から抽出したカラーパレットをカラーウィール内に配置し、用意した各カラースキームと分布がどれだけ近いかを計算して近いパターンから順番に並べています。

 

また少し歪めたカラースキームのパターンも用意しました。青とオレンジは補色の関係ですが、感覚的には水色もオレンジの補色だと思うので厳密に比較せずにパターンの形を歪めて幅を広くもたせています。

プログラムを使ってみたいという方は以下のリンクからどうぞ。画像をドラッグ&ドロップすると結果が表示されます。(あくまで試作プログラムなので精度は期待しないでください)

ダウンロードはこちら

 

今後の課題

色の分布を12色に分けて計算していますが、もう少し曖昧でもいいのかなと思っています。なかなか思うような結果になってくれませんが、きっちりパターンに当てはめていくのも無理があるのかもしれませんね。この辺は機械と人間の目の違いもあるかもしれません。

 

開発環境:VIsual Studio Community 2017, WPF

広告

コメントを残す

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト /  変更 )

Google フォト

Google アカウントを使ってコメントしています。 ログアウト /  変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト /  変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト /  変更 )

%s と連携中