web-dev-qa-db-ja.com

モバイルアプリバーガーメニューの拡張性

モバイルアプリのハンバーガーメニューで展開可能なアイテム(ネストされたメニュー)を使用することは正しいですか?

このようなもの

enter image description here

2
Masood Farsaei

このようなメニューを活用したアプリを完成させました。タブレット用(1024)でしたが、小さなモバイルデバイスでも同じ結果になると思います。

ユーザーに「X」を見つけてもらいました。彼らはハンバーガーのアイコンに行き、サブメニューに移動する際に問題はありませんでした。眉を上げた被験者は一人もいなかった。

私たちの被験者は、20から60の範囲でした。これは従業員向けのビジネスアプリだったので、従業員は自分が何を使っているのかを理解する動機がありました。 (これは、一般の人口と比較した場合、重要な違いになる場合があります。)

問題がほとんど発生しなかったため、直接テストを中止し、(新しい)人々にハンバーガーアイコンを見つけてドリルダウンし、セクションに移動してタスクを実行する必要があるタスクを実行するように依頼しました。繰り返しになりますが、ネストされたメニューに問題はありませんでした。


ちなみに、あなたのデザインに関する私の1つの問題は、ネストされた部分をもう少しはっきりさせることです。おそらく、入れ子部分をもう少しインデントします。

1
Mayo

Webおよびモバイルデザインの NNGガイドライン を見てみると、ハンバーガーメニューに関して次のように要約されています。

ウェブサイトのメインナビゲーションを非表示にすることで、見つけやすさがほぼ半分になります。また、タスク時間が長くなり、知覚されるタスクの難易度が増加します。

あなたの質問はハンバーガーメニュー内のネストされたメニューに関するものなので、ネストされたメニューは別のレベルの下のナビゲーションを隠していると想定できます。つまり、発見可能性が向上し、タスクの長さがさらに長くなります。

ただし、多くの場合、このようなメニューは、一部のアプリの機能や機能の量で回避するのが困難です。これはよくあることなので、すべての主要な機能をインターフェースの前面に配置する必要があります。

カードの並べ替えや優先順位付けなどの方法で、最も重要な機能を特定できます。

0
RobbyReindeer