光沢のあるUIからマットなUIへの現在の移行を説明するものは何ですか？
多くの有名なアプリケーションのユーザーインターフェイスに興味深い現象があることに気づきました。それらは、光沢のある複合体から、より鈍くて最小限のデザインに移行しています。
なぜ突然の変化なのか？また、これらの企業のほとんどがこのデザインをほぼ同時に採用しているようですが、それはいくつかの新しい研究に関連していたのでしょうか？
例：
これは Mac OS Xの「アクア」インターフェイス がこのすべてに与える影響について誰も言及していないのは残念です。
Aquaは、名前AppleがMac OS Xで導入したユーザーインターフェイススタイルに与えられたものです。Macのソフトウェアを次のように変更しました。
…このように見えるように：
これは、MacWorld San Francisco 2000で初めて紹介するSteve Jobsです 。彼が言うように：
設計目標の1つは、それを目にしたとき、それを舐めたいことでした。
なめらかなボタンとピンストライプ、半透明性を備えたAquaのルックアンドフィールへの大きな影響がiMacの大きな人気だったことは間違いありません。
AquaはUIに大きな変化をもたらしました。それらは、主にOSによって描画されるものから、主にビットマップ（またはベクトル）グラフィックスのレイヤーおよびレイヤーとして定義されるように変更されました。 Windows XPは2001年に同じ考えに従いました。そのLuna UIは次のようになりました：
それがリリースされたとき、AquaはiMacが最初にリリースされたときと同様の種類のスプラッシュを作りました。次の5年ほどの間、サードパーティのデザイナーからのすべてのものに、不必要な光沢があったように感じました。
しかし、半透明で光沢のある色のプラスチックの美学の人気にもかかわらず、Appleは、時間の経過とともにそのハードウェア設計によりますます制限されてきました：
ハードウェアのマテリアルデザイン、簡素化、スタイルの絶え間ない進歩は、ソフトウェアに同様の影響を与えました。透明度が低下し、ピンストライプの可視性が完全に消えるまでフェードし、ブラシメタルインターフェースを導入し、特に異なることはありません。 MacOS 9からの古い、主に灰色のインターフェースに：
この変更はMacに固有のものではありません。それは業界全体で起こりました。
それまでの間、iOSがリリースされ（当時はiPhone OSと呼ばれていました）、次のようになっています。
そして、ご存じのとおり、iPhoneとiOS自体は大成功を収めています。多くのアプリケーション（Skypeを含む）は、光沢のあるアイコンオーバーレイとともにリリースされ、それらのアイコンの隣に適切に表示されました。
しかし、Mac OS Xが何年にもわたってエキサイティングでさわやかな見た目から派手な目障りなものになったように、元のiPhone OSインターフェースのスクリーンショットは6年前のものになりました。
…お分かりのように、Appleのモバイル製品のルックアンドフィールに関しては、特徴的ではないほど非常に遅い進歩がありました。
古い格言は次のようなものです：
改善していなければ、後退しています
そして、多かれ少なかれ同じままでいることにより、Apple（GoogleとAndroidおよびMicrosoftとWindows Phone））の2つの主要な競合他社が押収されました根本的に異なる何かをする機会と、最先端の技術を進歩させ、次のように見える機会：
更新：Android "Holo"とMetro visualにコメントをもう少し追加すると思います言語、および2つの製造業者がデザイナーにとってより平坦で光沢のない美学をどのように説明するか：
彼らが最初に発表したとき Metroデザイン言語 （または現在では「Microsoftデザイン言語」と呼んでいます）、MicrosoftはAppleの光沢のあるiOSの美しさに薄いベールをかぶったジャブを作りました。彼らが主張し続けている主な主張の1つは、Metroのよりフラットで活版印刷のデザインスタイルは、より「正直」で「本格的なデジタル」であるということです。 Windows Phoneの設計原則のWebページ では、Microsoftはこれについてかなり明確に述べています。
最も関連性の高い要素のみを画面に残して、クリーンで意図的なエクスペリエンスを作成します。
優れたアプリエクスペリエンスを設計することに関しては、Chromeではなくコンテンツを信じています。chrome以上のコンテンツに焦点を当てることで、不要な要素を減らし、アプリのコンテンツを輝かせることができます。人々が好きなものに没頭して、残りの部分を探索してみましょう。
彼らは後で述べる：
本物のデジタルであることは、物理的な世界のルールや特性を超えて、純粋にデジタルな空間に新しいエキサイティングな可能性を生み出すことです。デジタルメディアを最大限に活用します。
「インフォグラフィック」であること。情報配信が第一の目標であり、その周りのラッパーではありません。インフォグラフィックアプローチを採用すると、Windows Phoneのユーザーエクスペリエンスを最適化できます。
ロゴの再設計に関して 、Microsoftは、光沢を削除する理由として、「本格的なデジタル」であることの正当性に再び触れています。
新しいロゴには、「Authentically Digital」であるというMetroの原則を取り入れることが重要でした。つまり、マテリアリティ（ガラス、木材、プラスチックなど）などの偽造産業の設計特性をエミュレートしようとするものではありません。
残念ながら、Googleは Holo を作成する意図についてあまり明確ではありませんでした。彼らは間違いなく いわゆるフラットなデザインスタイル に強く動いていますが、その理由については特にはっきりしていません。アイコン（質問の中心にあります）については、 彼らは単に言う ：
はっきりとしたシルエットを使用。立体感のある正面図で、上から見たようなやや遠近感があり、奥行きが感じられます。
彼らは彼らの開発者ドキュメントでより良い深さに入ります しかし、彼らが言うところ（私の強調）：
アイコンはトリミングしないでください。必要に応じて独自の形状を使用してください。ランチャーアイコンは、アプリケーションを他のアプリケーションと区別する必要があることに注意してください。さらに、表現されたオブジェクトに光沢のあるマテリアルがない限り、光沢のある仕上げを使用しないでください。
ジンジャーブレッド以前の以前のデザインガイドライン （つまり、プレホロ）、テクスチャにも明示的に言及（「アイコンは、光沢のない、テクスチャマテリアルを特徴とする必要があります」） 完全な説明材料の として記述されています：
ランチャーアイコンは、触覚的でトップライトのテクスチャードマテリアルを使用する必要があります。アイコンが単純な形状であっても、実際のマテリアルから彫刻されたように見えるようにレンダリングする必要があります。
…以降…
Androidランチャーのアイコンは...
- モダン、ミニマル、マット、触覚、テクスチャ
- 前方を向いたトップライトのカラーパレット
Androidランチャーのアイコンは...
- アンティーク、過度に複雑、光沢、フラットベクトル
- 回転、クロップ、過飽和
明らかに、iOS/Aqua /光沢のある美的感覚を回避するために、それぞれの現在のモバイルオペレーティングシステムの最初から、GoogleとMicrosoftの意図はかなりありました。
これはSkeuomorphism vs flat designの重要な部分であり、どの Sacha Greifが優れているかについての議論です 。光沢、反射、テクスチャなどのスキューモーフィズムは、「本物の」オブジェクトのように見えますが、すべてのファンシーが 認知的負荷 を増加させ、不幸な「サミー」の感覚を与えます。 iOSアイコンの大部分は、アイコンに同じまたは類似の光沢効果があるため、差別化としては役に立たない機能です。フラットな最小限のアイコンは個別の機能のみに焦点を当てることができます。Skypeロゴの形状やSなど、特定のブランドの光沢ではなく、 まだ別のトップダウンの光源 。
また、市場の飽和という問題もあります。 iOSの光沢のある…光沢の後に、業界を駆け巡るスケモーフィックなデザインの海。デザイナーからの「ねえ、何か他の方法があります」という自然な反発があります。どちらか（または両方）のデザインの美学を採用するUXにはいくつかの理由がありますが、これは単に逆潮を押しているように見えるかもしれません。スキューオモーフは、初めて「物事がどのように機能するか」（影はこれが上にあることを意味する！）の最初の認識と理解に役立ちますが、クリーンでフラットなデザインは、焦点を合わせやすくなります。目の保養が少なく、光沢効果の代わりに認識可能なオブジェクトが多く、泡が押し出されたボタン。
これは主にデザイントレンドの問題ですが、UXの側面がいくつかあります。
光沢のあるアイコンとボタンは（おそらく）affordanceを表示するために主に使用されました。また、すべてのApple=デザインでほぼ宗教的に使用されました。現在でも、ほとんどのiOSアイコンはデフォルトで光沢があります。
人々は、何かと相互作用できることを知るために、光沢やグラデーションを見せられる必要はないので、ガラスの必要性は低下しています。 AndroidとMetroはiOSを超えて進化し、ほとんどがフラットな要素を備えた、よりクリーンで視覚的にシンプルなデザインに適応しました。
個人的には、変更がより見やすく、より使いやすくなっています。しかし、私はそれが主に設計の傾向についてであると主張します。
それは心理的なトリックです。
リフレクションはAppleの非常に影響力のあるコミュニケーション方法でした：
- 技術進歩
- pleasant ux
フラット（ポピュラー化されているがGoogleによって作成されていない）は、「私たちはすべてのブリンブリンを超えて移動した」と言う方法です。それは通信します：
- シンプルさ
- 効率的なux
それは新しいものではありませんが（50年代と60年代の国際的なスタイルのデザインに注目してください）、現代のUXの焦点を示しています。また、ベクター形式を使用したデザインの人気とアクセシビリティにも非常に関連しています。
少し正直かもしれませんが、この傾向は BBCが1997年に新しい「デジタル」ロゴを発表した を思い出させます。
彼らが当時与えた主な理由は、光沢のあるマットなロゴからよりシンプルなマットなロゴへの移行により、ロゴが複数の解像度と複数のデバイスでよりよく機能するようになったことです。それはまた、ダイアルアップ時代に彼らのウェブサイトで大きな問題であったより良く圧縮し、他のロゴと一緒にテキストによく溶け込みました。
それは、形と機能の古くからのバランスです。 UXはこの2つのバランスをとろうとしています。視覚的に心地よく「見栄えがよい」ものを望んでいるだけでなく、情報を迅速かつ効率的に伝達し、使いやすいものも求めています。
Photoshopアイコンは本当に最良の例です。確かに羽毛はかっこいいように見えますが、アイコンを記憶していないアプリケーションについて誰かに何がわかりますか？何もない。一方、PSロゴは、Creative Suiteの他のさまざまな製品とスタイルが似ています。視覚的には、それらが同じパッケージの一部であることを伝えています。さらに、アイコンの文字は明確で読みやすく、それがプログラムPSであることをユーザーに示します。 Photoshopの綴りほど明確ではありませんが、Creative Suiteのさまざまな製品の名前を知っている人なら、Photoshopと簡単に区別できます。
最初の3社はすべてMicrosoft製品であり、Microsoftの現在の視覚的方向性を反映しているため、実際に例に示されているのは2社のみであることも指摘しておく価値があります。
私は自分の観察からのみ話すことができます。人々はタブレットを購入し、外出先で使用します。外出先でのインターネットは、国やプロバイダーによっては追加料金がかかります。重いWebサイトの読み込みが遅くなります。優れた設計者は、パフォーマンスと読み込み時間を低く保つ方法について考え、激しいブリンブリンボタンから移動することを結論付けます。
その上、Skeumorphデザインは飽和レベルに達しています。テクノロジーのグラフィック機能を紹介するのに最適なため、これらがなくなるとは思いません。
「フラットで無駄のない」外観はMicrosoftのMetroスタイルから発想を得ているという私たちのほとんどが持っているという意見には触れません。 Uiデザイナーは、2011年の半ばに戻って、より平坦で光沢のない外観を採用し始めました。ドリブルとForrstの古い投稿を確認してください。
誰かが実験を始めて基本に戻り、その後、ツァイトガイストを追加し、他の人がピックアップします。それはサイクルです。フラットは2000年から2004年にさかのぼりますが、エッジとコーナーがピクセル化されており、純粋に美的アピールのためのフォントは読みにくくなっています。
私たちはお互いに受粉し、どこからでもインスピレーションを得ています。ファッション、タイポグラフィ、そして今やアプリも。
ブラウザーベースのUIの場合、これらの「フラット」なデザインを構築する方が効率的であり、ブラウザーにはるかに準拠しています。つまり、ドロップシャドウ、ベベル、グラデーション、丸みのある角などはありません。
これは、デスクトップ/ブロードバンド/最新のブラウザーでは大きな違いはありませんが、接続が遅く、画面が小さく、ブラウザーの市場シェアが断片化しているモバイルデバイスでは、顕著な違いが生じる可能性があります。
モバイルWebの重要性を考えると、これはすべてのデザインに影響を与えています。特に、モバイルファーストのデザイン原則は、デザイナーが行う（そして私の意見では）遵守すべきである可能性があります。
なぜ突然の変化なのか？
概して、それは突然の変化ではありません。 MS特有の、突然の変化です。それはデザイントレンドです。グラフィックデザインとUIデザインは、一般的なデザインと同様に、美的傾向に従います。
MSの例の場合、Windows 8/Metroは以前のオペレーティングシステムからの大幅な逸脱として設計されているため、ビジュアルプレゼンテーションに大きな変更を加えても意味がありません。
アドビに関しては、彼らはほとんどすべてのリリースで彼らのアプリケーションアイコンを変える習慣を持っています。ですから、それは特定の戦略的議論よりも変化のための変化です。
一言...
解決
フォントが印刷で表示されるのを確認できるようになったのは最近のことです。そのため、高品質の印刷デザインや活版印刷で普及しているデザイントレンドは、デジタル空間でより意味をなしています。
印刷デザイン、特にハイエンドの作品を見てみましょう。ドロップシャドウと光沢を見せてください。一般的に、そこにはなく、十分にテストされていません。また、前世代の印刷デザイナーの大多数、そしてアートディレクターは、そのような粘着性のある装置を使用するよりも、生きたまま母親を沸騰させたいと考えています。
最終的には、ウェブデザインの最先端を見て回ることができます。この傾向は数年前から明らかになっていますが、xhdディスプレイの登場により、今ではこれまで以上に人気が高まっています。
多分それをファッションと呼びたいかもしれませんが、これは「シリアス」なプリントのスタイルとして25年間続いてきたスタイルであり、80年前にモダニズムのデザイン運動が始まって以来、強く表れています。
私のマーケティングの教授が言っていたように：
市場の誰もが甘いミント味の歯磨き粉を宣伝している場合。塩味のある練り歯磨きを宣伝してください。みんながフッ化物を使って宣伝しているなら、フッ化物なしでやる方がいいよ！
つまり、違うと思う！
基本的にはマーケティングのトレンドです。すべてについて他の人から際立っている。光沢仕上げ製品で市場が飽和状態になった今、マットは戻ってきました。
それぞれにメリットとデメリットがあり、それぞれが異なるタスクに適しています。 特別な理由はありません、大衆はあまり考えないで、彼らはリーダーに従います。:)
より良い質問は、光沢のある外観とマットな外観の賛否両論です。簡単な答えは次のようになります。
光沢
長所：
- 目を惹きます（明るく、光沢のある）
- 深さの錯覚
短所：
- 使いすぎ？
- 生産がより複雑になります（時間、お金、CPUサイクルなどのリソースが増えます）。
マット
長所：
- 気を散らさない（簡単に見渡せる）
- 生産が簡単（時間、お金、CPUサイクルなど、少ないリソース）
短所：
- 使いすぎ？
- 注目されていませんか？
ご覧のとおり、これは過度に簡略化されたリストです。簡単なグーグル検索では、そのような結果を示すリンクは見つかりませんでした。 UXコミュニティが集まって1つを作る良いチャンスです！それをウィキする時間です！
マット対光沢のあるGoogleトレンド を参照してください。
これは、Microsoft Metroから着想を得た「メトロ」と呼ばれるファッションです。
うん、Microsoft-Metroアプリと同じように平らにされ、二乗されます。
「光沢のある丸みを帯びたグラデーション」のデザインがwindows XPの直後になったことを覚えているなら、
--glossy-rounded-shaded-and-shadowy 'はwindows Vistaの直後に追加されました。
このように考えてください。コンピュータハードウェアが3D-半透明-電波波-存在しないからこの日付のユーザーインターフェースのような「奇抜な」デザインを描くことができるようになると、来年には「流行」になります。
これを別の方法で考えてください：なぜcssドロップシャドウ、テキストシャドウ、border-image-background、gradient-background、border-radiusを使用しないのですか？パフォーマンス。
私はそれがファッションであり、「プログラミング」機能に続くものであり、それ以上のものではないと強く信じています。
すべての新しいテクノロジーにより、人々は最新のトレンドについての知識を示すために最も複雑で最も複雑になるために競争します。それがFlash、jQuery、または光沢のあるボタンのいずれであっても、開発者は可能な限りWebをプッシュすることにより、Webに関する知識を互いに示します。それが起こると、テクノロジーは古くなり、競争は止まり、人々は価値のある部分だけを前進させ、他のすべては消え去ります。
JQueryについて触れたので、例として使用します。人気が高まるJavascriptのシンプルなフレームワーク。突然、メニューがスライドし、コンテンツが消えていくサイトが見られます。すべての開発者は、スーツをたどることによって彼らがヒップである次を見せようとします。彼らは仕事に取り掛かり、会社はメニューのスライドだけでなく、色のフェードやウィジェットのスクロールも望んでいます。これは確かに彼らの会社が他の会社よりも優れていることを証明し、最新のトレンドを推進しています。ただし、すべての人とその犬がスライディングメニューを使用してフェードアウトすると、開発者は少しの間休止します。それを彼らの製品に統合することは、もはや彼らの優れた知識を示しません。彼らは最終的にユーザビリティに戻ります。このスライドメニューはユーザーの製品を改善しますか、それとも表示された方が良いでしょうか？
フラットなデザインは、プッシュするのが難しい傾向です。サイトのボタンを設計している場合、チームやクライアントに何を尋ねますか？ 2つまたは3つのデザインを見せて、「どちらのデザインが一番いいですか？」と言います。彼らは常に光沢のあるボタン、または微妙なグラデーションのボタンを選択します。どうして？あなたがそれがどのように見えるかを尋ねたので、そして無地の色は確かに上品なグラデーションとピクセルの完全なベベルを備えたものほど素敵には見えません。ほら、あなたは間違った質問をしています。それは見た目ではなく、機能の仕方です。
人々は頻繁に最も重要なルールをすべて忘れます。インターネットに関して言えば、それはユーザーとコンテンツの間の体験についてです。デザインはここにはありません。私たちはあなたの壁に展示する芸術作品を作っているのではありません。これは傾向ではありません。スライドメニューと光沢のあるボタンは戻りません。彼らは死んでいる。何でもデザインできる世界を見せました。見返りとして、私たちは何も設計しないほうがよいことを知っています。
私の見解では、光沢はそれ自体が属性としてユーザーに何らかの形で認識されていると思います。したがって、光沢のあるすべてのアイコンが何らかの形で結合されます。ブランドや独自性を失う。
光沢がそれ自体が属性として認識されている理由については、おそらく最初に現れたとき、それは非常に斬新であり、このニッチを得ました。
私の簡単な考え-それはまた、真正性、つまり機能デバイスで再生されるデジタル的に真正なUIに関するものです。例-ユーザーはもう物理的なボタンのようなボタンが必要ですか？実際には、コントラストとコンテキストで十分です。
変形インターフェースは、模倣しようとしている「理想」に適合する機能が低下する傾向があります。 OS Xのカレンダーは素晴らしい一般的な例です。
答えは（4のように）物事が現在テーブルにあるということでしょうか？
コンピュータの画面が目の前のテーブルや壁に置かれ、あなたはそれらを「外から/外へ」見た。 XPフィールドを考えてみてください。メタファーはウィンドウとポジティブライトの1つであり、ライトはドロップシャドウボタンに（間違った方向に）落ちていました。重要で、何時間も画面の前に閉所恐怖症を感じさせなくなりました。
しかし、テーブルの上に置かれたデバイスを使用するとすぐに、めまいから感じる感覚である深さは、ただあなたを不快に感じるだけです。また、画面をスワイプしようとすると、アイコンの「バンプ」があまりうまくスライドしないため、深度がメッセージと矛盾します。平らなものは滑りやすくなります。テーブルでは、メタファーは機能しません。おそらくこれが、カードのメタファーに移行している理由です。フラッシュの最後のカードを待っているようなタブをスライドさせて...
設計トレンド+ 2ヒューリスティックスの効果：
システムと実世界の一致新しいユーザーは、自然に明らかなようにデジタル概念で育ったので、極端な類推は必要ありません。
美的でミニマリストなデザイン乱雑さが少ないということは、目前のタスクに焦点を絞ることを意味します。干渉する軽薄なデザイン要素はありません。
トレンド-変化し続け、変化は興奮を生み続け、期待を高くし、ユーザーが新しいデザインに満足するなどを続けます。私たちは視覚世界に住んでいます。ビジュアルレイヤーは、重要なUXエントリポイントの1つです。見た目が良ければクリックします。そして、経験を開始します。
しばらく光沢がありました。よさそうだ。ユーザーにさわやかな影響を与えました。マットへの移行は、人間がしばらくしてから変化を見たり期待したりする傾向があるという事実によって説明できます。
ご覧のとおり、デザインは10年前またはその時代以前から進化しました。たとえば、Photoshopのスプラッシュスクリーン。バージョン4、5、6 ... CS、CS5、そして現在はCS6を参照してください。スプラッシュスクリーンのディテール（アートワーク）の量が削減され、平面度が向上し、透明度が大きな役割を果たします。
マットへの光沢は、単なる変化現象です。しばらくすると、気持ちが心地よくなりません。
デザインは常に進化しています。この質問の最も刺激的な部分は、私たちが目撃しようとしている次のトレンドがどうなるかについての考えを引き起こします。
私は以下の理由を見ます。
- 詳細が少ない光沢のあるアイコンとは対照的にフラットなデザインでは、ユーザーは情報を簡単に消費および記憶できます。
プロ向けのフラットなデザインも簡単に作成できます（詳細は少なくなります）
グーグルやマイクロソフトのような大手企業はフラットUIを採用しました。
現在、ほとんどの人がコンピュータを認識しており、スキューモーフィズムのトリックは不要です。