mcpField
H
hig-inputs

hig-inputs

github.com/raintree-technologyデザイン・UI148648 回インストール6 日前に更新
リポジトリ

hig-inputs について

Apple プラットフォームのアプリで入力方式を計画するデザインスキルです。デザイナーや開発者向けに、タッチ、キーボード、ポインター、Apple Pencil などの操作、フィードバック、アクセシビリティ上の代替手段を説明します。

主な機能

  1. 01プラットフォーム別の入力方式の推奨
  2. 02標準ジェスチャとシステムジェスチャの指針
  3. 03Apple Pencil と Scribble への対応
  4. 04キーボードショートカットとフォーカス順
  5. 05ポインター・コントローラー・空間入力の指針
  6. 06アクセシブルな入力の代替手段

活用シーン

  1. 01iPadOS のタッチとポインター操作の計画
  2. 02Apple Pencil による描画とテキスト入力の仕様化
  3. 03macOS アプリのキーボードナビゲーション設計
  4. 04tvOS または visionOS のフォーカス移動設計

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/raintree-technology/hig-doctor --skill hig-inputs

インストール後、Claude Code で/hig-inputsを入力して読み込まれたか確認します。

同梱ファイル

SKILL.md と一緒にインストールされる参考資料やスクリプト。

references/
apple-pencil-and-scribble.md
camera-control.md
digital-crown.md
eyes.md
focus-and-selection.md
game-controls.md
gestures.md
gyro-and-accelerometer.md
keyboards.md
nearby-interactions.md
pointing-devices.md
remotes.md
spatial-interactions.md

詳細

Apple HIG:入力

質問する前に .claude/apple-design-context.md を確認してください。既存のコンテキストを活用し、まだカバーされていない情報だけを質問してください。

主な原則

  1. 複数の入力方法に対応します。 タッチ、ポインター、キーボード、ペンシル、音声、視線、手、コントローラーに対応します。各プラットフォームで利用できる入力方法に合わせて設計してください。iPadOS ではタッチとポインターの両方に、macOS ではポインターとキーボードの両方に対応します。

  2. すべての入力操作に一貫したフィードバックを提供します。 視覚、音声、または触覚による反応を返します。

  3. 標準ジェスチャの動作に一貫性を持たせます。 タップで起動、スワイプでスクロール/移動、ピンチでズーム、長押しでコンテキストメニューを表示、ドラッグで移動します。システムジェスチャ(戻る、ホーム、通知のための画面端からのスワイプ)を上書きしないでください。

  4. 標準の認識器を使い、カスタムジェスチャは見つけやすくします。 Apple の組み込み認識器は、エッジケースやアクセシビリティに対応します。標準以外のジェスチャを追加する場合は、ヒントやガイダンスを提供して使い方を知らせてください。

  5. Apple Pencil:精密な描画、マークアップ、選択に対応します。 筆圧、傾き、ホバーに対応してください。適切な場合は指と Pencil を区別します(指はパン、Pencil は描画)。

  6. テキストフィールドでスクリブルに対応します。 ユーザーは、あらゆるテキスト入力欄で Pencil を使って文字を書けることを期待しています。

  7. キーボードショートカットと完全なナビゲーションに対応します。 標準ショートカット(Cmd+C/V/Z)に加え、iPadOS の Command キーオーバーレイで確認できるカスタムショートカットを用意します。タブ順序を論理的に設定してください。

  8. ソフトウェアキーボードに配慮します。 キーボードが表示されたときにレイアウトを調整します。キーボード回避 API を使用してください。

  9. ゲームコントローラー:MFi コントローラーと画面上の代替操作に対応します。 拡張ゲームパッドプロファイルに割り当て、使いやすい既定値を設定し、再割り当て可能にします。必ずタッチまたはキーボードによる代替操作も用意してください。

  10. ポインターとトラックパッド:ネイティブな操作感を実現します。 ホバー効果、ポインター形状の適応、標準的なカーソル動作に対応します。2 本指でスクロール、ピンチでズーム、スワイプで移動できるようにします。

  11. Digital Crown:watchOS での主要なスクロールおよび値調整の入力方法です。 リストのスクロール、値の調整、ビュー間の移動に使います。目盛りごとに触覚フィードバックを返します。

  12. 視線と空間操作(visionOS):注視してピンチします。 視線追跡はタッチより精度が低いため、十分に大きなヒットターゲットを用意します。起動に持続的な注視を必要としないでください。没入型の体験では、手による直接操作に対応します。

  13. フォーカスシステム:tvOS と visionOS で重要です。 フォーカス移動を予測しやすくします。すべてのインタラクティブ要素にフォーカスできるようにします。明確な視覚的インジケーター(拡大、ハイライト、浮き上がり)を表示します。フォーカスグループを論理的に構成してください。

  14. Siri Remote:操作面が限られています。 タッチエリアでのスワイプ、クリックパッドでの選択、少数の物理ボタンを前提にします。操作をシンプルにしてください。

  15. ジャイロスコープ、加速度計、UWB:慎重に使用します。 ゲーム、フィットネス、AR に適しています。不可欠なタスクには使用しないでください。キャリブレーションとリセットの手段を用意します。UWB では、視覚または触覚による合図で距離と方向を伝えてください。

リファレンス一覧

リファレンストピック主な内容
gestures.mdタッチジェスチャタップ、スワイプ、ピンチ、長押し、ドラッグ、システムジェスチャ
apple-pencil-and-scribble.mdApple Pencil精度、筆圧、傾き、ホバー、手書き
keyboards.mdキーボードショートカット、ナビゲーション、ソフトウェアキーボード、Commandキー
game-controls.mdゲームコントローラーMFi、拡張ゲームパッド、再割り当て、代替手段
pointing-devices.mdポインター/トラックパッドホバー、カーソルの形状変化、トラックパッドジェスチャ
digital-crown.mdDigital Crownスクロール、値の調整、触覚的なクリック感
eyes.md視線トラッキング見てタップ、視線によるターゲット指定、ヒットターゲットのサイズ
spatial-interactions.md空間入力手のジェスチャ、直接操作、没入型入力
focus-and-selection.mdフォーカスシステムtvOS/visionOS のナビゲーション、フォーカスインジケーター、グループ
remotes.mdリモコンタッチサーフェス、クリックパッド、シンプルな操作
gyro-and-accelerometer.mdモーションセンサージャイロスコープ、加速度計、キャリブレーション、ゲーム
nearby-interactions.md近接インタラクションU1 チップ、方向の検出、近接トリガー
camera-control.mdCamera ControliPhone のカメラハードウェアボタン、クイック起動

出力形式

  1. プラットフォーム別の入力方式の推奨事項と、それらの連携方法。
  2. ジェスチャ仕様の表 -- 標準ジェスチャとカスタムジェスチャ、および期待される動作。
  3. システムの規約に沿ったキーボードショートカットの推奨事項。
  4. VoiceOver、スイッチコントロールなどのアクセシビリティ入力の代替手段。

確認事項

  1. 対象のプラットフォームと入力デバイスは何ですか?
  2. 生産性向けアプリですか、それともカジュアルアプリですか?
  3. デザインにカスタムジェスチャはありますか?
  4. ゲームコントローラーへの対応は必要ですか?

関連スキル

  • hig-components-status -- 入力に応じて反応する進行状況インジケーター(プルして更新)
  • hig-components-system -- 独自の入力制約があるシステムエクスペリエンス
  • hig-technologies -- VoiceOver、Siri の音声入力、ARKit の空間ジェスチャのコンテキスト

Raintree Technology が作成 · その他の開発者向けツール

コメント