mcpField
F
flutter-accessibility

flutter-accessibility

github.com/musabekisakov-imjデザイン・UI441 回インストール14 週間前に更新
リポジトリ

flutter-accessibility について

flutter-accessibility は、Flutter プロジェクトのアクセシビリティを監査し、実装するためのスキルです。支援技術による操作、文字拡大、コントラスト、ローカライズ、動きを扱い、自動検査と手動確認を区別した報告を求めます。

主な機能

  1. 01セマンティクスと支援操作の監査
  2. 02文字拡大とコントラストの検証
  3. 03ローカライズと RTL レイアウトの確認
  4. 04ネイティブのセマンティックコントロールを優先
  5. 05検証結果と未確認事項の報告

活用シーン

  1. 01リリース前の Flutter アプリ審査
  2. 02キーボードとスクリーンリーダー操作の確認
  3. 03翻訳および双方向 UI のテスト

インストール

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

$npx skills add https://github.com/musabekisakov-imj/flutter-design-engineer --skill flutter-accessibility

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

同梱ファイル

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

agents/
openai.yaml
references/
accessibility-and-localization.md
connected-product-workflows.md

詳細

Flutter のアクセシビリティ

コアタスクを妨げるアクセシビリティ上の問題は、リリースを妨げる重大な問題として扱います。

監査

  1. コアとなる利用経路と、対応プラットフォームで関連する支援機能を特定します。
  2. セマンティクス、ラベル、値、ヒント、グループ化、見出し、ライブ更新、装飾要素の除外を確認します。
  3. 利用可能な場合は、キーボード、スイッチに似たフォーカス操作、スクリーンリーダーを使って操作します。
  4. 重要な操作が切れたり隠れたりしないことを確認しながら、対応する最大値までシステムの文字サイズを拡大してテストします。
  5. コントラスト、色以外の手がかり、タッチターゲット、エラーとの関連付け、無効状態の明確さ、モーション設定を確認します。
  6. 長い翻訳文、複数形、双方向テキスト、ナビゲーションの反転、アイコンの向きが正しいことをテストします。
  7. references/accessibility-and-localization.md と、プロジェクトにすでにある関連プラットフォームのガイドラインを読みます。 複数ドメインのダッシュボードでは、references/connected-product-workflows.md を読み、セマンティクスの順序を複数ドメインにまたがる視覚的な優先順位に合わせます。

実装

  • カスタムのジェスチャー操作よりも、セマンティクスを備えた Flutter のネイティブコントロールを優先します。
  • セマンティクスの統合または除外は意図的に行い、同じ内容が重複して読み上げられないようにします。
  • フォーカス順序を視覚的な順序とタスクの順序に合わせます。
  • 過剰な読み上げを避けながら、非同期エラーや重要な状態変化を通知します。
  • レイアウトを反転させる場合は、論理方向 API(start/end)を使います。
  • 脆弱なレイアウトを保護するために、テキストの拡大を無効にしないでください。
  • 必要なフィードバックを取り除くことなく、モーションを抑えた動作を提供します。

検証と報告

テストしたツール、プラットフォーム、文字サイズ、ロケール、方向、テーマ、利用経路を明記します。自動チェックと支援技術による手動検証を区別し、未対応の項目があれば明示します。

コメント