相互作用
手記
このデザイン ガイドは Windows 7 用に作成されたもので、新しいバージョンの Windows では更新されていません。 ガイダンスの多くは原則として適用されますが、プレゼンテーションと例には、現在の設計ガイダンス 反映されていません。
操作は、タッチ、キーボード、マウスなど、ユーザーがアプリを操作するさまざまな方法です。 これらのガイドラインを使用して、タッチ用に最適化されているが、入力デバイス間で一貫して動作する直感的で独特なエクスペリエンスを作成します。
タッチファーストエクスペリエンスのための設計
まず第一に、タッチがユーザーの主要な入力方法であることを期待してアプリを設計します。 プラットフォーム コントロールを使用する場合、タッチパッド、マウス、ペン/スタイラスのサポートには追加のプログラミングは必要ありません。Windows では無料で提供されるためです。
ただし、タッチ用に最適化された UI は、従来の UI よりも優れているとは限りません。 どちらも、テクノロジとアプリケーションに固有の長所と短所を提供します。 タッチ優先 UI への移行では、タッチ (タッチパッドを含む)、ペン/スタイラス、マウス、キーボード入力の主な違いを理解することが重要です。 Windows 8 のタッチでは単にその機能をエミュレートする以上の機能を行うので、使い慣れた入力デバイスのプロパティと動作を当然のことと考えないでください。
すぐに見つかると、タッチ入力には UI デザインに対する別のアプローチが必要です。
タッチ操作の要件を比較する
次の表は、タッチ最適化 Windows ストア アプリを設計するときに考慮する必要がある入力デバイスの違いをいくつか示しています。
因子 | タッチ操作 | マウス、キーボード、ペン/スタイラスの操作 | タッチパッド |
---|---|---|---|
精度 |
指先の接触領域が 1 つの x-y 座標よりも大きいので、意図しないコマンドのアクティブ化の可能性が高くなります。 |
マウスとペン/スタイラスは、正確な x-y 座標を提供します。 |
マウスと同じです。 |
接触領域の形状は、移動全体を通して変化します。 |
マウスの動きとペン/スタイラス ストロークは、正確な x-y 座標を提供します。 キーボード フォーカスは明示的です。 |
マウスと同じです。 |
|
ターゲット設定に役立つマウス カーソルはありません。 |
マウス カーソル、ペン/スタイラス カーソル、キーボード フォーカスはすべて、ターゲット設定を支援します。 |
マウスと同じです。 |
|
人間の解剖学 |
指先の動きは不正確です。1 本以上の指を持つ直線の動きは困難であるためです。 これは、手の関節の曲率と動きに関係する関節の数によるものです。 |
マウスまたはペン/スタイラスを使用して直線の動きを実行する方が簡単です。コントロールする手は、画面上のカーソルよりも短い物理的距離を移動するためです。 |
マウスと同じです。 |
ディスプレイ デバイスのタッチサーフェス上の一部の領域は、指の姿勢とデバイス上のユーザーのグリップによって到達が困難な場合があります。 |
マウスとペン/スタイラスは画面の任意の部分に到達できますが、キーボードからタブ オーダーでコントロールにアクセスできる必要があります。 |
指の姿勢とグリップが問題になる可能性があります。 |
|
オブジェクトは、1 つ以上の指先またはユーザーの手によって隠される可能性があります。 これはオクルージョンと呼ばれます。 |
間接入力デバイスでは、オクルージョンは発生しません。 |
マウスと同じです。 |
|
オブジェクトの状態 の |
タッチは、2 状態モデルを使用します。ディスプレイ デバイスのタッチサーフェイスはタッチ (オン) またはオフ (オフ) のいずれかです。 追加の視覚的フィードバックをトリガーできるホバー状態はありません。 |
マウス、ペン/スタイラス、キーボードはすべて、アップ (オフ)、ダウン (オン)、ホバー (フォーカス) の 3 状態モデルを公開します。 ホバーすると、ユーザーは UI 要素に関連付けられているヒントを調べて学習できます。 ホバー効果とフォーカス効果は、どのオブジェクトがインタラクティブで、ターゲット設定にも役立ちます。 |
マウスと同じです。 |
豊富な対話 |
マルチタッチをサポート:タッチサーフェス上の複数の入力ポイント(指先)。 |
1 つの入力ポイントをサポートします。 |
タッチと同じです。 |
タップ、ドラッグ、スライド、ピンチ、回転などのジェスチャによるオブジェクトの直接操作をサポートします。 |
マウス、ペン/スタイラス、キーボードは間接入力デバイスのため、直接操作はサポートされません。 |
マウスと同じです。 |
ノート
間接入力には、25 年以上の改良の利点があります。 ホバーによってトリガーされるヒントなどの機能は、タッチパッド、マウス、ペン/スタイラス、キーボード入力専用の UI 探索を解決するように設計されています。 このような UI 機能は、これらの他のデバイスのユーザー エクスペリエンスを損なうことなく、タッチ入力によって提供される豊富なエクスペリエンスのために再設計されています。
ここでは、いくつかの一般的なユーザー操作ガイドラインを提供し、これらのトピックのデバイス固有のガイドラインについて説明します。
フィードバック用のビジュアル
アプリとの対話中に適切な視覚的フィードバックを使用すると、ユーザーは、アプリと Windows ビジュアルの両方のフィードバックによって対話がどのように解釈されるかを認識、学習、適応させることができます。これにより、成功した対話を示したり、システムの状態を中継したり、コントロールの感覚を改善したり、エラーを減らしたり、ユーザーがシステムと入力デバイスを理解したり、対話を促したりすることができます。
位置に基づいて精度と精度を必要とするアクティビティに対してユーザーがタッチ入力に依存している場合、視覚的フィードバックは非常に重要です。 タッチ入力が検出されるたびにフィードバックを表示し、アプリとそのコントロールによって定義されているカスタム ターゲット ルールをユーザーが理解するのに役立ちます。
精度を最適化する
タッチ入力には、指の接触領域全体が含まれます。 この接触ジオメトリは、最も可能性の高いターゲット オブジェクトを決定するために使用されます。 コントロールのサイズを変更して、簡単かつ安全にターゲットにできるオブジェクトとコントロールで快適な UI を確保します。
コントロールのサイズ、スペース、配置を行って、ユーザーの操作自体によって UI が隠される指と手のオクルージョンをなくすのに役立ちます。
可能な限り、連絡先領域の上にメニュー、ポップアップ、およびヒントを配置します。
自信を持って制約する
UI 制約を使用して、ずさんな操作を回避または最小化します。
- スナップポイントを使用すると、目的の位置で簡単に停止できます。 スナップポイントは、アプリ コンテンツ内の論理位置を指定します。 認知的には、スナップ ポイントはユーザーのページング メカニズムとして機能し、過剰なスライド、スワイプ、または回転による疲労を最小限に抑えます。 これにより、不正確なユーザー入力を処理し、コンテンツまたはキー情報の特定のサブセットが表示されるようにすることができます。
- モーションの軸を強調する方向 "レール" (垂直または水平)。
時間の経過した操作を回避する
相互作用は時間で区別しないでください。 実行にかかる時間に関係なく、同じ操作の結果が同じである必要があります。 時間ベースのアクティブ化では、ユーザーに必須の遅延が発生し、直接操作のイマーシブな性質とシステムの応答性の認識の両方を損ないます。
時間指定された操作は、通常、実行するコマンドを決定するために、時間、距離、速度などの非表示のしきい値に依存します。 時間指定の操作は、システムがアクションを実行するまで視覚的なフィードバックを持たず、ユーザーは結果を得るために任意の不可視のしきい値に達する必要があります。 対話中の視覚的なフィードバックを瞬時に受け取り、ユーザーはより魅力的で自信を持って、制御を感じるようにします。
オブジェクトに直接影響を与え、現実世界の相互作用を模倣する相互作用は、より直感的で、発見可能で、思い出深いものになります。 あいまいな操作や抽象的な相互作用には依存しません。
注: これに対する例外は、特定の時間指定された対話を使用して学習と探索を支援する場合です (長押しなど)。 適切な説明と視覚的な手掛かりを使用すると、高度な相互作用の使用に大きな影響を与えます。