mcpField
M
mobile-first-ui-review

mobile-first-ui-review

github.com/sylphxaiデザイン・UI153 回インストール今日更新
リポジトリ

mobile-first-ui-review について

mobile-first-ui-reviewは、デバイスの制約やアクセシビリティを考慮し、モバイルUIをタッチ体験として評価するスキルです。優先度付きの指摘や、ルールIDに基づく具体的な修正案を作成します。

主な機能

  1. 01モバイルの目的と端末制約の分析
  2. 02タッチフローと階層のレビュー
  3. 03アクセシビリティとプラットフォームの確認
  4. 04重大な問題と改善点の分類
  5. 05ルールID付きの指摘

活用シーン

  1. 01リリース前のモバイル画面レビュー
  2. 02片手操作の改善計画
  3. 03キーボードとセーフエリアの確認

インストール

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

$npx skills add https://github.com/sylphxai/skills --skill mobile-first-ui-review

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

同梱ファイルagents/openai.yamlreferences/mobile-ui-rules.md

詳細

モバイルファースト UI レビュー

モバイルでの操作をネイティブのように快適で素早く、片手でも簡単に行えるようにするには、このスキルを使います。

ワークフロー

  1. モバイルでの主なタスク、画面の種類、デバイスの制約を特定します。
  2. references/mobile-ui-rules.md を読みます。
  3. 階層、操作しやすさ、入力、フィードバック、プラットフォームの UI、アクセシビリティ、失敗時の状態を基準に UI をレビューします。
  4. 重大なブロッカーと、仕上げの改善機会を分けます。
  5. ルール ID を含む具体的なパッチ計画、またはレビュー結果を作成します。

使用しない場合

  • このスキル固有の成果物契約がなくてもベースモデルが対応できる一般的なアドバイスには使用しないでください。

ガードレール

  • スクリーンショットだけに最適化せず、実際のタッチ操作の流れを最適化してください。
  • アクセシビリティ、モーションの軽減、ダイナミックタイプ、安全領域、キーボードの動作を維持してください。
  • 装飾を加える前に、操作の妨げを取り除くことを優先してください。

出力形式

Surface:
Primary mobile job:

Critical issues:
- <rule id> <issue> -> <fix>

Polish opportunities:
- <rule id> <detail> -> <fix>

Accessibility checks:
- Screen reader:
- Focus order:
- Dynamic type / text scaling:
- Motion and animation:

Mobile acceptance checks:
- <check>

コメント