こんにちは。LIGでデザイナーをしています、マチルダです。
前回、「黄色をキーカラーにした配色のWebサイトデザインまとめ」を記事にしましたが、カラーを切り口に色んなサイトを見ることは勉強になるなあ・・・と感じたので、今後も不定期でシリーズとしてご紹介したいな、と思っております＾＾
今回は、ピンク色をキーカラーにしたサイトを印象別にご紹介いたします！
ピンク色ってどんな色？
柔らかく優しい印象をもつ桃色は女性的なイメージが強くあります。心や体に満ち足りた気分をもたらしてくれます。合わないだろうと思っていても実際に当ててみると意外とはまる意外性のある色です。色が及ぼすマイナス面があまり見当たらない色ですが、プラス効果も度を超えると鬱陶しくなります。
引用元：色カラー 色の組み合わせ・配色デザイン講座
http://iro-color.com/episode/about-color/pink.html
「色が及ぼすマイナス面があまり見当たらない色ですが、プラス効果も度を超えると鬱陶しくなります。」の箇所が心に刺さりました。
広告的な「売り感（大特価！的な）」を出したい場合に薄いピンク色を使用するとインパクトのない印象になってしまいますし、逆に優しいイメージにしたいときに、鮮やかなピンクをたくさん使用してしまうと逆効果になってしまうので、色の選び方は非常に重要だと思いました。
参考サイトのご紹介
ラブリーで、大人かわいいイメージのピンク色
INTEGRATE
http://liginc.co.jp/wp-content/uploads/2015/10/index.html
コスメブランド、INTEGRATEさんのサイトです。
ピンクにハート！ まさに「ラブリーに生きろ♡」なイメージのサイトです。こちらもシーズンごとにコンセプトに合わせてデザインが変わるので、定期的にチェックしています。
ものすごい面積でピンク色を使用していますが、ブランドカラーのピンクが青みがかった、いわゆる「大人ピンク」と明朝体のフォントで、こどもっぽい印象にならず大人ラブリーな印象を与えています。下層ページは薄いピンクになっており、サイト全体の構成にメリハリがでております。
上品で、やわらかいイメージのピンク色
IGNIS GARDEN
http://www.ignis-garden.jp/
ボディケア用品のブランドIGNIS GARDENさんのサイトです。
少しオレンジがかった淡いピンクをベースに、ゴールドを合わせていることで、上品でやわらかい印象のサイトです。繊細なフォントやお花やリボンのあしらいなどで、女性らしさを感じさせます。背景に壁のようなテクスチャが入っているので、フラットな印象にならずに、少し高級感のあるイメージのサイトです。
パッケージもステキなので、女性にプレゼントすると喜ばれそうです！
フェミニンで、セクシーなイメージのピンク色
Je l’aime（ジュレーム）
http://www.jelaime.jp/
フレンチテイストの大人なレッグウェアのブランド、Je l’aime（ジュレーム）さんのサイトです。
色味は淡いピンクですが、黒色を合わせていることで、セクシーさと大人の雰囲気が感じられます。季節ごとで商品のテーマが変わるので、いつも楽しみに見ているサイトです。
親しみやすくて、アクティブなイメージのピンク色
fukumimi(フクミミ)
http://www.jr-fukumimi.com/
福岡観光ポータルサイトfukumimi（フクミミ）さんのサイトです。
オレンジに近いピンクに、ブルーやグリーンなどの補色が入ることで、親しみやすく、アクティブな印象のサイトになっています。アイコンやイラストなどのあしらいもピンクの持つポジティブなイメージを引き立てています。
やわらかくて、こどもらしいイメージのピンク色
教学寺幼稚園
http://kyougakuji-kids.com/
北九州氏にある、教学寺幼稚園さんのサイトです。
色味は先ほどご紹介した、IGNISさんと似ていますが、パステル調の青色、黄色、緑色などカラフルな配色と、手書きのイラストの効果で、やさしくて可愛らしい印象です。こどもたちの表情も引き立っています！
元気で、ポップなイメージのピンク色
JOIN ALIVE -2014-
http://www.joinalive.jp/2014/
自然、音楽、アミューズメントが融合するイベント、JOIN ALIVEさんの2014年度版サイト。イラストと勢いのあるフォントで、元気でポップな印象です。三角形のシャープなパターンも効いており、ピンク色がかわいい！ではなく、楽しそう！というポジティブなイメージが伝わります。
このデザインのTシャツだったら、ピンク色の服を全く着ない自分でもチャレンジできそうです。2015年はどんなデザインになるのか、非常に楽しみです。
先進性と、若々しさのあるイメージのピンク色
RAW-Fi
http://raw-fi.com/
「作りたい」欲望を刺激するメディア、RAW-Fiさんのサイト。
こちらは、個人的に興味のある情報ばかりで、いつも見ているサイトです。ビビッドな蛍光ピンクと、太いラインの四角形、でかい文字を画像の上に大胆に載せたデザインが先進感と若々しさを感じさせます。
「色カラー 色の組み合わせ・配色デザイン講座」に記載されていますが、ピンク色は血行をよくする作用があると言われている（私も専門学校で習いました）ので、サイトのコンセプトである「欲望」「刺激」というキーワードが伝わります＾＾
親しみやすさと、柔和なイメージのピンク色
Shape.
http://raw-fi.com/
イングランドのWeb制作会社、Shape.さんのサイト。
一見、モノトーンのサイトと思いきや、ローディングやホバー時、テキストなどのポイントでピンク色を使用しています。シンプルでかっこいい中にピンクを少し入れることで、コミカルなイラストが引き立ち、親しみやすさと柔和なイメージがプラスされています。テキスト選択時のハイライトにもピンクが使用されています。
まとめ
いかがでしたでしょうか？
かつて自分は、「女性向けのデザインはとりあえずピンク！ピンク！ピンク！」とピンク色の乱用をした黒歴史があるのですが、色相や彩度、明度、色相、合わせる色によってさまざまな表情を持っている色だな、と気づきました。本当に良かったです。
また、同じ色のサイトを探していると、その時々で同じピンクでもトレンドがあることが改めてわかり、非常に勉強になりました！
それでは、また！
【WebデザインはWebサイトから学べ！】
※ スマホサイトのデザイン時に参考になるWebサイトのギャラリーまとめ
※ 音楽業界で活躍するアーティストのWebデザインが気になるサイトまとめ
※ 2014年12月 デザイン・表現方法・コンセプトが気になったWebサイトまとめ
※ 2014年11月 デザイン・表現方法・コンセプトが気になったWebサイトまとめ
【株式会社LIGについて】
わたしたちは年間150を超えるWebサイトをリリースしている、東京上野のWeb制作会社です。Webサイト制作のご相談はこちらより、お気軽にお問い合わせください。
LIGはWebサイト制作を支援しています。ご興味のある方は事業ぺージをぜひご覧ください。
