ホーム > Web > ブラウザで色彩感覚をつけよう!ゲームで学べる色の基本「Color — Method of Action」

ブラウザで色彩感覚をつけよう!ゲームで学べる色の基本「Color — Method of Action」

Color — Method of Action

703(@hmd703)さんがやってらっしゃったので遊んでみたらおもしろかったのでご紹介。

以前紹介した『欧文書体のカーニング(文字詰め)をゲームで学べる「Kern Type, the kerning game」』や、『欧文書体の形をベジェ曲線で学べるゲーム「Shape Type, the letter shaping game」』と同じように、デザインする上で知っておくほうがいいことをブラウザでできちゃうサイトの「色」バージョンと言ってもいいでしょう。

ではスタート。
円の中央をクリックするか、サイト下部からカテゴリーを選んでスタート。円の中央をクリックしてスタートすると、下部カテゴリー左から順に進んでいきます。

・hue(色相)
Color — Method of Action
グラデーションの円弧(色相環:color circle)の中央に色のついた円が現れ、どんどん欠けていきます。これがカウントダウンで、円がなくなるまでに、その円の色と同じ色を外周の円弧から探し出し、クリックすればOK。
Color — Method of Action
同じような色になると、中央の円の色とその外側の選択色が似てきます。

・saturation(飽和)
Color — Method of Action
次は飽和色。彩度を見極めます。ここから色相環に彩度が加わります。中央ほど彩度がなくなっています。

・complimentary(補色)
Color — Method of Action
ある色と、色相環上で正反対の位置に来る色(補色)を探し出します。

・analogous(類似色)
Color — Method of Action
ある色と、色相環上で隣に来る色。両隣のお家のイメージですかね。赤-オレンジ-黄色のような。お隣同士なので色合いとしても仲がいいわけです。

・ternary(三色)
Color — Method of Action
ある色と、色相環上で中央から120度ずつの角度にある計3つの色を探します。

・quaternary(四色)
Color — Method of Action
ある色と、色相環上で中央から90度ずつの角度にある計4つの色を探します。

色の数が多くなると難しいと思いがちですが、どれか1色に限定して探せばおのずと角度が連動しているので探しやすいです。

カテゴリーに5問ずつ出題され、最後に点数が表示されます。高得点を取ったからって色彩検定に合格するってことでもないですが、これで遊ぶことで、配色や色彩バランスを頭の中で想像しやすくなるのではないでしょうか。絶対色感欲しいですねぇ。

→Color — Method of Action
http://color.method.ac/
※すいませんリンク間違ってました

  • 2012-01-26 (木) 10:33
  • Web

ホーム > Web > ブラウザで色彩感覚をつけよう!ゲームで学べる色の基本「Color — Method of Action」

検索
Popular Entries
Recent Entries
Recent Comments
タグクラウド
ページ
フィード
 subscribe to my RSS
follow us in feedly
このブログをはてなブックマークに追加
Add to Google
My Yahoo!に追加
Subscribe with livedoor Reader
Add goo
Subscribe with Bloglines
メタ情報

Return to page top