雰囲気から色を知る-色研究-
色に関する研究パート2になります。前回は実際にあるサイトからその色の関係性について勉強していきました。今回はSANKOU!さんのサイトの明るい、ポップなどのカテゴリーからでてくるサイトの全体をみてその関連をみていきたいと思います。
SANKOU!さんより:https://sankoudesign.com/
1.元気・楽しい・にぎやかな配色
1. 白の余白が少ない
2. トーンが高い。特に彩度
3. 文字が大きくゴシック系
4. カラフルで色の統一はトーンのみ
5. アニメーションが多い(動きが多い)(svg)
6. 白が浮く
7. フォームの形がさまざまある
8. 写真が多く使われている
9. ボタンにカーソルを当てると動いたり、色が変わったり
10. 色が5色以上使われている
11. 背景が薄いトーン、文字が高いトーン
12. 少なからず暖色が使われている(黄色、赤=明るい?)
2.健康的・ヘルシー・リラックス・フレッシュな配色
1. 白が多く使われている
2. 全体的に白、青(水色)、緑、黄緑の寒色系で薄い
3. 文字色も黒ではなく、少し灰色がかった色
4. 間隔、余白が通常のものよりが大きく取れれている
5. 文字が細い
6. グラデーションが多いかも?
7. 不透明度が薄い画像
8. 海や木が連想される
3.かわいい配色
1. ピンクや黄色、白が多く使われ薄い印象
2. 女性や子供、ゆるっとしたイラストが多く使われている
3. 文字色も薄い茶色黒が多く使われている
4. ゴシック系が多く、丸文字が多い。
5. 間隔と余白が大きい
6. 不透明度が多く使われている
7. トーンが低い
4.高級感がある配色
1. 黒っぽい赤、青など少しくすんでいる色が多い
2. オーソドックスに金色がちょっとしたところについている
3. 英語の文字が多く使われている
4. ゴシックより明朝体or英語
5. 文字の色が深めの黒色
6. 画像に黒いカバーがかけられている?
7. 余白や間隔が大きい
8. ふわっとしたアニメーション
5.強い・あざやか・ポップな配色
1. トーンが高い配色
2. 広い範囲でその色を使っているので、一目でこの色のイメージをつかられる
3. 文字色はパキッとした白、黒などの
4. 暖色が多いが、
5. 全体的にみて文字はゴシックが多いが珍しいフォントも多く使われいる
6. 丸いものよりカクカクとしたものが多い
7. 文字がすぐ目に入る(インパクト)
6.ダーク・重厚感のある配色
1. dk トーンを多く使われている
2. 黒の面積が大きい
3. 白の余白が少ない
4. 文字もパキッとした色
7.落ち着いた配色
1. 寒色を使ったものが多い(青、緑、茶色)
2. 色が全体的に薄く白い
3. 明朝体が多く使われる
4. 白の余白が多く使われている
5. 写真が一枚ドーンと乗っている
6. 四角など決まった形をしているものが多い
スタイリッシュ・知的な配色
1. 黒、青、白、灰色が使われていることが多い
2. トーンが基本的に低い(明度低い)
3. 文字がスタイリッシュで細い(英語が多い)
4. 文字が小さい
5. 写真が黒いカバーがかかってる
6. 写真が一番最初にでているしサイズが大きい
7. 金色のアクセントが多い
和・レトロな配色
1. 赤と黒が比較的多く使われている
2. dpやd、ltのトーンが多い
3. 特徴的なロゴか明朝体か使われている
4. 色がものすごく薄く繊細なものとものすごい濃ゆい配色の二択なものが多い
5. 様々な色を使われているサイトが多い
6. くすんだ色が多く、日本柄がよく使われている
奇抜・めずらしい・派手な配色
1. 必ずV(ビビット)トーンが使われている
2. 背景が何かしらの色(白は比較的に少ない)
3. トーンが統一された様々な色が使われている
4. 写真orイラストが大きく前面に使われている
5. ロゴor文字が特徴的
6. 白が使われることが少なく、使われているとしてもアクセント、文字の色として使われている