デザインの主要トレンドとその未来―フラットデザイン、スキューモーフィズム、マテリアルデザイン、ミニマリズム | アドビUX道場 #UXDojo

連載

エクスペリエンスデザインの基礎知識

Webデザインのトレンドは、ここ数年の間に多くの変化を見せてきました。まるで隔年ごと新しいトレンドが登場しているかのようです。こうした慌しい状況では、より意味深く長続きする価値を見過ごして、最新の流行に捕らわれるデザイナーが増えても当然でしょう。

この記事では、記憶に新しい、最も重要ないくつかのデザイントレンドを取り上げ、その将来について考えてみます。

スキューモーフィズム

これまで

スキューモーフィズムとは、デザインの要素 (アイコンやボタンなど) を実物に似せることを指します。たとえば、封筒のアイコンに、ドロップシャドウ、重なり、テクスチャといった3D効果を適用し、本物っぽい見た目にすることです。

スキューモーフィズムの例。画像提供: AppleInsider マイキー・キャンベル

これは2000年代から2010年代初期に主流となっていたトレンドで、スティーブ ・ ジョブズの影響もあって、アップルはその主要な支持者でした。しかし、支持者の中でも特に有名であったスコット・フォーストール (当時のApple iOSソフトウェア担当上級副社長) がジョブズの死後退任すると、その勢いは急降下しました。現在アップルの最高デザイン責任者を務めるジョナサン・アイブは、スキューモーフィズムにあまり肩入れしていなかったため、フォーストール退任後、アップルは2013年に開催されたWWDCにおいて、スキューモーフィズムから正式に手を引くことを発表しました。

これから

このデザイントレンドは厳しい状況にあり、近々大きなカムバックがある様子は見えません。IT業界を代表する大手2社、アップルとグーグルがよりシンプルでフラットなデザインを追及している現状では、複雑さを持つスキューモーフィズムは過去のものと言ってよいでしょう。

フラットデザイン

これまで

フラットデザインは、国際タイポグラフィック様式やスイススタイル (グラフィックデザインのスタイル) が人気になった、1950年代まで遡ることができます。マイクロソフトが有名な製品に取り入れたことがきっかけで、デジタルの世界でも21世紀になってから人気が高まりました。

Windows の [スタート] メニュー。画像提供： BlackFin360。

その名前が示すとおり、このトレンドには次のような特徴があります。

これから

フラットデザインの未来は非常に明るいでしょう。フラットデザイン自体が幅広いデザインのカテゴリーであることがその理由ですが、数年前に普及して以来、派生的な利用が増え、そのそれぞれが独自の強力な支持者を得ています。注目に値するものには、フラットデザイン2.0とマテリアルデザインがあります。これからも、フラットデザインのコンセプトから他のデザイン言語が登場することでしょう。

フラットデザイン 2.0

これまで

フラット2.0は、フラットデザインから直接分岐したデザインコンセプトの好例です。UXデザインには不十分と指摘されたオリジナルのフラットデザインのいくつかの問題に対するデザイナーからの回答として、フラット2.0は2014年に登場しました。

フラットデザイン2.0の例。Design Modoの掲載画像。画像提供： Black Tomato

フラット2.0には、フラットデザインの滑らかでミニマルな特徴がすべて引き継がれていますが、わずがに3Dへ近づけられている点など、いくつかのはっきりとした違いがあります。たとえば、微妙な影やグラデーションをUXを改善するために導入しています。多くの人が、2Dだけを厳密に適用するフラットデザインの純粋さが、ボタンやアイコンをクリックしたりタップできることをユーザーが正確に識別する妨げになっていると感じていました。

これから

現時点において、デスクトップからモバイルUIまで、Webデザインはフラットが主流です。アップルのmacOSでもフラットが採用され、BlackBerry、Androidなどのほとんどの主要モバイルOSも同様です。フラット2.0は、デスクトップやモバイルのUIに、今後も採用され続けるでしょう。これからの注目は、控えめなフラットの美しさを維持しつつ、わずかな3D表現を加えてUXを改善するところです。

マテリアルデザイン

これまで

グーグルは2014年にマテリアルデザインを発表し、2015年までに、ほとんどの自社製品とChromeやAndroidのサービスにそれを展開しました。マテリアルのデザインの要素が、ほぼフラットな要素に3Dタッチを微妙に適用して優れたUXを作り出そうとしている様子を見れば、実質的に、マテリアルデザインはグーグルによるフラット2.0の解釈と言えるでしょう。

Example of Material Design. Image credited to BGR. マテリアルデザインの例。画像提供： BGR

これから

グーグルはこのトレンドの適用範囲を広げ続けています。2017年にはデスクトップ用のYouTubeをマテリアルデザイン言語でデザインし直しました。グーグル独自のデザイン言語を、自身のすべての製品とサービスで宣伝するのは当然のことですから、将来はグーグルのあらゆるものにこのトレンドが採用されていくでしょう。

ミニマリズム

これまで

ミニマリズムは非常に興味深いもので、ニールセン・ノーマン・グループのUX専門家によれば、一部のデザイナはフラッデザイントのそもそもの基礎だと考えられているようです。その意味では、ミニマリズムは2000年代に加熱したスキューモーフィズムに対する究極の答えと考えられます。

これはもはや単なるトレンドではありません。2000年代の初めに導入され、ほぼ20年という時の試練に耐え、フラット、フラット2.0、マテリアルといった、ここに記載した多くのトレンドを発生させてきました。

ミニマリズムの例。SpeckBoyの掲載画像。 画像提供： Belancio

ミニマリズムには次のような特徴があります。

これから

今日のWebデザインにおけるミニマリズムの普及を考えると、デザインが必要な他の分野でも、統合されていく様子を目にすることになるでしょう。動画や、AR (拡張現実)のようなこれから人気が出るであろう分野での使用も含まれます。

おわりに

ミニマリズムが今日のデザインでは人気ですが、5年後、10年後も、その支持を維持できているかを見るのは楽しみです。この記事で見たように、Webデザインは決して不変なものではありません。常に進化するものであり、行き過ぎがあれば跳ね返されもします。また、進化の中には既存のトレンドへのわずかな修正もあるでしょう。それが、私たちにとって全く新しいトレンドの発見につながるかもしれません。

この記事はDesign Trends 101: Everything You Need to Know about Flat Design, Skeumorphism, Minimalism, and More（著者:Marc Schenker）の抄訳です