design-critique について
デザインレビューとフィードバックを進行するためのフレームワークです。デザイナー、レビュアー、進行役に向けて、段階的なレビュー手順やフィードバック形式、デザイン段階ごとの観点を示します。
主な機能
- 01段階的なレビュー手順
- 02構造化されたフィードバック手法
- 03実行可能な意見と好みを区別
- 04デザイン段階に応じて観点を調整
- 05リモートレビューと議論のガイド
活用シーン
- 01チームでインターフェースのデザインレビューを実施
- 02プロトタイプへの具体的で実行可能な意見を収集
- 03レビュー結果を記録し次の対応を決定
インストール
コマンドをコピーしてターミナルで実行します。
npx skills add https:/インストール後、Claude Code で/design-critiqueを入力して読み込まれたか確認します。
詳細
デザインレビューのフレームワーク
デザインのフィードバックを伝え、受け取るための体系的なアプローチです。
レビューの前に
発表者の準備
-
背景を伝える
- どのような問題を解決しようとしていますか？
- 対象ユーザーは誰ですか？
- どのような制約がありますか？
-
範囲を定める
- この成果物はどの段階にありますか？
- どのようなフィードバックが必要ですか？
- 対象範囲外は何ですか？
-
事前に資料を共有する
- デザインファイルまたはプロトタイプ
- ユーザーリサーチの結果
- ビジネス要件
ファシリテーターの準備
- 制限時間を設定する
- フィードバックの形式を定める
- 質問を用意する
レビューの構成
1. 発表（5～10分）
発表者が共有する内容：
- 問題の説明
- ユーザーのニーズ
- デザインの解決策
- 具体的な質問
2. 確認のための質問（5分）
レビュアーは、次の点を理解するために質問します：
- 「～の場合はどうなりますか？」
- 「どのようにして～と決めましたか？」
- 「どのような代替案を検討しましたか？」
3. フィードバックラウンド（15～20分）
各レビュアーが、以下の形式を使って気づいた点を共有します。
4. ディスカッション（10分）
- 重要なテーマを掘り下げる
- 次のステップを特定する
- 変更の優先順位を決める
フィードバックの形式
「良い点、改善したい点、もし～なら」の方法
良い点 うまくいっていること 「オンボーディングのフローによって、ユーザーの負担が軽減されている点が良いと思います。」
改善したい点 改善の余地があること 「エラー状態の説明が、もっと役立つものだと良いと思います。」
もし～なら 検討したいアイデア 「進行状況を示すインジケーターを追加したらどうでしょうか？」
観察の方法
観察 → 影響 → 提案
「CTAがスクロールしないと見えない位置にあることに気づきました。コンバージョンが減る可能性があります。最初の画面内に配置してテストすることを検討してください。」
フィードバックの種類
実行可能なフィードバックと好みによるフィードバック
実行可能なフィードバック（こちらを伝える） 「このボタンのコントラスト比は2.8:1で、WCAG AAの基準を満たしていません。コントラストを少なくとも4.5:1に上げてください。」
好みによるフィードバック（こちらは避ける） 「この青色は好きではありません。代わりに緑色にしてください。」
具体的なフィードバックと曖昧なフィードバック
具体的なフィードバック（こちらを伝える） 「フォームには12個のフィールドがあります。認知負荷を軽減するために、段階的に情報を開示する方法を検討してください。」
曖昧なフィードバック（こちらは避ける） 「圧倒されるような感じがします。」
デザインの段階ごとのフィードバック
初期の探索段階
重視する点：
- 問題の定義
- コンセプトの方向性
- ユーザーニーズとの整合性
避ける点：
- ビジュアルの細かな仕上げ
- ピクセル単位のフィードバック
- 実装に関する懸念
中程度の忠実度
重視する点：
- 情報アーキテクチャ
- ユーザーフロー
- インタラクションパターン
避ける点：
- 最終的な文言への批評
- 色やフォントの細部へのこだわり
- エッジケース
高忠実度
重視する点：
- ビジュアルの一貫性
- アクセシビリティへの準拠
- コンテンツの品質
- エッジケース
フィードバックを受け取る
すること
- 返答する前に最後まで聞く
- メモを取る
- 不明点を質問する
- レビュアーに感謝する
- 対応事項についてフォローアップする
しないこと
- すべての判断を弁護する
- フィードバックを言いくるめて退ける
- 個人攻撃として受け取る
- フィードバックに繰り返し現れる傾向を無視する
ファシリテーションのヒント
時間管理
- 明確な時間枠を設定する
- タイマーを使う
- 必要に応じて丁寧に話を遮る
参加を促す
- 全員に順番に発言してもらう
- 発言の少ない人にも声をかける
- 発言力の強い人の発言を制限する
脱線を防ぐ
- 脱線した話題を元に戻す
- 議題から外れた項目は保留にする
- 重要な点を要約する
結果を記録する
- すべてのフィードバックを記録する
- 優先事項を記録する
- 各アクションアイテムの担当者を決める
リモートレビューのベストプラクティス
- コラボレーションツール（Figma、Miro）を使う
- コメント機能を有効にする
- 発言していないときはミュートにする
- 積極的な参加を促すためにビデオを使う
- 欠席したチームメンバー向けに録画する