web-dev-qa-db-ja.com

マイアカウントエントリのあるナビゲーションドロワー

Androidアプリに ナビゲーションドロワー を追加しています。

私のアプリには、ユーザーが自分のアカウントの詳細を確認できる「マイアカウント」ページがあります。

私のアプリには、ユーザーが選択できる3種類のサブスクリプションもあります(sub1sub2sub3と言います)。

ナビゲーションドロワーでユーザーがどのようなサブスクリプションを持っているかをユーザーに示すことができるといいのですが。

まとめると、ナビゲーションドロワーの[アカウント]セクションに3つの項目を表示します。

アカウント:

  1. ユーザーの写真のサムネイル(ユーザーがログインしたときにFacebookから取得)
  2. アカウントページへのリンク
  3. サブスクリプションタイプインジケーター(sub1sub2sub3

私の質問は、それを手配する最良の方法は何ですか?私のアカウントエントリへのリンクはおそらく不要だと思いますが、写真やサブスクリプションの種類をクリックするとアカウントページが表示されることをユーザーが知っているかどうかはわかりません。

モックアップはまだありませんが、YouTubeアプリを例にとると: enter image description here

追加予定のACCOUNTセクションがあることがわかります。私もそこにユーザーの画像と、サブスクリプションタイプインジケーター(sub1を示す単なるテキスト行である可能性があります)が欲しいです。また、アカウントの詳細が記載された別のアカウントページがあります。アカウントページにアクセスするには、ユーザーが何かをクリックしてそこに移動する必要があります。すべてをどのように結び付けるのかわかりません。サブスクリプションタイプインジケーターをクリック可能にすると、明らかになると思いますか?

3
Michael

まず、重要度の高い順に情報をランク付けする必要があると思います。ユーザーの名前はおそらく最も重要であるため、ユーザーに伝えるために表示する必要があるもの

a)ログインしていて、

b)ユーザーがログインに使用しているアカウント。

画像は、これを視覚的に支援するのに役立ちます。最も重要なことを確認したら、ユーザーにとって最もわかりやすいものにすることに焦点を当てる必要があります。次に、サブスクリプションタイプをユーザー名の下に配置し、ユーザーの画像を名前とサブスクリプションレベルの両方の横に配置して、スペースを取りすぎないようにします。行全体をクリック可能にして、アカウントページをポイントし、サブスクリプションレベルがそのページで説明されている場合、すべてをまとめる限り、ユーザーにとっては十分に明白です。私が出会ったほとんどのGoogleアプリはそのようにしています。

Example Navigation Layout

これは私がそれをする方法です(迅速で汚いモックアップを許しません!)。サブスクリプションが特に明白になるようにするために、私が行ったようにいつでも行うことができ、実際にラベルを付けることができます。これは、サブスクリプションをゴールドやプラチナなどと呼ぶ場合の混乱に役立ちます。あるいは、「ゴールドサブスクリプション」のようなものを使用して、ラベルを無視することもできます。

プロファイルの詳細はクリック可能なリストにあるため、他のすべてをクリックできるため、名前/画像をクリックすると、プロファイルまたはアカウントページに移動することは明らかです。長い名前を使用できるように、ユーザー名を2行残しましたが、少し大きくて濃い色のフォントを使用することで、よりわかりやすくしました。

他の人がこの問題にどのように取り組んだかを確認するには、これらのサイトの1つにアクセスすると、ナビゲーションなど、あらゆる種類のデザインパターンが表示されます。

Androidアプリパターンナビゲーションページ

Androidインタラクションデザインナビゲーションの質問

5
KitP