説明 UI のガイドライン

アプリでの特定のタッチ操作など、ユーザーにとって自明ではない機能について、ユーザーに伝えると有用な場合があります。 このような場合は、ユーザーが気付かない場合もある機能について、ユーザー インターフェイス (UI) を使ってユーザーに指示を表示する必要があります。

説明 UI を使う状況

説明 UI は、慎重に使用します。 多用されると、煩わしく、無視されやすくなり、効果が低くなります。

説明 UI は、タッチ ジェスチャや、ユーザーが関心を持つ設定など、重要だが自明でないアプリの機能をユーザーに示すために使用します。 アプリの新機能や変更点など、知らせない場合には見落とす可能性のある情報を、ユーザーに知らせるためにも使用できます。

アプリがタッチ ジェスチャに依存したものでない場合には、アプリの基本的な機能をユーザーに説明するために説明 UI を使用しないようにします。

説明 UI の作成の原則

ユーザーにとって適切で、ユーザーのためになるように、説明 UI を使うと、ユーザー エクスペリエンスを向上できます。 次のようになります。

  • シンプル: 複雑な情報でユーザーのエクスペリエンスを中断しないようにします。
  • 覚えやすい: タスクを実行するたびに、ユーザーに毎回同じ説明をする必要がないように、説明を覚えやすいものにします。
  • その場に適切である: 説明 UI が、ユーザーが今実行している操作に直接関連するものでない場合には、ユーザーにとって注意を払う必要性がありません。

説明 UI は多用せずに、適切なものに限るようにします。 次のような内容を説明するために使用しないようにします。

  • 基本的な機能: アプリを使うためにユーザーに説明を必要とする場合には、アプリの設計をより直感的なものにすることを検討します。
  • 自明な機能: 説明なしでもユーザーが機能を理解できる場合には、説明 UI はユーザーの妨げになります。
  • 複雑な機能: 説明 UI は簡潔である必要があります。複雑な機能に関心のあるユーザーは、通常、自分で情報を検索するので、表示する必要はありません。

説明 UI がユーザーの妨げにならないようにします。 次の行為は禁止とします。

  • 重要な情報を見えなくする: 説明 UI がアプリの他の機能の妨げにならないようにします。
  • 参加を強制する: ユーザーが説明 UI を無視しても、アプリの操作を進められる必要があります。
  • 情報を繰り返し表示: ユーザーが最初に無視した場合、説明 UI はユーザーを何度もわずらわせないようにします。 説明 UI の再表示を設定に追加するのは、優れたソリューションです。

説明 UI の例

ここでは、説明 UI がユーザーの習得に役立ついくつかの例を示します。

  • ユーザーがタッチ操作を見つけられるようにする。 次のスクリーン ショットには、Cut the Rope というゲーム内でタッチ ジェスチャを使う方法をプレイヤーに教える説明 UI が示されています。

    screen shot from game showing instructional ui message,

  • 第一印象を良くする。 ムービー モーメントの初回起動時には、ユーザー エクスペリエンスが妨げられることなく、説明 UI で、ユーザーはビデオの作成を始めるように求められます。

    launch screen for movie moments app

  • 複雑なタスクの次の手順にユーザーを導く。 Windows メール アプリの受信トレイの下のヒントは、以前のメッセージにアクセスできるように、[設定] にユーザーを導きます。

    cropped screen shot of windows mail app showing instructional ui message

    ユーザーがメッセージをクリックすると、アプリの設定ポップアップが画面の右側に表示され、ユーザーがタスクを実行できるようになります。 次のスクリーン ショットは、ユーザーが説明 UI のメッセージをクリックする前後のメール アプリを示しています。

    変更前 クリック後
    screen shot of windows mail app screen shot of windows mail app with an extended settings flyout