product-design-and-ux について
検証済みの根拠と承認済みの範囲を、観察・回復可能なインタラクションに落とし込むプロダクトデザインと UX のスキルです。タスクフロー、インターフェース契約、ユーザビリティ調査の計画、エンジニアリングへの引き継ぎを扱い、視覚表現やツールは指定しません。
主な機能
- 01設計判断を根拠に結び付ける
- 02タスク、役割、復旧をモデル化
- 03フレームワーク非依存の契約を作成
- 04許可されたユーザビリティ調査を計画
- 05エンジニアリングへの引き継ぎを準備
活用シーン
- 01承認済みの製品範囲を動作に変換
- 02中断、エラー、タスク復旧を整理
- 03エンジニアリングの受け入れ証拠を定義
インストール
コマンドをコピーしてターミナルで実行します。
npx skills add https:/ / github.com/ magnus919/ agent-skills --skill product-design-and-uxインストール後、Claude Code で/product-design-and-uxを入力して読み込まれたか確認します。
同梱ファイル
SKILL.md と一緒にインストールされる参考資料やスクリプト。
README.mdevals/business-app-rubric-challenges.mdevals.jsonopenai-reference-inputs.jsonreferences/ai-interaction-and-uncertainty.mdboundaries-and-traceability.mdcontent-and-cognitive-demand.mdembedded-business-agent.mdengineering-handoff.mdexternal-agent-interactions.mdinformation-architecture.mdinteraction-pattern-selection.mdinterface-contracts-and-responsive-behavior.mdscenario-probes.mdsource-index.mdtask-flows-and-state-models.mdusability-testing-and-privacy.mdtemplates/ai-interaction-contract.mdengineering-handoff.mdexternal-agent-handoff.mdinterface-contract.mdoutcomes-to-design.mdscreen-state-inventory.mdtask-flow-state-model.mdusability-study.md詳細
プロダクトデザインとUX
検証済みのエビデンスと決定したスコープを、ユーザーが完了でき、問題が起きても復旧できる、観察可能な振る舞いに落とし込みます。ブランド、ピクセル、CSS、コンポーネントの実装、特定のツールではなく、インタラクションを設計します。
開始前の確認
承認済みのスコープ、成果、ユーザーまたは役割、エビデンスへのリンク、制約、測定可能な体験目標、未決定のプロダクト上の判断を確認します。入力が足りない場合は、推測せず記録します。
- ステークホルダーのエビデンス、検証、または生の調査データが必要ですか?product-discoveryを使用してください。
- 優先順位付け、スコープ、または機能を開発する理由が必要ですか?product-methodologyを使用してください。
- WCAG、ARIA、ネイティブのセマンティクス、またはアクセシビリティテストの詳細が必要ですか?web-accessibilityを使用してください。
- 承認済みのインタラクション契約をソフトウェア仕様とデリバリーのゲートに落とし込む必要がありますか?spec-driven-developmentを使用してください。
- AI を活用した、生成型、予測型、推奨型、またはツールを使用するインタラクションを設計する必要がありますか?AI のインタラクションと不確実性を読み、一般的な契約と併せてAI インタラクション契約を使用してください。モデル評価と可観測性の設計はagent-evals-and-observabilityに、ガバナンスはai-governanceに、実行時の権限はagent-production-operationsに、プロダクトの測定はproduct-analytics-and-measurementに、アクセシビリティはweb-accessibilityに、コストと価値に関する判断はai-operating-economicsに振り分けてください。
- プロダクト外で使用するエージェントに作業を委任し、アプリをまたいで作業を確認または再開する必要がありますか?外部エージェントとのインタラクションを読み、AI インタラクション契約およびタスクフロー契約と併せて外部エージェントへの引き継ぎに記入してください。プロダクトがそのエージェントをホストしている、またはその非公開の会話を参照できると想定しないでください。
ワークフロー
- 各成果と設計上の決定を、
templates/outcomes-to-design.mdを使って根拠に結び付けます。任意のペルソナやジョブを使う場合は、決定に影響を与え、根拠を引用する必要があります。装飾的な属性情報は作成しないでください。 - 目標、コンテンツオブジェクト、用語、権限、見つけやすさ、サービスのコンテキストに基づいて情報アーキテクチャを確立します。
references/information-architecture.mdを読みます。 - 重要なラベル、手順、ステータス、エラー、完了時のコンテンツを定義し、タスクにおける記憶、選択、切り替え、中断、復旧の要求を確認します。ヒューリスティックは、判定を下すためではなく、検証可能な質問を作成するために使います。
references/content-and-cognitive-demand.mdを読みます。 - 引き継ぎ後の受け取り側の作業も含め、関与するすべての役割にわたって重要なタスクをモデル化します。単なる送信、配信、または中間ステータスではなく、意図したユーザーの成果に達するまでを対象にします。判断、代替案、中断、再開、キャンセル、復旧、取り消し不能な操作、副作用、権限の変更、完了を示す証拠を含めます。
references/task-flows-and-state-models.mdを読み、templates/task-flow-state-model.mdを使います。 - フロー、データ、権限、接続状況、リスクによって必要となる状態のみを一覧化します。リスクのある見落としを記録します。
templates/screen-state-inventory.mdを使います。 - コンテンツ、コントロール、アクセシブルなインタラクション要件、アクション、遷移、永続化、権限、レスポンシブ/リフロー動作、テレメトリー、未決事項について、フレームワークに依存しない契約を作成します。
references/interface-contracts-and-responsive-behavior.mdを読み、templates/interface-contract.mdを使います。 - パターンは仮説として扱います。
references/interaction-pattern-selection.mdを使い、代替案、トレードオフ、根拠、仮説を否定する条件を比較します。 - 許可されたユーザビリティ調査のみを計画するか、結果を統合します。
references/usability-testing-and-privacy.mdを読み、templates/usability-study.mdを使います。参加者、同意、観察内容、発言、結果を捏造しないでください。 - 観察可能な受け入れの根拠、依存関係、担当者、ゲート、デプロイ済みの境界での検証を含む、エンジニアリングへの引き継ぎ資料を作成します。
references/engineering-handoff.mdを読み、templates/engineering-handoff.mdを使います。承認済みの動作を spec-driven-development に引き継ぎます。
必要に応じて読み込む
| 必要な内容 | 読み込むもの |
|---|---|
| スコープの境界、トレーサビリティ、隣接するスキルへのルーティング | references/boundaries-and-traceability.md |
| 目標、ラベル、ナビゲーション、見つけやすさ、権限 | references/information-architecture.md |
| 平易な言葉によるコンテンツ、ヒューリスティックレビュー、認知的負荷 | references/content-and-cognitive-demand.md |
| タスクの経路、状態の適用条件、復旧、副作用 | references/task-flows-and-state-models.md |
| インタラクション契約、またはインクルーシブなレスポンシブ動作 | references/interface-contracts-and-responsive-behavior.md |
| パターンの代替案と決定の根拠 | references/interaction-pattern-selection.md |
| ユーザビリティのプロトコル、結果の統合、同意、プライバシー | references/usability-testing-and-privacy.md |
| 引き継ぎ、受け入れ基準、またはデプロイ済みの状態での検証 | references/engineering-handoff.md |
| AI の不確実性、根拠付け、人間による制御、フィードバック、モデル変更の受け入れ | references/ai-interaction-and-uncertainty.md |
| 人が製品の外部にいる自分のエージェントに作業を委任し、アプリの境界を越えて戻ってくる場合 | references/external-agent-interactions.md、templates/external-agent-handoff.md |
| 合成フィクスチャを使った方法論の自己チェック | references/scenario-probes.md |
| 情報源の権威性、ステータス、例 | references/source-index.md |
ガードレール
- アクセシビリティは設計全体に組み込まれていますが、WCAG/ARIA/ネイティブセマンティクスへの準拠とテストの深度は、引き続き
web-accessibilityの担当範囲です。 - 関連する幅、ズーム/リフロー、テキストの拡張/ローカライズ、向き、入力方式、動きを減らす設定、接続品質の低下、中断、再開時の動作を指定してください。デバイスのブレークポイントを設計モデルとして使用しないでください。
[email protected]やINV-DEMO-042などの合成フィクスチャを使用してください。安全でないプロトタイプで、実際の認証情報、支払い、金融アクセス、秘密情報を求めないでください。- ユーザビリティ調査の結果は、範囲が限定されたエビデンスであり、アクセシビリティ適合性、母集団における有病率、分析結果、成果の証明ではありません。
- AI の出力、信頼度、説明、引用、ユーザーフィードバックだけでは、正しさの証明になりません。エビデンスの境界を記録し、モデル品質や統計に関する質問は担当の専門家に引き継いでください。
完了条件
対象範囲内のすべての動作について、追跡可能なエビデンス、適用可能な状態/復旧モデル、観測可能な受け入れ基準がそろい、決定が解決済みであるか、担当者と解決ゲートが設定されるまで作業を続けてください。推測で不足を埋めず、制約と未テストのリスクを報告してください。
組み込み型業務アプリの例
既存のタスク画面内にエージェントを設計する場合は、設備貸出の実例を参照してください。この例では、推奨から確定した効果と復旧まで、既存の AI インタラクション、タスクフロー、エンジニアリングへの引き継ぎに関する契約を満たしています。受け入れプローブは合成設計フィクスチャとして扱い、観測済みのユーザビリティ結果として扱わないでください。
実行可能な AI の推奨については、実行時に権限、レコードのリビジョン、ポリシー、在庫、承認済みアクションダイジェストを再確認してください。承認時の確認だけでは不十分です。コマンドの実行結果が不確かな場合は、再試行する前に永続化されたコマンド ID を照会してください。新しい予約 ID を作成したり、確定済みの副作用を繰り返したりしないでください。部分的な効果は分けて表示してください。