原カバンは鞄のお店ではありません。

Unityを使ったゲーム制作のあれこれを綴っていきます。

【ゲーム制作Tips】トーンを考慮してゲーム画面を配色する

ティアキンやっている人にしか分からない

Lキーを押してマップを開いてる人類はいないと思う皆さんこんにちは。ついでにカメラもamiiboも使うことはないのでLキーメニューから外してもらうと助かります。ウルトラハンド使おうとしてカメラで撮影しちゃう事が多々あります。

 

W.T.

前回の記事でもお伝えしましたが一人称視点の3D脱出ゲーム「W.T.」のストアページを開設しています。

store.steampowered.com

四則演算や数式を解くというより、数学的なセンスを使って謎を解くことをコンセプトにしたゲームなので、適当にガチャガチャしても(多少時間が掛かるけど)解けるようになっており、誰でも楽しんで頂けると思います。
アーリーアクセス版を今月中にリリース予定ですので、ウィッシュリストへの登録をお願いします

 

トーン

今年初回の記事で色の三属性(色相、明度、彩度)について取り上げて、その中では同じ色でも明度、彩度を変えることで印象が大きく変わる、という事を紹介させてもらいました。

www.karvan1230.com

色の三属性を考慮することはゲーム画面をデザインする上で重要な要素ですが、デザイン畑ではない人間からすると自分のイメージに合わせて明度、彩度をどのように変えれば良いのか分かりません。
そういったときに指標として使えるのが「トーン(色調)」という概念です。

トーンとは「明度」と「彩度」を融合した概念で、これを用いることで色を「色相」と「トーン」の二属性で表し、体系化されたカラーシステムを作ることができます。
代表的な物にはPCCSというカラーシステムがあり、「明度」と「彩度」を軸にした二次元平面をいくつかの領域に分割し、各領域毎に色相環を配置して色票図を作ることで初心者にもわかりやすい配色体系となっています。

この図は上が高明度、下が低明度、右が高彩度、左が低彩度となっていて幾つかの領域に分割されています。各領域にはそれぞれ色調(=トーン)を表す名前が割り当てられていて、その中の色相環は12分割されて色を表示しています

このPCCSを使った配色法は良く知られており、多くの種類が存在しますが、今回はその中でも代表的な手法をつかってゲーム画面の配色を考えてみたいと思います。

 

PCCSを使った配色

ゲームの中でも最も「配色」の効力が発揮されるのはタイトル画面、メニュー画面だと思います。
2Dゲーム、3Dゲームに関わらず画面の大部分をImageやUIで占め、且つ大きな変化が起こらないので、画面の配色の印象がそのままダイレクトに伝わります。
なので、今回は以下のような仮のタイトル画面を使って様々な配色法で色を当てはめていきたいと思います。
ちなみに下の画面はメインカラー、サブカラー、アクセントカラーの三色で構成されています。

 

■ドミナント・カラー配色

12分割された色相環の中から一つ色を選び、同じ色相を異なるトーンから選ぶ手法です。
例えば「色相環の6番目の色」と決めたら、それぞれのトーン中から「色相環の6番目の色」をピックアップして配色します。

同じ色相でまとめて、明度、彩度で変化を付ける為、色が持つ雰囲気を表現しやすい手法です。

 

■ドミナント・トーン配色

トーンを一つ選び、その中の色相環から色を選ぶ手法です。同じトーンでまとめて、カラー(色相)で変化を付けます。

トーンの持つイメージを強く印象付ける配色です。色相が異なりますが明度、彩度が同じであるため、派手になりすぎず個性も出せる手法です。

 

■トーナル配色

ドミナント・トーン配色から派生した手法で、ダルトーンとその周辺のトーン(ソフト・ライトグレイッシュ・グレイッシュ)の中からトーンを選び、色相は自由に選択します。

中明度、低彩度の中間色同士で構成するため、渋く落ち着いたイメージを与えやすい配色です。

 

■カマイユ配色

ドミナント・カラー配色とドミナント・トーン配色の合わせ技のような配色法で、トーンも色相も隣接したものを選びます。
PCCSで色相差が1以内で、トーンも同じか隣のトーンを選択します。

ほぼ同じ色相、色調で統一され、優しい味わいのある配色になります。

 

最後に

配色技法は調べてみると沢山ありますが、トーンを使った配色は私のような初心者でも手の出しやすい配色技法だと思います。
配色技法をうまく活用できれば、意図した印象を与えることができ、ゲームの絵作りに悩む量を減らす事ができます。

 

まぁ、配色に関しては技法を勉強せずとも配色パターン集などが数多く出版されているので、そちらを参考にしても良いですが。

◇プライバシーポリシー

●個人情報の利用目的

当ブログでは、メールでのお問い合わせ、メールマガジンへの登録などの際に、名前(ハンドルネーム)、メールアドレス等の個人情報をご登録いただく場合がございます。

これらの個人情報は質問に対する回答や必要な情報を電子メールなどをでご連絡する場合に利用させていただくものであり、個人情報をご提供いただく際の目的以外では利用いたしません。

●個人情報の第三者への開示

当サイトでは、個人情報は適切に管理し、以下に該当する場合を除いて第三者に開示することはありません。

・本人のご了解がある場合
・法令等への協力のため、開示が必要となる場合

個人情報の開示、訂正、追加、削除、利用停止
ご本人からの個人データの開示、訂正、追加、削除、利用停止のご希望の場合には、ご本人であることを確認させていただいた上、速やかに対応させていただきます。

アクセス解析ツールについて

当サイトでは、Googleによるアクセス解析ツール「Googleアナリティクス」を利用しています。

このGoogleアナリティクスはトラフィックデータの収集のためにCookieを使用しています。このトラフィックデータは匿名で収集されており、個人を特定するものではありません。
この機能はCookieを無効にすることで収集を拒否することが出来ますので、お使いのブラウザの設定をご確認ください。

●免責事項

当サイトからリンクやバナーなどによって他のサイトに移動された場合、移動先サイトで提供される情報、サービス等について一切の責任を負いません。

当サイトのコンテンツ・情報につきまして、可能な限り正確な情報を掲載するよう努めておりますが、誤情報が入り込んだり、情報が古くなっていることもございます。

当サイトに掲載された内容によって生じた損害等の一切の責任を負いかねますのでご了承ください。

●プライバシーポリシーの変更について

当サイトは、個人情報に関して適用される日本の法令を遵守するとともに、本ポリシーの内容を適宜見直しその改善に努めます。

修正された最新のプライバシーポリシーは常に本ページにて開示されます。