January 22.2020

【WEBデザイン】冬らしさを感じるデザイン作成|参考になる色・モチーフのポイント紹介・事例紹介

冬デザイン

こんにちは、デザイナーのしろくまです。

「冬」といえば、デザイン的には最もバリエーションの多いシーズンなのではと、個人的に感じています。

そこで、今回は「冬を感じさせるデザインのポイント」をご紹介したいと思います。

寒色で表現される世界感や、冬ならではのイベントカラーを多用したデザイン、冬らしい和のモチーフと洋のモチーフなど、冬にまつわるデザインのポイントを順にご説明いたします!

冬のイメージカラー

寒さ、雪や氷を表す水色

冬のイメージカラーといえば、「水色」ではないでしょうか?

夏の爽やかな青とは異なり、冬の水色は「寒さ・冷たさ」を感じさせるのがポイントです。さらに、雪に埋もれた町が白とグレーの世界で表現されるように、無彩色が入ってくるとより一層冬らしさが感じられますね。

冬のイベントカラー

冬のイメージが冷たい水色系に対し、冬のイベントを表すイベントカラーには、赤色を使ったモノが多くあります。

12月のクリスマスはサンタクロースの赤色、1月のお正月はおめでたい紅白の赤色、2月の節分は赤鬼の赤色、バレンタインは情熱的な愛を表現した赤色。

寒い季節だからこそ、ぱっと華やかな赤色を自然と求めるのかもしれません。

冬のイメージ・モチーフ

雪の結晶

冬のモチーフの代表といえば、「雪の結晶」の模様ではないでしょうか?

正六角形の雪の結晶のマークをベースとしたデザインは様々あり、寒さの象徴でありながら、画面を華やかに彩ることができますね。

結晶だけでなく、降り積もる雪や光のきらめきなどもよく使われるモチーフです。これらもまた、デザイン次第でポップにもシックにもすることができます。

クリスマスモチーフ

多くの方がご存じの通り、クリスマスは色・モチーフともに、以下のようなはっきりしたデザイン要素があります。

色は赤と緑がスタンダードであり、モチーフはサンタクロース、トナカイ、クリスマスツリー、オーナメント、柊、ポインセチア、クリスマスリース、プレゼント、靴下、星、くるみ割り人形、などが代表的です。

お正月モチーフ

一年で最も和のモチーフが存在感を発揮するイベントは、お正月ではないでしょうか。

初日の出、門松、松竹梅、鏡餅、おせち、干支の動物、お年玉、羽子板など、ぱっと思いつくものすべてが和のイメージです。

逆に洋のイメージのお正月モチーフとなると、パーティーやクラッカー、花火などになるでしょうか。

ニット・ノルディック柄

あったかそうなニットも、冬にかかせないモチーフです。

ニットの編み目をテクスチャーとして使用すると、画面上で温かみを演出できます。また、ニット柄のひとつである「ノルディック柄」をデザインで使うと、可愛いらしい模様が簡単に作れます。

冬らしいデザインサイト実例

ここからは、冬らしさが素敵なデザインのサイト実例をご紹介します。

株式会社I-ne(アイエヌイー)BOTANIST

botanist
https://botanistofficial.com/

降り積もる雪と細いフォントの文字で、冬の静けさと繊細さが表現されています。

計算された柔らかな色調が寒々しさを感じさせず、しっとりとした上質な雰囲気を醸し出しています。

サッポロビール株式会社 ヱビスビール

ebisu
https://www.sapporobeer.jp/yebisu/

エビスビールの「130年の歴史」がメインテーマとなっていますが、夜空や暗い夜景に輝く金色もまた、冬を感じさせるデザインと言えます。

高級感としずる感に目を奪われるデザインです。

スターバックス コーヒー ジャパン 株式会社

starbucks
https://www.starbucks.co.jp/gift/holiday/index.html

クリスマスのデザインです。カラーは、クリスマスの定番色である赤と緑とゴールドがメインで使用されています。

そこに、ツリー、オーナメント、ヒイラギの葉、シュトーレンなど、クリスマスのモチーフが画面いっぱいに広がっています。

さらに、ウール地の布のチェック柄やメインコピーのPARTYにあしらわれた幾何学模様など、たくさんの要素が盛り込まれていますが、色調自体は落ち着いておりバランスが良いため、ごちゃつかずにクリスマスらしい楽しさが伝わってきます。

東日本旅客鉄道株式会社 『行くぜ東北。冬のごほうび』

JR
https://tohoku-tourism.jp/

雪国の魅力をアイコン化し、画面いっぱいに配置したデザイン。

アイコンと写真の組み合わせが面白いですね。ポップで遊び心いっぱい。独創性とインパクトのあるデザインです。

株式会社コーセー『ジル・スチュアート』

ジルスチュアート
https://www.jillstuart-beauty.com/ja-jp/

バレンタインではなく、「Galentine(ギャレンタイン)」をテーマにしたページ。

Galentine(ギャレンタイン)とはギャルとバレンタインを足した造語で、「女子のためのバレンタイン」という意味です。

派手すぎず、子どもっぽくなりすぎない赤とピンクの使い方や、ハイセンスなフォトスタイリングに魅了されます。

WEBサイトは季節感を取り入れて!

冬は寒さが際立つ季節ですが、表現は「寒さ」に限定されません。

寒いからこそ人々は暖かさを求め、赤やオレンジなど暖色を使用したり、ぬくもり感を表したデザインが多く出てきたりします。

季節イベントも、クリスマスやバレンタインなど「洋のイベント」、お正月や節分など「和のイベント」など様々なものがあり、一年の中でもっともデザインバリエーションが豊富なシーズンでしょう。

それだけに、「冬」という季節の中で何をどう表現したいかに意識を向け、デザインの方針を考えることが大切になってくると言えますね。