apeescape2.com
  • メイン
  • 人とチーム
  • 収益と成長
  • ツールとチュートリアル
  • ブランドデザイン
Uiデザイン

ボタンレスUIデザインの未来

ボタンとは何ですか?本当に必要ですか?

の初めから グラフィカルユーザーインターフェイス 、ボタンを使用しました。元のXeroxPARC GUIは44年前のものですが、それでもインターフェイスはほぼ同じように見えます。最近、ボタンスタイルの履歴を作成して追跡しました。 ドリブルのタイムライン 。ボタンは現在のトレンドに沿って、テクノロジーとともに進化しましたが、その起源は間違いなく過去の実際のオブジェクトに触発されています。

シアーズファーストエレクトリックブザー1897秋のカタログのスキャン画像

右下隅- シアーズファーストエレクトリックブザー1897秋カタログ

10年以上にわたり、人間のタッチに依存しないが、音声やジェスチャーでアクティブ化できる、物理的なインターフェイスのないデバイスを作成してきました。身近なオブジェクトに基づいて相互作用する方法を作成し続けるのはなぜですか?デジタルボタンの形状は、19世紀に開発したツールとメカニズムをモデルにしています。



まったく新しいスマートな電子デバイスを作成しました。選択したほぼすべての方法で処理できますが、怠惰や習慣の力から、ユーザーに幅がわずか数ピクセルの小さな複雑な領域をクリックするように強制し続けています。

それについて何かをする時間-ボタンなしで考える時間。

ボタンレスUI-すべてが相互作用する場所

「ボタンレスユートピア」とは、これまでの130年以上のやり方を持ち続けようとする試みが完全に打ち砕かれるという概念です。未来は今です-私たちは先に進み、前任者の時代遅れの解決策を捨てなければなりません。

完全にボタンのないインターフェースを想像することは可能ですか?見ているだけで行動の仕方がわかるほど直感的なものはありますか?それはもはや私たちの想像の中にある必要はありません-これらのインターフェースはすでに存在しています。

ARのMicrosoftHoloTourアプリ

Microsoft HoloLens:HoloTour

尊敬されているボタンを完全に削除することはできますか?マイク、カメラ、タッチスクリーン、バイブレーション、加速度計、ジャイロスコープ、GPS、エクステンデットリアリティ、バーチャルリアリティ(リストは続きます)など、これらすべてをスマートフォンまたはPCから管理します。ユーザーにその小さな長方形を押すように強制し続ける理由はもうありません。

UIのボタンを削除しましょう

あなたは読んだ 書体デザイン? --ApeeScapeのデザイナーであるMichaelAbehseraが質問をします:グラフィック要素のないインターフェースはどこにありますか?重要なのはなぜ唯一のコンテンツなのですか?多くの方が「ボタンはどうですか?」と尋ねました。それらはもう必要ありません。完全に削除します。

ここにいくつかの興味深いアイデアがあります:

Facebookは「あなたの気分はどうですか?」と尋ねました。答えるのに**ボタンを押す**必要はありません-あなたの声を使って-ただ気分が良くなってビーチに向かうように彼女に言ってください。次に、Facebookが認識するテキストを、返信から表示したい場所にドラッグします。

音声インターフェイスアニメーション

初心者のためのcプログラミングを学ぶ
音声で検索

ミディアムの記事が「好き」でしたか?少し前に 中 あなたは単に記事を「推薦」することができます。今日は「拍手」をクリックします。ただ「拍手」。この奇妙な小さなボタンをクリックする必要がなく、ただ 私たちは文字通り拍手します ?

ミディアムの記事のために拍手する男

ボタンレスコンセプト Wojciech Dobry (...あまり真剣に受け止めないでください。)

より複雑なアクションはどうですか?オンラインストアでの支払いなど。アイテムをショッピングカートにドラッグアンドドロップし、スワイプしてチェックアウトしてから、指紋で確認します。簡単なピーシー。

UIアニメーション

ASOS-カートに追加するアニメーション ザカリー趙

コンテンツと画面全体を考える

アクションを実行するために現在タッチしているサーフェスから始めましょう。の大多数以来 最新のグラフィカルユーザーインターフェイス それらはタッチスクリーンディスプレイであり、多くの場合親指で操作されますが、そのようなインターフェイスが長期間使用されるのは当然のことです。そして、私たちは間違いなくその魅力的なタッチの衝動を持っています-タッチは結局のところ私たちの最も重要な感覚です。表面に触れると、実際のアクション、コントロールの感覚が得られます。特定のポイントをクリックする代わりに、ユーザーにサーフェスを操作するように教えました。 全体として?

Instagramがどのようにそれを行うか見てみましょう:

InstagramストーリーのナビゲートInstagramストーリー

Instagramストーリーのナビゲート

Instagramのストーリーをナビゲートして前のストーリーに戻ることができるボタンを見たことがありますか?これを行うには、画面の左端をタップするだけなので、おそらくそうではありません。

ユーザーは、当社のデジタル製品と対話するための新しい方法を期待するようになり、ボタンを使用しないことがよくあります。カードはすべての面で反応します。任意の単語をクリックして、その定義を見つけたいと思っています。画像に触れるときは、何らかの行動が必要です。ユーザーは、エリア全体がタッチに反応するという事実にすでに慣れています。

ジェスチャ認識

ジェスチャーは私たちにとって自然であり、私たちの身体的行動に反映されているため、私たちはジェスチャーを非常によく理解しています。最近では、ほとんどすべてのアプリケーションがブラウジングを高速化するためにそれらを使用しています。ボタンのように押す代わりに、写真を折りたたむことができます。スライドしてギャラリーをナビゲートしたり、ピンチしてコンテンツを拡大したりできます。

タッチスクリーンでのハートの描画UIアニメーション

ウェルギリウスパナ

UIインターフェース UIインターフェース

によるユーザーインターフェイス Ramotion & Jarek Berecki

ジェスチャーはフラットタッチスクリーンだけでなく、全身でナビゲートできるARおよびVR空間でも実行されます。

拡張現実でジェスチャーを使用する男

そこ対一人対私
MicrosoftによるHoloLensのジェスチャー

ジェスチャー認識を使用してIoTを制御する男性 ジェスチャー認識を使用してIoTを制御する男性

iPhoneでのクレイVRジェスチャ認識

音声インターフェース

Siri、Cortana、Alexa、Googleアシスタントが稼働しています。多くの人が音声インターフェースは未来であると主張しています-それらの潜在的な用途は数を超えているので、異議を唱えるのは難しいです。実在の人物と話すのと同じように、話しかけるだけで車両、スマートビル、機械を制御できます。人工知能と機械学習により、機械は私たちの言語をより正確に理解できるようになりました。私たちはもはや「魔法の呪文」を注意深く発音するだけではありません。私たちは完全な文章で話すことができます。

OK Google Ad

OK、グーグル...

音声を使って、送金の世界を自由に移動できます。現在、Siriでは、「Siri、PayPalを使用してXYZに200ドルを送金してください」という簡単なリクエストを使用して、PayPal経由で別の人に送金することができます。ボタンはありません。必要な確認とセキュリティチェックはTouchIDのみです。

iPhoneでのPayPal転送に使用されるSiri

物理的アクション、接続されたデバイス、およびビデオ認識

笑顔で支払いますか?もちろん!アリババとKFCは共同で、カメラに微笑むだけで支払いができるシステムを立ち上げました。ボタンを押す必要はありません。このシステムは顔認識で機能し、現在中国で利用可能です。

笑顔で支払うときのKFCとAlibabaシステム

これは、潜在的な用途の1つにすぎません。私たちのデバイスにはすでに多数のセンサーが装備されており、全身を監視できます。スマートフォンで1本の指を使ってアクションを実行することを妨げるものは何もありません。

MacBookProのロックを解除するために使用されるiWatch

ボタンの消失を加速する物理的アクションの別の例は、単にデバイスの近くにあることです。たとえば、iWatchを見てみましょう。ラップトップに接続してMacBookのロックを解除するのを待つだけです。ウェアラブルデバイスを使用して、身元を確認したり、場所やセンサーデータに基づいてニーズをインテリジェントに予測したりできます。それらのおかげで、私たちはすでに多くのインターフェースでボタンの使用を避けることができます。

デバイスの制御に使用されるジャイロスコープ デバイスの制御に使用されるジャイロスコープ

数年前から広く利用されている技術を忘れないでください。 1つはジャイロスコープです。ほとんどすべてのスマートフォンで利用できますが、インターフェイスで使用されることはめったにありません。上に、によって作成された実験的なインターフェイスを見ることができます PatrykAdaś 。

UIデザインの未来

非常に多くのオプションが利用できるため、ユーザーが操作するための一般的な長方形のボタンの使用を忘れることができます。今日のテクノロジーにより、次のことができるまったく新しいインターフェースを作成することができます。

クレジットカード番号をハッキングする方法
  • ユーザーの時間を節約

  • ミス、スリップ、ミスを防ぎ、

  • 偶発的な行動を補償する

UIの概念 UIの概念

による概念的なインターフェース コスミンキャピタン そして Ramotion

時が来ました-テクノロジーは私たちの前にあります。私たちデザイナーはそれを追いかけなければなりません…そして私たちが追いつくことを確認してください!

Webアプリのクライアント側とサーバー側と事前レンダリング

バックエンド

Webアプリのクライアント側とサーバー側と事前レンダリング
ブログを高コンバージョンファネルに変えるための5ステップのプロセス

ブログを高コンバージョンファネルに変えるための5ステップのプロセス

Uxデザイン

人気の投稿
実際のデータを使用したプロトタイピング–フレーマーチュートリアル
実際のデータを使用したプロトタイピング–フレーマーチュートリアル
説得力と動き–モーションデザインの原則へのガイド
説得力と動き–モーションデザインの原則へのガイド
Swiftプログラミングの学習:プライムタイムの準備はできていますか?
Swiftプログラミングの学習:プライムタイムの準備はできていますか?
SaaS価格設定モデル-価格設定戦略の例とベストプラクティス
SaaS価格設定モデル-価格設定戦略の例とベストプラクティス
あなたのためにリモートワークを機能させる方法
あなたのためにリモートワークを機能させる方法
 
カスタムフォントの作成方法:7つのステップと3つのケーススタディ
カスタムフォントの作成方法:7つのステップと3つのケーススタディ
小規模市場でスタートアップ資本を調達するための戦略
小規模市場でスタートアップ資本を調達するための戦略
成長キャンペーンスペシャリスト
成長キャンペーンスペシャリスト
成長する成長:このオープンソースコードを使用して独自のコホート分析を実行します
成長する成長:このオープンソースコードを使用して独自のコホート分析を実行します
UXとデザイン思考の重要性
UXとデザイン思考の重要性
人気の投稿
  • @media screen and(max-width 480px)
  • cfoはどの部門に責任があります
  • これは良いアプリ設計の実践ですか?
  • 反応ネイティブの使用方法
  • プログラマーとWeb開発者に対するセキュリティポリシーは開発ポリシーです。
  • コホート分析の方法
カテゴリー
分散チーム 収益性と効率性 人とチーム 財務プロセス 技術 ツールとチュートリアル プロジェクト管理 その他 ライフスタイル リモートの台頭

© 2021 | 全著作権所有

apeescape2.com