design-review-process について
design-review-processは、明確な段階・基準・承認手順を備えたデザインレビューを整えるスキルです。コンセプト、デザイン、引き渡し前、実装QAを扱い、規模やリスクに応じた運用を促します。
主な機能
- 014段階のデザインレビュー設定
- 02ユーザー課題と調査根拠の確認
- 03デザインシステムとアクセシビリティ要件の確認
- 04各状態とエッジケースの網羅
- 05承認と開発受け入れ手順の定義
活用シーン
- 01新規プロジェクトのレビュー体制づくり
- 02開発への引き渡し前の設計確認
- 03実装とデザイン仕様の照合
- 04プロジェクトリスクに応じたレビュー範囲の調整
インストール
コマンドをコピーしてターミナルで実行します。
$
npx skills add https:/インストール後、Claude Code で/design-review-processを入力して読み込まれたか確認します。
詳細
デザインレビューのプロセス
チームのスピードを損なわずに品質を維持するデザインレビュープロセスを確立する専門家です。
担当すること
デザインの品質を確保する、明確なゲート、基準、ワークフローを備えたレビュープロセスを作成します。
レビューゲート
ゲート 1：コンセプトレビュー
- 課題が明確に定義されている
- ユーザーのニーズが調査によって裏付けられている
- 複数のコンセプトが検討されている
- 戦略との整合性が確認されている
- ステークホルダーから意見が集められている
ゲート 2：デザインレビュー
- ビジュアルデザインがブランド基準を満たしている
- インタラクションパターンに一貫性がある
- レスポンシブ時の動作が定義されている
- コンテンツ戦略が適用されている
- デザインシステムのコンポーネントが使用されている
ゲート 3：引き継ぎ前レビュー
- すべての状態（空、読み込み中、エラー、成功）がデザインされている
- エッジケースに対処している
- アクセシビリティ要件を満たしている
- 引き継ぎ仕様が完成している
- 開発者向けの説明を実施している
ゲート 4：実装 QA
- デザインが仕様と一致している
- インタラクションが設計どおりに動作する
- レスポンシブ時の動作が検証されている
- アクセシビリティがテストされている
- クロスブラウザー／デバイスで確認されている
レビュー基準
- ユーザーの課題を解決できているか？
- デザインシステムとの一貫性があるか？
- アクセシビリティに配慮されているか（WCAG AA）？
- すべての状態とエッジケースが考慮されているか？
- 実装可能か？
承認ワークフロー
- デザイナーがチェックリストに照らして自己レビューする
- デザインのピアレビュー
- デザインリードの承認
- ステークホルダーの承認（必要な場合）
- 開発者の受け入れ
ベストプラクティス
- すべてのプロジェクトにすべてのゲートが必要なわけではありません
- プロジェクトの規模とリスクに合わせてプロセスを調整します
- チェックリストを使ってレビューを客観的に行います
- レビューに時間制限を設け、サイクルの長期化を防ぎます
- レビューでの決定事項とその根拠を記録します
コメント
Markdown 対応