スマートフォンの普及により、Eコマースにおいては、モバイルを含むあらゆる端末からスムーズに閲覧できるサイトが増えつつある。今回はそうした流れを踏まえつつ、2015年のデザイントレンドを紹介する。
サイトのナビゲーションのように、ウェブサイトにおいて必要不可欠な情報であっても、スマートフォンの小さな画面では邪魔になってしまうことが少なからずある。
そこで使われ始めているのが、三本線のメニューアイコンだ。アメリカではハンバーガーアイコン（バンズと中身の三段重ねに見えることから）と呼ばれているこのアイコン。
モバイル向けのサイトデザインで使用されることが多が、PC向けにも利用されることが増えてきれいる。
キュレーションマガジンのAntennaでは、PC向けの画面でもこのメニューアイコンが使われており、クリックすれば「ジャンル一覧」「CMライブラリ」などのメニューがずらりと表示される。
スマートフォンのようなモバイル端末の普及により、メニューアイコンの認知度は上がっており、デザイン性を重視してこのアイコンでメニューを隠してしまうサイトが増えつつある。
ウェブサイトの読み込み速度は、ユーザーの離反に関わる重要な要素です。ファイルサイズの大きな画像は読み込み速度を遅くしがちである。スマートフォンでも読み込み速度を落とさずに見られるインターフェースの作成が追求された結果、画質を落とさずにファイルサイズを圧縮できる技術が普及している。
ホームページだけでなく、商品一覧の写真や商品の紹介に添える写真にも大きめサイズの画像を使うウェブサイトが増加しています。美しい写真はブランドイメージを高めたり、商品の良さをより鮮明に伝えたりすることができ、ひいては売上の増加にもつながるため、大きな画像をウェブサイトに採用する流れは今後、ますます増えていくだろう。
「マテリアルデザイン」とは、Googleが2014年に発表した、新しいユーザーインターフェースの仕様に関するデザインのガイドラインである。
科学技術の進歩を取り入れ、Googleが持つすべてのプラットフォーム（PCやスマートフォンのみならず、スマートウォッチやTVなども含め）において違和感のないデザインにすることを目的として開発された。
すでに昨年11月にはAndroid向け日本語入力アプリ「Google日本語入力」（Android4.0以降で利用可能）やAndroid5.0で、新たにマテリアルデザインが採用されている。「マテリアル」とは英語で「物質的な」という意味で、現実世界の物質を扱うような感覚をデザインに取り入れ、合理性とデザイン性が追求された作りになっている。
マテリアルデザインでは、アプリの構造、機能をユーザーに伝えるために、サーフェス（表面）や影、アニメーションの動きが重視され、また、「bold（大胆で）、graphic（視覚的で）、intentional（意図的な）」インターフェースとするため、色はメインカラー（濃淡は利用可）と強調色の2色利用を原則とし、色やスペースの使い方にも細かく配慮されているのが特長となっている。
例えば、Google日本語入力では、文字ボタンがこれまでより平面的になっているが、タップすると色がアニメーションで変わり、選択された文字は影を伴って一段上に表示される。
また、Google Calendarでは、アプリだけでなく紹介しているウェブサイトでもマテリアルデザインが採用されているので、ページをのぞけばマテリアルデザインを体感できる。
今後もGoogleからはマテリアルデザインに沿ったソフトやサービスが提供され、Google以外でもマテリアルデザインを採用しているウェブサイトやアプリなどが登場いている。
これらはデザイントレンドとして押さえておいたほうが良い。
ウェブデザインに関しては、トレンドを押さえつつも企業の個性が感じられるものにするのが理想である。
紹介したトレンドに加え、デザインが優れていると評価されているウェブサイトを実際に閲覧し、トレンドを体感することで、より良いサイトデザインへのヒントが見つかるのではないだろうか。
6 Ecommerce Design Trends for 2015
Material design（Google）
マテリアルデザイン とは
Googleマテリアル・デザインから学ぶ４つの重要ポイント + 参考UIデザイン、無料素材まとめ
I/O 2014 アプリに学ぶマテリアルデザイン
