あいべや日記

"東大生2人と共に、3人でWebサービスを作りながらルームシェアしませんか!?"という、とあるサイトへの投稿から始まった物語

配色・デザインの際に参考にしたいサイト8選

 

 

こんにちは、ibeyaの響です。

昨日は週末ということで、ibeyaでは大量の食材を買い込んで、調理の下ごしらえを皆でしました。

 

千切りの量が多過ぎて多過ぎて…

f:id:i3juhima:20140615084241j:plain

 

とうとう千切り機の導入が決定しました!!!



ということで、料理の下ごしらえの後のMTGにて、昨日はデザインについて話し合ったので、参考にさせていただいたサイトをこちらで紹介したいと思います。

 

それでは、さっそくいってみましょう!!



今回は大きく分けて、

  1. 配色の基礎知識を学べるもの

  2. 配色・デザインの参考となるサイト

  3. 配色に使えるツール

 

の3つを使わせていただきました。

 

 

1.配色の基礎知識を学べるもの

 

ノンデザイナーの「デザインの判断」はとりあえずコレだけ押さえよう

こちらは、デザインで重要なこと、フォントの選び方から、配色の基礎、写真の選び方までを、ざっと一通り学べます。スライド33枚なので、全体概観を掴むのに良かったです。

 



ノンデザイナーのための配色理論

配色についてもう少し理論的に知りたいな、と思ってこちらを参考にさせていただきました。色の仕組みに基づき、なぜ配色に失敗してしまうのか、という解説から入り、色相・彩度・明度の説明や活用の仕方が丁寧に説明されています。




Webデザイナーのための配色セオリー

こちらも配色について詳しく説明してくれています。色の役割、どんな印象を持った色なのか、等についても触れられているので、こちらも非常に参考になりました。




 

2.配色・デザインの参考になるサイト

 

クリエイターボックス「カテゴリー別アイデア100」

f:id:i3juhima:20140615085105p:plain

 子ども向け、女の子向け、などカテゴリーごとに配色パターンを複数提示してくれています。

 

 

 

COLOURlovers

f:id:i3juhima:20140615085134p:plain

色をテーマにしたコミュニティサイトで、ユーザーが自分のお気に入り配色パターンを登録したり、保存しておいたりすることができるサイトです。色んなパターンが見れるので参考になりました。




Dribbble

f:id:i3juhima:20140615085212p:plain

 こちらは、デザイナーがデザインを投稿するサイト。検索も用いて幅広い様々なデザインを見ることができるので、参考になります。





3.配色に使えるツール

 

ウェブ配色ツール Ver.2.0

f:id:i3juhima:20140615085258p:plain

テーマカラーを選ぶと、配色を自動で提案してくれる、という便利なツールです。左側に、リアルタイムで提案された配色が見れるので、イメージが湧きやすいです。



 

配色の見本帳

f:id:i3juhima:20140615085340p:plain

こちらは、上記のものよりやや上級者向け?

メインカラーを選択すると、色相・彩度・明度それぞれについての配色パターンの提案が出されます。こちらも便利です。








以上、僕らが参考にさせていただいたサイトをご紹介した。

いやー、デザインを複数人で決定するのはなかなか難しいですね…

 

いづれはデザイナーも探して一緒に取り組んでいきたいかもな、と考えた一日でした。

でも、デザインって面白そう!!とも思った一日でした。