ドロワーナビゲーションにより、ユーザーはコア機能に集中できます

ドロワーナビゲーションにより、ユーザーはコア機能に集中できます

[編集者注] この記事は@kentzhuの個人ブログから転載したものです。ナビゲーションはプロダクトデザインのハイライトです。Web側を設計するときは、ユーザーに操作をどのように表示するかを考え、モバイル側を設計するときは、操作を巧みに隠す方法を考えます。しかし、この非表示は実際にはコア機能を強調するためのものです。

iOS ナビゲーション モードは基本的に iOS システム自体のいくつかのモードに基づいています。新しい iOS 製品が継続的に登場するにつれて、新しいナビゲーション方法も更新されます。ここでは、「引き出し式」のナビゲーション方法について説明します。

もちろん、ドロワーナビゲーションは、著者自身がこのナビゲーション方法に付けた名前です。その学術的な名前については、編集者も知りません。このナビゲーション モードでは、通常、アプリの横にあるナビゲーション本体を非表示にし、ボタンを使用してナビゲーションを呼び出し、使用後に同じボタンを使用して非表示にします。引き出したり収納したりすることができ、引き出しのようなイメージなのでそう呼んでいます。

不完全な調査によると、このナビゲーション方法は Facebook から始まったそうです。最も初期の Facebook アプリでは、比較的保守的な 9 グリッド ナビゲーション方式が常に使用されていました。FB が発展するにつれて、この重いナビゲーション方式により、ユーザーのタイムラインの表示が大幅に弱まりましたが、FB はユーザーがアプリに入るときに 9 グリッド ナビゲーションではなくタイムラインに直接入ることができるようにも努めてきました。

しかし、この最適化は明らかに十分ではありません。そこで、2011 年 11 月頃、FB は新しい iOS および Android クライアントをリリースしました。重要な変更点の 1 つは、ナビゲーション モードの変更でした。新しいドロワー スタイルのナビゲーションが導入され、タイムラインの表示が強化されました。

FB がこの新しいナビゲーション モードを開始してすぐに、iOS 版の Gmail もこのナビゲーション モードを採用しました。その後、Path 2.0 バージョンもこの引き出し式ナビゲーションを採用し、極限まで進化させました。それ以来、この引き出しスタイルのナビゲーション モードは、iOS 製品のデザインで急速に普及しました。

簡単な定義

通常、ドロワーを制御するためのハンドルは、アプリの左上隅にボタンの形で表示されます。ボタンをクリックすると、ドロワーが引き出され、ボタンはアプリの右上隅に引き出されます。左側の領域が引き出された後(ドロワー)、ナビゲーション コンテンツが表示されます。

ナビゲーション コンテンツは、リスト形式で表示される通常の 2 レベル ナビゲーションにすることも、FB 検索など、あまり使用されないクイック操作の入り口を直接配置することもできます。具体的な形式は以下のとおりです

もちろん、この引き出しにはいくつかのバリエーションがあり、最も有名なのは Path と Sparrow です。 Path はメイン ナビゲーションを引き出しとして使用するだけでなく、下部にある操作ボタンも引き出しのバリエーションです。一方、Sparrow は引き出しのレベルを追加し、最初のレベルの引き出しを開いた後、さらに次のレベルの引き出しを開くことができます。さらに、MiTu Hotel Booking はホテル予約プロセス全体を一種の引き出しに変えており、これも非常に優れた形式です。

さらに、メッセージリマインダーを必要とする一部のアプリケーションでは、ドロワーの出現によりメッセージの表示に新たな問題が生じるため、多くのドロワーナビゲーションでは、入り口としてタイトル領域にメッセージを表示します。代表的な例としては、Facebook や Express Hotel Butler などが挙げられます。

ドロワーナビゲーションの核となる考え方

ドロワーナビゲーションの核となる考え方は「隠す」ことです。コアではない操作や機能を非表示にして、ユーザーがコア機能の操作に集中できるようにします。個人的には、隠れた思考こそがモバイル製品のデザインにおける最も重要な考え方だと考えています。先週、Geek Park で、縮小、非表示、追加のアイデアをモバイル製品のデザインに適用する方法を紹介しましたが、このアイデアの核となるのは非表示です。

Facebookでは、ユーザーのコア操作はタイムラインの閲覧であるため、他の操作はすべてドロワーに隠されています。Pathでは、ユーザーのコア操作は依然として友人のタイムラインの閲覧であるため、他の操作はドロワーに隠されています。また、UGC操作も欠かせないため、Pathも左下隅にドロワーを使用しています。Sparrowでは、ユーザーはアーカイブされたメールよりも新しいメールを頻繁にチェックするため、メールの種類などの操作はドロワーに隠されており、メールを送信するニーズとのバランスをとるために、右下隅に別の入り口が残されています。Express Hotel Managerでは、ユーザーのコア操作は地図を通じて近くのエクスプレスホテルを見つけることであるため、都市の切り替えなどの他の操作はドロワーに隠されています...

このナビゲーション方法は徐々に普及するでしょう。推測の根拠は、モバイル製品の設計の進化に伴い、コアをより目立たせることによってのみ製品全体のエクスペリエンスを向上させることができ、ユーザーの干渉を継続的に減らすことによってのみユーザー効率を継続的に向上できることに、ますます多くの製品設計者が気づき始めていることです。

ドロワーナビゲーションに適さないアプリには以下が含まれます。

ユーザーがナビゲーションを頻繁に切り替える必要があるアプリ、ナビゲーションをあまり必要としないアプリ、またはコア機能が単なる一連の入り口であるアプリ。

オリジナルリンク: ドロワーナビゲーションについて

(この記事は、Warlial が Leifeng.com に提供したものです。転載の際は、出典として Leifeng.com と著者を明記し、このページにリンクしてください)

元のタイトル: ドロワーナビゲーションにより、ユーザーはコア機能に集中できます

キーワード: 引き出し、ガイド、ユーザー、フォーカス、コア、機能、エディター、この記事は、ウェブマスター、ウェブサイト、ウェブサイトのプロモーション、収益化から転送されています

<<:  Web デザイン分析: UI デザインにおけるインクルーシブ デザイン

>>:  今週のニュースレビュー: NiuBo.com が Tmall に生まれ変わり、メイヤー氏が Yahoo の CEO に就任

推薦する

キーワードランキングを素早く向上させるためのウェブサイトのキーワードのレイアウト方法

最近、同僚の SEO ブログを含む多くの Web サイトを確認しましたが、キーワードの分布や密度など...

投稿した外部リンクが無効なのはなぜですか?

2013 年、ほとんどのウェブマスターは、外部リンクを公開する以前の方法はもはや実用的でも効果的でも...

hosthatch-$7/KVM/512M メモリ/500g ハードディスク/2T トラフィック/3 コンピュータ ルーム (オプション)

私のブログの「言葉にできない」内容で、今年 4 月に hosthatch (フロリダに登録されている...

現象を通して本質を見極める:制御可能なSEOを行う

著者はずっと Guoping 先生の記事を読むのが好きでした。Guoping 先生の記事はすべて、一...

他社よりも優れたウェブサイトのメニューとナビゲーションをデザインする方法

2018年最もホットなプロジェクト:テレマーケティングロボットがあなたの参加を待っていますウェブサイ...

2018 年のクラウド トレンド: サーバーレス コンピューティング、Kubernetes プラットフォーム、ベンダー寡占

市場調査・分析会社フォレスターのデータによると、パブリッククラウドコンピューティングは、その固有の柔...

テンセントクラウドは、企業の迅速な事業拡大を支援するワンストップリソース運用・保守ツールTICをリリースした。

Tencent Cloudがワンストップのリソース運用・保守製品であるTICを正式にリリースしたこと...

プライベート、パブリック、ハイブリッドクラウドのセキュリティの長所と短所

[[382364]]企業がクラウド コンピューティングの導入を決定する前に、プライベート クラウドと...

外部リンク数の減少の原因を突き止め、外部リンク最適化のボトルネックを打破する

Baidu アルゴリズムの調整により、SEO 最適化を行った多くのウェブサイトでは、外部リンクの数が...

株式のグループ購入がインターネットプラットフォームに初めて登場:偽装公開の疑いあり

「適格投資家」基準をテストする必要がある柳のランタン3月5日、オンラインプラットフォーム「エンジェル...

ウェブページを元のウィンドウで開くと閲覧しやすくなりますか、それとも新しいウィンドウで開くと閲覧しやすくなりますか?

ウェブページを新しいウィンドウで開くのが良いのか、それとも現在のページで開くのが良いのか。これはおそ...

香港クラスタサーバー: 244IP/E3-1230v2/16Gメモリ/1Tハードディスク/Windows

vpb は、マルチ IP 香港サーバーを提供します。これは、クラスター サーバーと呼ばれることが多い...

簡単な分析: コミュニティ運営1年間の概要

本日より、私はSendongコミュニティの管理者ではなくなります。これは来年度の営業利益をまとめ、私...

bluevm-3周年記念/4つの特別VPSプロモーション

bluevm(別名「Bu Lu」)は設立から3年目を迎え、bluevmが開発したFeathurオープ...

Baidu がなければ、どのようにウェブサイトを運営するのでしょうか?

6月22日に百度が大量のサイトをK-outし始めたとき、多くの草の根ウェブマスターたちはこの厳しい夏...