mcpField
S
superior-ux

superior-ux

github.com/kodekateamデザイン・UI2158 回インストール2 日前に更新
リポジトリ

superior-ux について

プロダクトやデザインチーム向けのUXスキルです。ユーザーの目標、観察可能な証拠、回復可能な操作を軸に体験を構成し、前提や評価、関連スキルとの連携範囲も定めます。

主な機能

  1. 01体験の契約を定義
  2. 02目標に沿ったユーザージャーニーの設計
  3. 03操作と回復状態の仕様化
  4. 04証拠に基づく評価
  5. 05関連スキルとの連携

活用シーン

  1. 01複数段階のプロダクトフローの計画
  2. 02エラーや中断からの回復の確認
  3. 03利用可能な証拠に基づくジャーニー評価

インストール

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

$npx skills add https://github.com/kodekateam/superior-skills --skill superior-ux

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

同梱ファイル

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

references/
interaction-feedback-and-recovery.md
journeys-task-flows-and-information-architecture.md
ux-evaluation-and-evidence.md

詳細

優れたUX

ユーザーが有意義な成果にたどり着くまでの道筋を、明確で一貫性があり、行き詰まっても立て直せるものにします。判断はプロダクトの根拠と観察可能な振る舞いに基づいて行い、プロジェクトで裏付けられていない調査、ペルソナ、確信度を捏造しないでください。

体験の契約を定める

フローを提案する前に、次の点を特定します。

  • 主なユーザー、目的、状況、開始地点。
  • 成功の成果と、ユーザーがそれをどう認識するか。
  • 必要な判断、情報、権限、制約。
  • 既存の経路、画面、用語、分析、調査、サポートの根拠、プロダクトのルール。
  • 完了に大きく影響する中断、失敗、代替経路、再訪。

観察された根拠と仮定を分けます。競合する仮定によって、プロダクトが誰に価値を提供するのか、同意が何を意味するのか、どのような成果を成功とみなすのかが変わる場合は、方針を確認してください。それ以外の場合は、変更しやすい最小限の仮定を用い、明示します。

複数のステップ、画面、役割、開始地点、ナビゲーション階層にまたがる作業では、references/journeys-task-flows-and-information-architecture.mdを読んでください。

ジャーニーを設計する

  • 現在の画面構成や組織の内部構造ではなく、ユーザーの目標を起点にします。
  • 開始、状況の把握、次のアクション、進捗、完了、再開を理解しやすくします。
  • 必須のステップと、任意の補足情報を区別します。理解、同意、正確性、復旧を守るために必要な場合にのみ、ステップを追加します。
  • 選択肢を比較しやすくし、画面をまたいで用語を統一します。
  • 複雑さは関連するタイミングで示し、重要な結果を隠したり、すべての選択肢を一度に表示したりしないでください。
  • プロダクトの契約で許される場合は、安全に戻る、中止する、保留する、修正する、再開する手段を用意し、ユーザーの主導権を保ちます。

インタラクションと復旧を定義する

重要なアクションごとに、実行前、実行中、実行後にユーザーが何を確認できるかを定義します。該当する場合に限り、処理待ち、成功、一部成功、入力検証エラー、依存先の障害、中止、再試行を網羅します。

フローにフォーム、非同期処理、破壊的なアクション、外部への引き継ぎ、中断、複数ステップの状態管理が含まれる場合は、references/interaction-feedback-and-recovery.mdを読んでください。

コスト、同意、セキュリティ上の影響、破壊的な作用、重要な代替案を隠して、完了率を高めようとしないでください。安全であれば、想定される失敗の後も入力データを保持し、行き止まりではなく、ユーザーが次の行動を取れる状態に戻します。

根拠に基づいて評価する

代表的なシナリオを、開始から成果まで順に確認します。重要な失敗または中断のシナリオを少なくとも1つ含めてください。ユーザーが次の質問に答えられるか確認します。

  1. ここはどこで、何ができますか?
  2. 続行すると何が起こりますか?
  3. 今、何が起きていますか?
  4. アクションは成功しましたか?次に何をすればよいですか?
  5. どうすれば安全に復旧する、または終了できますか?

ヒューリスティック評価、根拠の質、シナリオの選定、ユーザビリティ検証については、references/ux-evaluation-and-evidence.mdを読んでください。調査の根拠が裏付ける確信度に合わせて、発見事項をリスクまたは観察された問題として記述します。専門家による一連の操作確認を、ユーザー調査として提示しないでください。

担当範囲

契約内容を実質的に変えるスキルだけを読み込みます。

  • superior-ui:視覚的な階層、コンポーネントの構成、インターフェースの実装;
  • superior-logic:ドメインの動作、状態遷移、API、永続化;
  • superior-responsive:ビューポートに応じた再配置と適応型ナビゲーション;
  • superior-accessibility:キーボード操作、フォーカス、セマンティクス、支援技術、インクルーシブな操作;
  • superior-copy:ラベル、説明、エラー、プロダクトのトーン;
  • superior-testing:専用のジャーニー、契約、回帰テストの設計;
  • superior-docs:変更後のエクスペリエンス契約を長期にわたって維持する必要がある場合。

ユーザーがジャーニー、フロー、レビューのみを求めている場合、実装を編集しないでください。実装を求められた場合は、このスキルでエクスペリエンス契約を定め、実装を担当するスキルでコードを変更します。

提出内容

現在と提案後のジャーニー、変更した判断や情報構造、インタラクションと復旧に関する契約、裏付けとなる証拠、未解決の前提、実施した検証を報告します。順序や分岐を文章だけでは理解しにくい場合は、簡潔なフロー図や状態テーブルを優先してください。

コメント