※回答一覧

 出題者   カテゴリ   作成日

高嶋仁
デザイン担当 2015-06-28 23:24:34
 問題   ヒント   回答数 
■かっこよくおしゃれに見せる配色の考え方

ウェブサイトの見た目は配色次第で魅力的なものにもつまらない物にもなります。
古くより配色にはセオリーが色々ありますが、セオリー通りに配色してもカッコ良くならなかったり、イメージと違う物になったりした事はありませんか?

今回はどのように配色を考えていくとかっこいいWebデザインができるかを考えてみたいと思います。

Q1. 配色を考える時にまず何から考えますか?

1.コーポレートカラー、またはブランドカラーが決まっているのでその色を中心に考える。
2.はじめにキーになる色を1色感で決めてそこから他の色を考える。
3.各ページ、各商品にそれぞれ合ったカラーを探して決めている。
4.自分の感覚のみで決めている。
5.その他

Q2. 配色を決めるときはどうやってカラーを探しますか?

1.配色ツール(たとえば、http://www.color-fortuna.com/color_scheme_genelator2/)を使っている。
2.かっこいいサイトを参考にして色をとっている。
3.カラーコードのサイト(たとえば、http://www.colordic.org/)から色を選んでいる。
4.キーカラーの近似色や補色を探す。
5.その他

Q3. 配色を考えるのはどのくらいの時間をかけますか?また納得いかない場合には、納得するまで配色を考えますか?それともコンテンツを作り、そのあとで再度配色を見直しますか?
7

 

メンバーの回答一覧 お疲れ様でした!
※講師コメント詳細は冊子に掲載されています。

なるほど
票数
回答 講師コメント
0 丸田
制作に携わっていないのであれですが、もしやるならばこうする、という仮説で答えてみます。

Q1.
1.コーポレートカラー、またはブランドカラーが決まっているのでその色を中心に考える。
サイトの目的が第一なので、それを達成するためにはどんな色調がいいか?をまず考えると思います。
その上でコーポレートカラーを活かすことを考えると思います。
※スペシャルサイトやランディングページの場合は目的第一に考えます。

Q2.
1.配色ツール(たとえば、http://www.color-fortuna.com/color_scheme_genelator2/)を使っている。
3.カラーコードのサイト(たとえば、http://www.colordic.org/)から色を選んでいる。

Q3. 色とコンテンツのバランスが調和していることが理想的だと思うので、
行き詰まったらコンテンツを作り、そのあとで再度配色を見直す を繰り返すと思います。
 (高嶋仁)
A1. まったくその通りです。サイトの目的に沿った配色が何よりです。 A2. 配色の組み合わせは無数にありますのでツールや配色サンプルなどを参考にする事で感覚のみで配色を行うよりもグンと幅が広がります。 A3. レイアウトとの兼ね合いを考えながら配色も最後まで微調整していくのが理想的ですね。

0 たけ
■ Q1. 配色を考える時にまず何から考えますか?

> 1.コーポレートカラー、またはブランドカラーが決まっているのでその色を中心に考える。

日頃、この1番のやり方で配色を考えています。


■ Q2. 配色を決めるときはどうやってカラーを探しますか?

> 1.配色ツール(たとえば、http://www.color-fortuna.com/color_scheme_genelator2/)を使っている。
> 4.キーカラーの近似色や補色を探す。

キーカラーをQ1の方法で決めた後、配色ツール(1番)を探したり、
カラーチャートで近似色や補色を探しています。(4番)

理由は、ツールは便利なのですが、それだけだと画面に落とした時に、違和感のある配色になる事もあるなと感じています。なので、自分で近似色や補色も探してみて、それらの中から選んだり組み合わせたりしています。


■ Q3. 配色を考えるのはどのくらいの時間をかけますか?また納得いかない場合には、納得するまで配色を考えますか?それともコンテンツを作り、そのあとで再度配色を見直しますか?

時間について:
普段はサイト全体ではなく、LPやバナーレベルの制作が多いからかもしれませんが、そんなにかかりません。かかっても30分程で決めています。

納得いかない時について:
前提として、自分の場合は、コンテンツがきまった上で制作する事が多いです。その上で、配色が納得いかない時は、自分でも考えますが、目が慣れてしまっている事もあるので、社内の他のメンバーに意見を求めています。まだあまりそのデザインを目にしてない人の印象は、歪みが少なく、これで最適解が見つかることが多いなぁと思っています。
 (高嶋仁)
A1. コーポレートカラーやブランドカラーが決まっているときは余程の意味合いがなければ他の色をキーカラーに持って来る必要はありません。 A2. 補色はPCのディスプレイの特性上、近くに置くと干渉(チラついて見える)を起こしやすいのでウェブデザインではわざと色相をずらす事もあります。どれだけ色相をずらすかは実際にチラつきのない値を目で確かめるしかありません。 A3. 目が慣れてしまうのは配色に限らずデザイン全般で良く起こりますね。第三者の意見はとても大切です。

0 yukko
Q1. 配色を考える時にまず何から考えますか?
1.コーポレートカラー、またはブランドカラーが決まっているのでその色を中心に考える。
3.各ページ、各商品にそれぞれ合ったカラーを探して決めている。


Q2. 配色を決めるときはどうやってカラーを探しますか?
4.キーカラーの近似色や補色を探す。


Q3. 配色を考えるのはどのくらいの時間をかけますか?また納得いかない場合には、納得するまで配色を考えますか?それともコンテンツを作り、そのあとで再度配色を見直しますか?

配色を考える時間はページの内容に依存しますが、基本的にはページの目的に時間をかけていますので、目的さえ決まってしまえば配色には時間がかかりません。企業の中で仕事をしているので、限られた時間の中で時には妥協することもあるというのが本音です。どちらかというとコンテンツを作ってそのコンテンツの目的が生かし切れない配色になってしまっていたならば再度配色を見直すという方法を取っています。
 (高嶋仁)
A1. カラーを特徴としている商品を見せたい場合はブランドカラーを無視してしまってもいいでしょう。ただし、ブランドよりも商品そのものを全面に出す場合に限ります。 A2. 補色と近似色だけでも十分見せられる配色が出来上がります。補色1色と後は近似色、無彩色(白、黒、グレー)のみで簡単かつ十分にかっこ良い配色が成立します。 A3. これは持論ですが、商業デザインは妥協の連続だと思います。美を求めるわけではありませんので限られた時間の中で今、自分が出来る最善の事を提供する。これで良いと思っています。

0 ロンチ
Q1. 配色を考える時にまず何から考えますか?
1.コーポレートカラー、またはブランドカラーが決まっているのでその色を中心に考える。
→基本的には無難なところとして、ブランドカラーをもとに配色を決めています。
ただ、コンテンツにテーマはあるかと思いますので、そのテーマとコーポレートカラーがどうしても
則さない場合は、あえて外してクライアントにはきちんと説明をしています。

Q2. 配色を決めるときはどうやってカラーを探しますか?
4.キーカラーの近似色や補色を探す
→コーポレートカラーやテーマに則したカラー(軸となるカラー)から合うカラーを探します。

Q3. 配色を考えるのはどのくらいの時間をかけますか?また納得いかない場合には、納得するまで配色を考えますか?それともコンテンツを作り、そのあとで再度配色を見直しますか?
→まずはコンテンツを作り、基本色以外のカラーは後から加えていきます。
カラーを選ぶのはレイアウトや装飾を考える以上に時間がかかると思っています。
こだわるとどこまでもこだわってしまうので、正直時間が読めないため
一番最後に持ってきて、許される時間の中で納得いく配色を見つけていくようなやり方をしています。
 (高嶋仁)
A1. ブランドカラーをとるか商品イメージをとるか難しい所ですね。でも商品のカラー自体が特徴を示す物でしたら無理にブランドカラーを使う事は無いと思います。また、コーポレートカラーの定義について一歩踏み込んだ解答に「金」をつけました。 A2. キーカラー選びのポイントはテーマや商品に必ずあります。キーカラーさえ見つければ配色はほぼ出来たも同然ですね。 A3. 僕の場合ですが、企画段階からカラーを決めて取りかかります。時間のかかる事は先に悩んでおく事を優先すると後がスームズに進行しますので。これは性格の問題ですけどね。

0 SUGIMOTO
Q1. 配色を考える時にまず何から考えますか?
クライアントからコーポレートカラー、ブランドカラーの指定があれば(1)で、それを中心に考えますが、中小企業さんはなかなかそれを固めてる所は少ないので、ロゴがあればそのロゴから、それがなければ、ヒアリングして(2)のキーになる1色をクライアントと一緒に決めます。

Q2. 配色を決めるときはどうやってカラーを探しますか?
(1)などの配色ツールを使って大体のスケールを決めます。

Q3. 配色を考えるのはどのくらいの時間をかけますか?また納得いかない場合には、納得するまで配色を考えますか?それともコンテンツを作り、そのあとで再度配色を見直しますか?
クライアントとのヒアリングで決めた色を中心に一度自分の直感で決めます。
そしてコンテンツを作った後で、配色を見直します。
 (高嶋仁)
A1. コーポレートカラーを持っていない企業さんも多いのでそうなって来ますね。そんなときはコーポレートカラーを提案してしまうのはアリですね。コーポレートカラーをクライアントさんと決めるという所に金をつけました。 A2. 大体のカラーを選ぶのに配色ツールは大変便利です。自分の感覚以外の要素を取り入れる事も大切ですので。 A3. 直感で決めなくてはいけない部分がやはりありますが、見直す事が何より大切ですね。

0 chichichi
Q1. 1・3。まずサイト全体のデザインや配色から浮かないよう、なるべく同様の色・色使いを心がけます。そして、商品ごとにデザインを変えるなら、商品のイメージやロゴ等からも考えます。

Q2. 1・2・4。ただ、ツールを使うと手間だったり、決め辛かったりするので、4のようにphotoshop等で済ませてしまいます。
また、2のようにサイトを見たり、キャプチャーを取り、テイストに合う配色が分かってくると迷いが減りそうだと感じています(大したことはできていませんが…)。

Q3. 考え過ぎないようにはしていますが、もしわからなくなった場合、次の日等に考えます。「まずはモノトーンで考える」といった考え方を知ってから、決めやすくなってきました。
一度ある程度の配色までできたら、まずページを作ってみてから手直しします。
 (高嶋仁)
A1. 余り色数を増やさない。これが何より簡単です。色数が増えれば増えるほど、重要な要素が目立たせにくくなります。また、同様の色を使う事が簡単でありながら違和感なく商品を際立たせる事が出来ます。 A2. 日頃からかっこ良いなと思うサイトはブックマークしておくと、いざ配色しよう!と思ったときに何かと役にたちます。 A3. 一晩寝かすことは僕も良くやります。デザインをしていると「これは良い!」と思ってもそのときはテンションが上がっていてそう思うだけで次の日、冷静な視点で見るとまた違って見えてくる事があります。

0 kamino
Q1.
1.コーポレートカラー、またはブランドカラーが決まっているのでその色を中心に考える

Q2.
4.キーカラーの近似色や補色を探す

Q3.
配色は悩もうと思えば何時間でも悩めてしまいますので、あまり時間をかけないようにしています。
かけても30分ぐらいでしょうか。
配色で悩んだらいったんその仕事はやめたり、日にちをおいてみたりします。
いろいろ試してそうこうしているとピンとくる配色に出会うことがありますので、いつもそんな感じでやっています。
配色ツールを使うといいのかもしれませんが、かえって時間がかかる印象があるので使ったことはありません。
 (高嶋仁)
A1. 元々決まっている色がある場合は楽に配色できますね。何か一つ基準があるのとないのとでは大違いです。 A2. 補色をアクセントカラーとして使う場合は極力キーカラーの脇役として少ない面積でつかう事がポイントです。補色を使い過ぎてどの色がキーカラーかわからなくなってしまっては意味がありません。 A3. 配色ツールに全てを任せるのは難しいとしても参考としてパラパラと見てみるのは、「こんな組み合わせもあるんだ」と発見出来て面白いです。