マウス・UIナビゲーション

UIヒントナビゲーション操作手順書 (UI Hints)

UIヒントナビゲーションは、画面上の操作可能なUI要素（ボタン、リンク、入力欄等）の上にアルファベットの「ヒントバッジ」をオーバーレイ展開し、1〜2打鍵のタイピングだけでマウスポインタを瞬時にジャンプ...

マウスを持たずに、画面上のあらゆるボタン・リンク・入力欄をキーボードだけで直接クリックする手順ガイド

UIヒントナビゲーションは、画面上の操作可能なUI要素（ボタン、リンク、入力欄等）の上にアルファベットの「ヒントバッジ」をオーバーレイ展開し、1〜2打鍵のタイピングだけでマウスポインタを瞬時にジャンプ＆クリックさせる高速操作機能です。

目次

1. 画面上の全要素を即座にクリックする手順 (HintClickAll)

最も素早く目的のボタンやリンクをクリックする基本手順です。

  1. キーボードで Space + m を押します。
  2. 画面上のすべてのUI要素（ボタン、リンク、フォーム等）の上に、2文字のアルファベットヒントバッジ（aa〜zz）がオーバーレイ展開されます。
  3. 目的の要素の上に表示されている 2文字のアルファベット（例: ab）をキーボードでタイピングします。
  4. マウスポインタが目的の要素へ瞬時に自動移動し、左クリックが即座に実行されます。クリック位置に青い波紋（リップルアニメーション）が表示され、ヒントバッジは自動消去されます。

UIヒントナビゲーション 実機デモ
図: UIヒントナビゲーション - Space + m で全要素に2文字ヒントが展開され、2打鍵で即座にクリック

ヒントバッジの背景色とUI要素の種別（カラーコーディング）

展開されるヒントバッジは単一色ではなく、目的の操作対象を一目で直感的に見分けられるよう、UI要素の機能や種別ごとに最適な背景色（Neo-Capsule カラーパレット） で色分けされています。

UIヒント Neo-Capsule カラーパレット一覧
図: UIヒント Neo-Capsule カラーパレット - 要素の役割ごとに最適な背景色と文字色を自動適用

サンプル 背景色 要素の種別 / レイヤー 代表的なUI要素 文字色
履歴 ローズピンク (#F43F5E) マウス履歴 (History) 直近のマウスクリック履歴位置（最優先・2文字ヒント） 白文字
ボタン ディープシアン (#0891B2) ボタン (Button) 押しボタン、OK / キャンセルボタン、ツールバーボタン 白文字
入力欄 アンバー・イエロー (#D97706) 入力欄 (Input) テキストボックス、検索バー、エディタ編集欄 濃紺ブラック文字
リンク ロイヤルブルー (#2563EB) リンク (Link) ハイパーリンク、Webリンク、パンくずリスト 白文字
タブ エメラルドグリーン (#059669) タブ (Tab) タブページ、ブラウザタブ 白文字
メニュー ローズレッド (#E11D48) メニュー (Menu) メニューバー、メニュー項目、コンテキストメニュー 白文字
選択 バイオレットパープル (#7C3AED) 選択・スライダー (Select) コンボボックス、ドロップダウンリスト、スライダー、ツリービュー 白文字
選択肢 クリーンオフホワイト (#F8FAFC) 選択肢・チェック (Choice) チェックボックス、ラジオボタン 濃紺ブラック文字
その他 漆黒スレート (#0F172A) その他 (Others) 静的テキスト、ラベル、表セル、画像、カレンダー項目 白文字
画像認識 リッチテラコッタ (#9A3412) 画像認識要素 (CV) AI Computer Vision で自動検出されたアイコンやカスタムUI部品 白文字
補助 クールスレートグレー (#475569) 補助グリッド (Aux) 画面全体の空白エリアを網羅する補助ナビゲーションバッジ 白文字
確定強調 ビビッドネオンオレンジ (#FF6B00) アクティブ強調 (Active) 1打鍵目入力時に前方一致した候補バッジ（確定ハイライト発光） 白文字（二重発光枠）

[!TIP] 高い視認性設計: すべてのバッジには高精細な白枠線（1.0px）とアンビエントシャドウ（陰影）が施されており、明色テーマ・暗色テーマどちらのウィンドウ背景の上でも文字が埋もれず、瞬時にくっきり判読できるように最適化されています。 誤った文字を入力した場合は、Backspace または Space + f で1文字消去できます。途中でキャンセルしたい場合は Esc または Space + x を押します。

ヒント重複チェックの優先度パイプライン

{HintAll} および {HintClickAll} では、画面上の各ソースからヒント要素を統合する際、以下の優先順位に従って重複（衝突）を厳密に排除し、上位のヒントを優先して保持します：

  1. 第1優先: マウスヒストリー (Mouse History)
    • ユーザーがクリックした最新の座標履歴。本来の {MouseHistory} 単体では1文字バッジですが、万能ヒントモードでは他のヒントとの整合性から**2文字ヒント（例: aa〜）**として最優先配置されます。
  2. 第2優先: UIヒント (UI Automation)
    • カレントウィンドウおよびタスクバー上の操作可能なUI要素。マウスヒストリーと重なる位置にあるUI要素は自動除外されます。
  3. 第3優先: CVヒント (Computer Vision)
    • AI画像認識によって検出された画面上のアイコンやボタン。マウスヒストリーおよびUI要素と重なる候補は自動除外されます。
  4. 第4優先: 補助ヒント (Auxiliary Grid)
    • 画面全体の空いているエリアを埋める補助グリッド。マウスヒストリー、UI要素、CV要素の近傍には生成されず、完全な空白領域のみに配置されます。

2. 要素タイプを絞り込んでヒントを表示する手順 (フィルタヒント)

画面内に要素が多すぎる場合、特定の要素タイプだけを抽出してヒントを表示する手順です。

  1. Space を押しながら、以下のフィルタコマンドを打鍵します：
    • Space + mi (HintInput): テキストボックス・検索バー・入力欄のみを抽出。
    • Space + mb (HintButton): ボタン・チェックボックス・ラジオボタンのみを抽出。
    • Space + ml (HintLink): ハイパーリンクのみを抽出。
    • Space + me (HintSelect) または Space + mc (HintChoice): ドロップダウン・コンボボックス・リスト項目・選択肢のみを抽出。
    • Space + mg (HintGrid): 画面全体を均等グリッドで分割したヒントを表示。
  2. 画面上の該当する要素だけにヒントバッジが表示されます。
  3. 目的の2文字を打鍵して即座にクリックします。

3. ポインタ移動後にクリック操作ガイドを使用する手順

即座にクリックせず、まずポインタを移動させてから右クリックやダブルクリックを選択する手順です。

  1. Space + <m>（長押し）または Space + ma（または Space + mn）を押します。
  2. 画面上の全要素にヒントバッジが表示されます。
  3. 目的の2文字を打鍵します。ポインタがターゲット位置へ移動し、カーソル周囲に操作ガイドリングが表示されます。
  4. ガイドリングが表示されている状態で、以下のいずれかのアクションキーを押します：
    • j または f: 通常の左クリックを実行します。
    • <j>（長押し）: ダブルクリックを実行します。
    • k: 右クリックを実行（コンテキストメニューを表示）します。
    • Space: 拡大鏡グリッド（次節参照）を起動します。
    • Esc: 何もクリックせずガイドを閉じます（ポインタ位置は維持）。

4. 微小なボタンやリンクを拡大鏡グリッドでピンポイント選択する手順 (Zoom Grid)

密集した小さなリンクや、数ピクセルのチェックボックスを確実に狙い撃つ手順です。

  1. 操作ガイドリングを表示します（Space + ma または Space + <m> ➔ 目的の2文字を入力）。マウスポインタがターゲットへジャンプします。
  2. キーボードの Space キーを押します。
  3. カーソル周辺領域を 4倍に拡大した「拡大鏡グリッド」ウィンドウ が画面の適切な位置にポップアップします。
  4. 拡大枠内に 8×8 のアルファベット・数字・記号グリッド（全64文字: AaBbCc...Zz, 1〜0, <, >） が高密度に展開されます。
  5. 目的の位置に対応する 1文字（例: n や大文字 A）を打鍵します。大文字は Shift キーとの組み合わせ、または CapsLock で入力できます。
  6. ポインタが目的のセル位置へピンポイントで移動します。
  7. j キーを押すと左クリックが実行され、確定の青い波紋が表示されます。

UIヒント 拡大鏡グリッド 実機デモ

図: UIヒント拡大鏡グリッド 実機デモ - Space + ma でターゲットへジャンプ後、Space で4倍拡大鏡（8×8グリッド 全64文字）を展開し、1文字打鍵で微小位置へピンポイント移動・クリック

5. キーボードだけでドラッグ＆ドロップを実行する手順 (Drag / QuickDrag)

ファイル移動やスライダー調整など、マウスでドラッグする操作をキーボードのみで完結させる手順です。画面から手を離さずに、起点と終点を指定して安全にドラッグできます。

高速に2箇所を指定してドラッグする手順 (QuickDrag)

ヒントを画面に維持したまま、起点と終点を連続指定する最も素早い方法です。

  1. キーボードで Space + md を押します。
  2. 全画面のUI要素にヒントバッジが展開され、画面上部に「ドラッグ起点設定中」の案内枠（OSD）が表示されます。
  3. ドラッグ開始位置にある要素の 2文字ヒント（例: ba）をタイピングします。
  4. 起点に 赤い丸印（●） が表示され、画面上部の案内枠が「ドラッグ終点設定中」に切り替わります。このときヒントバッジは消去されず画面に残ります。
  5. ドロップ先の要素にある 2文字ヒント（例: dd）をタイピングします。
  6. 終点に 赤い菱形印（◆） が表示され、起点から終点へ向けて 赤い破線矢印 が描画されます。案内枠が「スペースキーでドラッグ実行」に変わります。
  7. Space キーを押します。案内枠とマーカーが消去され、マウスポインタが起点から終点まで自動でドラッグ移動し、左クリックを離します。終点に青い波紋が表示され、ドラッグ＆ドロップが完了します。

UIヒント ドラッグ＆ドロップ 実機デモ

図: UIヒント ドラッグ＆ドロップ 実機デモ - Space + md で起動し、起点（●）と終点（◆）を指定。赤い破線矢印で方向を確認後、Space キーでドラッグ＆ドロップを実行

任意のヒントコマンドと組み合わせてドラッグする手順 (Drag)

ボタン専用ヒントやリンク専用ヒントなど、他のヒントモードと併用して柔軟に位置を指定する手順です。

  1. キーボードで Space + ms を押します。
  2. 画面上部に「ドラッグ起点設定中」の案内枠が表示されます。
  3. 任意のヒント操作（例: ボタン抽出 Space + mb や全要素 Space + m）を起動し、起点の要素を選択します。
  4. 起点に赤い丸印（●）が付き、案内枠が「ドラッグ終点設定中」に変わります。
  5. 再び任意のヒント操作を起動し、終点の要素を選択します。
  6. 終点に赤い菱形印（◆）が付き、起点から終点への破線矢印が表示されます。
  7. Space キーを押すと、起点から終点へドラッグが実行されます。

[!TIP] いつでも安全にキャンセル可能: 起点設定中、終点設定中、または実行待ちのどの段階であっても、キーボードの Esc または Space + x を押すだけで、ドラッグ操作を安全に中止できます。

6. 過去のクリック位置へワンタッチで再ジャンプする手順 (Mouse History)

直前に作業していた画面位置へ、マウスを動かさずに一瞬でカーソルを戻す手順です。

  1. Space + mh を押します。
  2. 過去にクリックした直近26箇所の座標に、ローズ赤の円形バッジ（A〜Z）が画面上にオーバーレイ展開されます。
  3. 戻りたい位置の 1文字（例: C）を打鍵します。マウスポインタが過去のクリック座標へ瞬時にテレポートジャンプします。
  4. 到着後は自動的に操作ガイドが表示され、j（左クリック）または k（右クリック）をキーボードから押すだけで即座にクリック操作が可能です（青い波紋リップルアニメーションで確定表示）。

マウスヒストリー 実機デモ

図: マウスヒストリー（実機デモ） - Space + mh で過去のクリック位置にローズ赤バッジ（A〜Z）が展開。キーボードで1文字打鍵するだけでポインタが瞬時テレポートし、J/Kキーで即座にクリック

7. ヒントの外観や検出感度をカスタマイズする手順

ヒントバッジの配色、タイムアウト時間、CV検出感度を調整する手順です。

  1. タスクトレイの fjFlow アイコンを右クリックし、設定 (Settings) を開きます。
  2. 「マウス」 タブをクリックします。
  3. 以下の項目を調整します：
    • ヒントタイムアウト時間: 表示後に無操作で自動キャンセルされるまでの秒数（デフォルト: 3.0秒）。
    • CV検出感度 (1〜20): Computer Vision エンジンの検出感度スライダー。
    • 波紋アニメーション: クリック時の波紋フィードバックの有効/無効。
  4. 左サイドバー下部の 設定保存 をクリックします。