片手でのジェスチャー

スマートウォッチは外出先での使用に最適ですが、両手がふさがっていると操作が難しくなります。これに対応するため、Wear OS 7 では、OEM 向けの新しい片手操作ジェスチャー フレームワークと、Wear OS で Jetpack Compose を使用するデベロッパー向けのジェスチャー API が導入されています。この基盤となるフレームワークは、Google Pixel Watch デバイス(Google Pixel Watch 3 以降)でのみ採用されていますが、すべてのメーカーが利用できます。この API をサポートすることで、他の OEM がオプトインすると、アプリのジェスチャー サポートがエコシステム全体に自動的に拡大されます。

シームレスなタッチフリー エクスペリエンスを構築するには、以下のガイドラインに沿って、片手操作のジェスチャーがアプリのエクスペリエンスに適しているかどうかを判断してください。

サポートされているジェスチャーとアクション

Wear OS ジェスチャー フレームワークは、プライマリ アクションと閉じるアクションの 2 種類のジェスチャーをサポートしています。Google Pixel Watch では、メイン アクションはダブルピンチ ジェスチャーに、閉じるアクションは手首を回すジェスチャーにマッピングされます。

ダブルピンチ: メイン アクションをトリガーします。
手首を回す: 閉じるアクションをトリガーします。

メインの操作

プライマリ アクションは、ユーザーが画面やページで完了できるメインタスク(電話に出る、メディア コントロールで再生 / 一時停止を切り替えるなど)にマッピングする必要があります。ページがスクロール可能な場合、アプリは一度に 1 つの UI 要素のみをプライマリ アクションにマッピングできます。

電話に出る。
メディア コントロールで再生と一時停止を切り替えます。

作動中のアラームをスヌーズします。
スクロール可能なコンテンツをスクロールします。

ダブルピンチは、ユーザーがジェスチャーや音声で UI 要素に移動できる場合、または要素が自動的に開く場合(通知やメディア コントロールなど)に最も便利です。UI 要素に移動する唯一の方法がタップまたはボタンである場合、そのアクションはメイン アクション ジェスチャーのユースケースとして適切ではありません。

操作を閉じる

デフォルトでは、閉じるアクションはシステムの「戻る」にマッピングされ、前の画面に戻ります。アプリは特定のユースケースで手首を回す動作をオーバーライドできますが、これらの例外は、閉じる、ミュート、最小化のコンセプトに沿っている必要があります。オーバーライドの例としては、通話を非表示にするのではなくミュートする、通知を非表示にするのではなく閉じるなどがあります。このアクションは、アプリ内の任意の操作にマッピングしないでください。そうすると、戻るコマンドまたは閉じるコマンドの一貫したインジケーターとして閉じるアクションを使用するというユーザーモデルが壊れてしまいます。

また、アクティブなワークアウト画面や緊急通報中など、誤ってトリガーされるリスクがある場合は、画面の非表示アクションを無効にすることもできます。特定の画面で手首を回す操作を無効にするには、閉じるアクションをサブスクライブしますが、ディスパッチされたジェスチャー イベントに対して何も行いません。つまり、空のサブスクリプションを提供します。

クイック ジェスチャーのガイドライン

Wear OS ジェスチャー フレームワークは、割り込みとコントロールを処理するように設計されています。スマートウォッチのナビゲーションを完全に有効にすることを目的としたものではありません。アプリで片手操作ジェスチャーを採用する際のガイドラインは次のとおりです。

  1. ナビゲーションを最小限に抑える: 通知を閉じる、メディアを一時停止して再開するなど、1 回限りの操作にはジェスチャーを使用します。
  2. スクロールは控えめに使用する: メインのジェスチャー(ダブルピンチ)を使用してスクロールできますが、スクロール可能なすべてのコンテンツでこれがデフォルトの操作になるべきではありません。次の条件を満たせる場合にのみ、ジェスチャー スクロールを有効にします。
    • ユーザーは、片手で、またはジェスチャーや音声コマンドを使用したり、メディア コントロールやマップ ナビゲーションなどの自動起動画面で、ハンズフリーでスクロール ビューにアクセスできます。
    • コンテンツは、ワークアウトの概要など、一目で価値がわかるもので、オプションの単一ボタン以外に操作を必要としません。このボタンは、ビューにスクロールされたら、メインのジェスチャー操作(完了エッジボタンなど)も実行できます。
  3. 行き止まりを避ける: ジェスチャー操作によって、タッチスクリーンや物理ボタンを使用しないとユーザーが先に進めなくなるような行き止まりが生じないようにします。
  4. 非表示のアクションを避ける: ジェスチャーのみのアクションは非表示にしないでください。ユーザーがダブルピンチでアクションを実行できる場合、同じタスクを実行する、タップ可能なボタンが表示されていなければなりません。ただし、手首を回して戻るなどのユニバーサル アクションは例外で、ユーザーの意図を予測することは困難です。

ジェスチャー操作のフローとフィードバック

ジェスチャーが利用可能で、ユーザーがジェスチャーを行うと、次のイベント シーケンスが発生します。

  1. ジェスチャーのヒント: メイン アクションのジェスチャーが利用可能な場合、ジェスチャーを実行する手のイラストが画面に表示され、どのジェスチャーが利用可能か、どの UI 要素に対してジェスチャーが機能するかをユーザーに知らせます。通常、画面上の UI 要素にマッピングされない限り、ヒントは閉じるアクションに対して表示されません。
  2. 触覚フィードバック: ジェスチャー操作が正常に処理されると、短く歯切れのよい触覚が再生されます。
  3. 音と視覚的なフィードバック: タッチ操作で発生する UI 要素に関連付けられた音や視覚的なフィードバックは、ジェスチャー操作でもトリガーされる必要があります。一貫したエクスペリエンスを提供するには、アプリの既存のタッチ音声コールバックとビジュアル コールバックをジェスチャー イベントにフックする必要があります。

    例: カメラには、ジェスチャーでトリガーする必要があるシャッター音とボタン操作が関連付けられています。

ジェスチャーに関するヒント、説明、設定

ジェスチャー操作を検出できるようにするため、Google Pixel Watch には、時計上のインタラクティブなチュートリアルと、Gesture API 内のヒント フレームワークが用意されています。ジェスチャー設定は、システム設定(Google Pixel Watch の場合は [設定] > [ジェスチャー] > [ハンド ジェスチャー])にも用意されています。

チュートリアル オンボーディング

Google Pixel Watch では、インタラクティブなチュートリアルと Google Pixel のヒントでハンド ジェスチャーを紹介しています。アプリ内で独自のジェスチャー チュートリアルを作成する必要はありません。代わりに、Wear OS の Jetpack Compose が提供するコンテキスト内ヒントを活用して、アプリ内でジェスチャーを利用できる場所をユーザーに知らせてください。

ダブルピンチのオンボーディング チュートリアル画面。
手首を回すオンボーディング チュートリアル画面。

コンテキスト ヒント

アプリ内のジェスチャーをユーザーが見つけやすくするには、ジェスチャー操作と物理的なアフォーダンスを関連付けるヒントを提供します。控えめなヒントは、他の UI 要素の妨げを最小限に抑えながら、より明確で読みやすくなります。

コンテキスト内ヒントの種類は次のとおりです。

  • ボタンのヒント
    • ボタンなどの UI 要素内にアニメーション アイコンとして表示され、その要素内の通常のコンテンツ(ボタンのラベルやアイコンなど)を一時的に非表示にします。
  • フローティング ヒント
    • 小さなバブル オーバーレイ内に含まれるアニメーション アイコン。ジェスチャーが影響する UI 要素を指します。フローティング ヒントは通常、ヒントの対象となる UI 要素が小さすぎてヒントを表示できない場合に使用されます。主な例はスクロールです。ヒント バブルがスクロールバーを指し、プライマリ ジェスチャーでスクロールすることを示します。
    • ヒントは、いずれかの基本方角(上、下、左、右)を指すことができます。

ボタンのヒント

ボタンのヒントの例

既存のアイコンまたはテキストと一時的に入れ替わります。

フローティング ヒント

フローティング ヒントの例

ボタンのヒントを表示するには小さすぎる画面上の要素を指します。

色のガイダンス:

  • ボタンのヒント
    • デフォルトでは、アニメーション ベクター型ドローアブル(AVD)の色は、ボタンのアイコンまたはテキストの色(LocalContentColor)に合わせて調整されます。
    • 必要に応じて、AVD をカスタムカラーに色付けできます。ただし、一般的には、適切なコントラストを確保するために、一時的に置き換えるコンテンツと同じ色にする必要があります。
  • フローティング ヒント
    • Tertiary 色がヒント コンテナに適用されます。
    • AVD の色が onTertiary に着色されています。
    • ヒントの色と背景の図形の色をカスタマイズできます。

ボタンのヒントの色に関するガイダンス

ボタンのヒントの色に関するガイダンスの例

AVD の色はボタンのアイコンまたはテキストの色と一致します。

フローティング ヒントの色に関するガイダンス

フローティング ヒントの色に関するガイダンスの例

ヒント コンテナは Tertiary を使用し、AVD は onTertiary を使用します。

ヒントのケイデンス ルール:

ユーザーがジェスチャーを見つけられるように、プラットフォームでは、操作ごとにヒントを表示する頻度を設定できます。ヒントのケイデンス ロジックは、エクスペリエンスごとではなくグローバルです。Wear OS ジェスチャー フレームワークはケイデンスを制御し、ユーザーがケイデンスを調整するための設定(Google Pixel Watch の場合、[ジェスチャー] > [手のジェスチャー] > [ジェスチャーのヒント])を公開します。

  • ボタンのヒント
    • ジェスチャー アクションを含むアプリの初回起動時、またはジェスチャー アクションを導入するアプリの更新時に、そのアクションのヒントが少なくとも 1 回表示されます。ヒントは、ユーザーが定義した頻度([常時]、[毎日]、[毎月] など)に基づいてのみ再度表示されます。ヒントはデフォルトで [常に] に設定されています。
  • フローティング ヒント
    • フローティング ヒントは隣接するコンテンツを覆い隠すため、1 つの体験につき 1 日に 1 回までしか表示されません。グローバル ヒントのケイデンスが 1 日 1 回よりも少ない頻度(毎日)に設定されている場合、システムはその頻度の低いケイデンスを使用します。
Google Pixel Watch のジェスチャー ヒントの設定画面
Google Pixel Watch のジェスチャー ヒントの設定画面

参考情報

アプリで片手操作のジェスチャーを実装する方法に関するデベロッパー向けガイダンスについては、Wear OS でスマートウォッチ向けのアプリを作成する方法をご覧ください。