世界は私たちのインターフェースです–UIデザインの進化

公開: 2022-03-11

今日、コンピューターはどこにでもあります。 あなたはそれらを逃れることはできません。 私たちは、デザインと進化するユーザーインターフェイスのエキサイティングな時代に生きています。 私たちの服、アクセサリー、家、車、街路が1つの巨大なユーザーインターフェイスになり、「アンビエントインテリジェンスの世界」と呼ばれるようになった新しいテクノロジーの時代。

UIデザインの進化は、ツールの時代、マシンの時代、ソフトウェアの時代、そして自己の時代の4つの期間に分けることができます。 この急速な成長に伴い、オブジェクト、環境、テクノロジーとの人間の相互作用の調査が不可欠になっています。

ツールの時代

初期の人間は、原始的な道具を使って、石の表面に動物や自然の表現を描くことでコミュニケーションを始めました。 非常に象徴的な象形文字は、コミュニケーションに使用された最初の方法の1つでした。 この象徴性は、後に芸術、執筆、ドキュメンテーション、ストーリーテリングに発展するでしょう。

時間の経過とともに、ツールはより洗練されたものになり、その結果、一部(ペンなど)は今日でも広く使用されています。 私たちは完全に一周し、絵文字などの単純な記号や図像を使用して、感情を伝え、言葉を超えた繊細さを伝えています。

シンボルの使用は、UIデザインの進化の一部でした。

機械の時代

産業革命は生産性を強調しました。 「機械の時代」、私たちは私たちの生活を楽にするために大規模なオブジェクトを構築しました。 それは、ハードウェア自体が依然として主要な「ユーザーインターフェイス」であった時代でした。

この一例は、1868年にクリストファーレイサムショールズによってタイプライターが発明されたことです。 物理的なキーをタップして単語を作成し始めましたが、それでも手を使用しましたが、ペンの代わりにタイプライターを使用しました。 それは時間を節約し、迅速に採用できる一貫性のある実用的なフォーマットを作成するのに役立ちました。

機械は大量生産されていて、力はそれらに移りました。 インターフェイスとしてのハードウェアが到着しました。 ただし、欠点は、使用する前に入力方法を学習する必要があることでした。

初期のタイプライターキーボードは、UIデザインの進化の一部でした。

ソフトウェアの時代

ソフトウェアには「ユーザーインターフェイス」が必要であり、ユーザーが簡単に採用できるモデルを探していたため、UIデザイナーは、人々の行動や初期のハードウェア設計に着想を得ました。

人々はすでにタイプライターのキーボードのメンタルモデルを持っていました。 彼らはすでにタイプする方法を知っていたので、自然な進歩は同じ方法でデジタル画面上のテキストと相互作用し始めることでした。

これは、同じキーボードやタイプライターのミニバージョンのように見えるモバイルオンスクリーンキーパッドにも当てはまります。 タッチへの動きとともに、私たちの環境と相互作用するまったく新しい方法が定義され始めました。

UIデザインの歴史:1973年からのXeroxStarユーザーインターフェイス
Xerox Starワークステーションは、1973年に最初の商用グラフィカルユーザーインターフェイス(GUI)を導入しました。現在モバイルUIで広く使用されている「ハンバーガー」メニューに注目してください。


UIデザインの進化は、一般的なアナロジー、先行するハードウェア、および直感(親しみやすさとメンタルモデル)の影響を受けています。 採用の障壁を下げるためのベストプラクティス(および一般的に優れたUIデザイン)には、人々のメンタルモデルと整合し、心を開いて、周囲の世界とのつながりを維持したいという願望が含まれます。

スキューモーフィズムを入力してください。これは、2次元画面のUI要素を3次元の世界のように見せることで、ユーザーがユーザーインターフェイスを操作する方法を理解できるようにするための試みでした。 デザイナーは、デジタル音楽プレーヤーの音量を制御するための回転ダイヤルなど、物理的な対応物のように見えるデジタルコントロールを使用してユーザーインターフェイスを作成しました。

Appleは、SteveJobsの指揮の下でこの傾向を主導したことで有名です。 2013年にiOS7がリリースされたことで、スキューモーフィズムのデザインがゆっくりと「フラット」なスタイルに進化したのは、ジョナサンアイブがアップルでより影響力を持ったときでした。ミニマリストインターフェイスのシンプルさ。

スキューモーフィズムはUIデザインのコンセプトでした。
スキューモーフィズムのUIデザイン。

AppleのiOSヒューマンインターフェイスガイドラインは、設計者が「ベゼル、グラデーション、ドロップシャドウ」(より重く見えるUI要素につながる可能性がある)から考え方を変え、コンテンツにさらに焦点を合わせ、UIがサポートの役割を果たすことを可能にすることを奨励しました。

また、Googleのマテリアルデザインは、スキューモーフィズムで表される個々のUI要素とは対照的に、デジタルキャンバス全体に微妙なレイヤーとドロップシャドウを与えることで、3次元の異なる表現にシフトしました。

マテリアルデザインは、「マテリアルの表面とエッジが、実際に接地された視覚的な手がかりを提供することを示しています。 おなじみの触覚属性を使用すると、ユーザーはアフォーダンスをすばやく理解できます。 光、表面、および動きの基本は、オブジェクトがどのように動き、相互作用し、空間内で相互に関連して存在するかを伝えるための鍵です。

GoogleマテリアルデザインのUIデザインフレームワーク

タッチは人間中心

タッチスクリーンスマートフォンの台頭により、人々はさまざまなジェスチャーに慣れてきました。 誰もがピンチ、タップ、ロングタップの違いを学び、画像や地図をズームインおよびズームアウトする方法としてピンチインとピンチアウトに慣れました。

この動作は非常に自然になっているため、成人人口の少なくとも85%がある時点で、物理的な地図またはデスクトップ画面を拡大しようとしたと想定するのはかなり公正です。 また、タブレットを使用している赤ちゃんは、テレビ画面の要素をタップして操作しようとしました。

画面をタッチしてユーザーインターフェイスを操作するのは、直感的であるためです。つまり、ユーザーが画面を見ると、何をすべきかが正確にわかります。 人間は指ですべてを探索するために生まれました。 それは生まれつきのものであり、すべてがどこから始まったかを思い出させるものです。

UIデザインの歴史とタブレットを持った赤ちゃん

タッチベースのUIは価格でやってきた

その過程で、デザイナーは、モバイルUIで利用可能なインタラクションを見つけて使用することをほぼ不可能にする、かなりあいまいなジェスチャを作成しました。 デザイナーが美的理由でジェスチャーの相互作用を隠し始めたため、ユーザーエクスペリエンスが低下しました。

しかし、彼らの塩に値するUXデザイナーなら誰でも知っているように、発見可能性と明白なものが常に勝ちます。 UXデザイナーの間で「人が見つけられなければ存在しない」ということわざがあります。

言い換えれば、タッチベースのUIには代償が伴いました。 トレンドに従って、一部のUIデザイナーは、洗練されたファサードの背後に多くの重要な機能と利用可能なインタラクションを隠しました。 どこにでもあるハンバーガーメニューはその一例です。 隠しナビゲーションと見なされるため、使いやすさの問題があります。 それらは発見可能性が低いため、効率が低くなります。

米国を拠点とするフルタイムのフリーランスUIデザイナーが望んでいた

問題を悪化させたのは、AndroidとiOSの間の激しい競争でした。そこでは、iOSが最初に先導し、ヒューマンインターフェイスガイドラインを大幅に削減しました。 シンプルさは美しく見えましたが、設計者は醜いまたは複雑なコンポーネントを隠していたため、インターフェイスの使用がより困難になることがよくありました。 Androidは、Appleが実装した最悪のことの多くをエミュレートし、マテリアルデザインが導入されて初めて、UIの一貫性がAndroidデザインの標準になりました。

さらに悪いことに、デザイナーはこの傾向をますます採用し始め、隠されたジェスチャーの相互作用の乱用に怠惰になり、モバイルUIの使用方法を人々に示すために広範なオンボーディングシーケンスに依存しました。

ユーザーインターフェイスは冗談のようなものです。 あなたがそれを説明しなければならないなら、それはそれほど良くありません。 マルティン・ルブラン、iconfinder.com

一部のオンボーディングシーケンスは、UIデザインの基本に違反しています。
指示付きの広範なモバイルオンボーディングシーケンス。

タッチUIは十分に大きな画面でのみ機能します

今日、ウェアラブルデバイスは、このような小さな画面の相互作用が困難になっています。 AppleのDigitalCrownなどのハードウェア中心の機能を使用して、複雑すぎるものをナビゲートするのは困難です。 デザインは時計の実際の動作を再考しますが、このシナリオで使用されると、すべてが時間がかかり、面倒になります。 それにもかかわらず、一部のスマートデバイスは正しい方向に進んでいます。

モノのインターネット(IoT)は、日常のデバイスの使用をインタラクティブな環境に拡張し、機能を最前線に置いて正しく行われた実際のハードウェア模倣の優れた例です。 デジタルクラウンとは異なり、大きなダイヤルは機能的で賢明です。

Nestサーモスタット:IoTとUIデザインの進化


Nest Learning Thermostatは、元のサーモスタットデザインから視覚的な手がかりを得て、人々が通常ダイヤルを使用する方法を取り入れた、使いやすく、家にシームレスにフィットする製品の一例です。

2014年にAppleWatchの発売時に初めて発表されたテクノロジーであるForceTouchは、第6世代のiPhoneにも導入され、あらゆる種類のデバイスに急速に拡大しています。

UIの進化:ForceTouchテクノロジーを搭載したAppleWatch

UIは、古代のアプローチを模倣するために再び進化します

UIデザインの進化における次のレベルは、すべてが完全に一周する方法を示しています。 Apple Pencilは、最高の状態でハードウェアとソフトウェアの両方のテクノロジーであり、ユーザーがデジタル領域で描画および書き込みを行うのに役立ちます。 Apple Pencilがこのアイデアを主流にした一方で、ジョブズが「誰がスタイラスを欲しがっているのか」と有名に言ったのはそれほど昔のことではありません(2007年)。 iPhoneのマルチタッチテクノロジーを紹介する前に。

Steve Jobsは、使いやすさと、このような小さなスタイラスを小さなモバイルデバイスの画面で使用することの難しさについて指摘しました。 結局、Microsoftでは機能しなくなりました。 ほとんどの初期のWindowsMo​​bileデバイスにはスタイラスが付属しており、主要なタッチ入力テクノロジは抵抗膜方式のタッチスクリーンであり、入力にスタイラスが必要になることがよくありました。 ツールは当時は適切ではなく、人々はペンのようなデバイスを使用してモバイルUIを操作する必要がありました。 自然な感じではありませんでした。

ポータブル画面が大きくなると、ペンのように感じられる入力(描画と手書き)用に別のガジェットを使用する時期が到来しました。 これが、ApplePencilが小型の9.7インチおよび7.85インチモデルではなく、特大のiPadProでデビューした理由です。

iPadProを搭載したApplePencil:ユーザーインターフェイスのもう1つの進化

Apple Pencilは、鉛筆とタブレットという2つの使い慣れたものを採用しているため、人間中心です。 それを使用するために何か新しいことを学ぶ必要はありません。 私たちの祖先がリードスタイラスの鈍い端を紀元前3、000年頃の湿った粘土板に押し付けて以来、人間の脳はこの書き方に精通しています。

長期的には、設計者は、人々に新しいスキルを習得させるのではなく、本質的な行動を促進する設計哲学と設計製品において、より人間中心になる必要があります。

タッチを超えて– VUI

小さな画面が設計者にテクノロジーと対話する他の方法を探求するよう促した場合、さまざまなコンテキストでの新しいユースケースは、人々がテクノロジーを使用できるさまざまな方法を考えるように促しました。

音声ユーザーインターフェースは、あらゆる種類のユーザーエクスペリエンスの向上に役立っており、2020年までに音声がすべての検索の50%を強化すると考える人もいます。

音声はパッシブまたはインタラクティブにすることができ、テクノロジーと対話するための強力な方法です。その利点の1つは、ハンズフリーであるということです。

UIのVUIへの進化

ユーザーインターフェイスは私たちの周りの世界になりつつあります

周囲の世界がユーザーインターフェースになるのを支援するために、GoogleのAdvanced Technologies and Projects(ATAP Lab)は、人間の手のモーショントラッキングにミニチュアレーダーを使用する新しいセンシングテクノロジーであるProjectSoliを開発しました。 タッチレスジェスチャインタラクションを有効にすると、指が互いに接触する触覚によってフィードバックが生成されるため、インタラクションは物理的で応答性が高くなります。

UIデザインの進化における最新のProjectSoli


私たちが今日使用しているテクノロジーとスクリーンは、私たちの周囲に姿を消しつつあります。 IoT(モノのインターネット)と音声支援を備えたAIはすでにここにあります。 人々の日常生活をサポートするために、多数のデバイスが連携して動作する「アンビエントインテリジェンス」の時代の幕開けです。 結果として、画面ベースのUIは徐々に消えつつあります。

設計者は、AI対応の「アンビエントインテリジェンス」の世界をどのように設計しますか? UIデザインの将来の進化にはどのような影響がありますか?

この「新しい世界」では、UIではなくエクスペリエンスの設計が重要になります。

•••

Toptal Designブログでさらに読む:

  • VUIの設計–音声ユーザーインターフェイス
  • 暗いUI。 良い点と悪い点。 規則ルール。
  • モバイルインターフェースのヒューリスティック原則
  • ボタンのない将来のUIデザイン
  • TVプラットフォームのユーザーインターフェイスデザインを再考する