セットアップ
プラグインを試す
Designプラグインには、画面やPRをトークンファイルおよびコンポーネントインベントリと比較するようにすでに構成された/design-systemが付属しています。管理者がプラグインを管理していて、まだ利用できない場合は、この手順をスキップしてください。以下の内容はこれを必須としません。
/design-systemAudit, document, or extend your design system./ux-copyWrite or review UX copy — microcopy, error messages, empty states, CTAs.ツールを接続する
Claude Coworkは、お使いのシステムと直接連携することでより強力になります。権限とアクセスはあなたが管理します。ツールアクセスについて学ぶ(新しいタブで開きます)。
設定するには、Coworkでカスタマイズ → コネクタに移動してください。
作業フォルダを設定する
使用するファイル(本番スクリーンショット、レビュー対象のPR差分、トークンファイル、コンポーネントインベントリ)をマシン上の1つのフォルダにドラッグし、Coworkにそのフォルダを指定してください。Coworkはそこから読み取り、ドリフトレポートをそこに書き戻します。デザインQAを定期的に実行する場合は、そのフォルダからCoworkプロジェクトを作成(新しいタブで開きます)して、システムソースを常に紐付けておいてください。
プロンプト
これをClaude Coworkにコピーする
このフォルダ内の本番公開済みの画面とオープンなPRを当社のデザインシステムと照合してレビューしてください。それぞれについて、トークン、コンポーネント、スペーシング、またはインタラクションパターンからドリフトしている箇所をすべて列挙し、深刻度を評価し、システムに準拠した修正案を提案してください。すでに一致しているものはスキップしてください。
これが効果的な理由
確認すべき内容を明確にする。 トークン、コンポーネント、スペーシング、インタラクション:チェックリストは明示的です。
各指摘事項に深刻度を求める。 トリアージは今スプリントで何を修正すべきか分かります。
除外すべきものを伝える。 レポートには作業内容のみが含まれ、ノイズは含まれません。
参照ファイルをフォルダに入れる。 トークンとインベントリは記憶されるのではなく、読み取られます。
より良いドラフトを得る
参考にする例を追加する。 気に入っている例をフォルダに入れると、Coworkはその構成とトーンに合わせます。
不確実な点をフラグするよう依頼する。 「確信が持てない箇所にフラグを付けて」と追加すると、ドラフトをレビューする際に最初に確認すべき箇所が分かります。
Coworkを自分用に活用する
プラグインの/design-systemは汎用的な出発点です。ステップ2で実際にPRに投稿できるようなドリフトレポートが生成されたら、Coworkにあなた独自のバージョンのスキルを作成するよう指示してください。深刻度のしきい値、許容される例外、コンポーネントとコードのマッピング、そしてエンジニアが反応するコメントのトーンを組み込みます。数分の対話で、以降はあなたの基準でスキルが実行されるようになります。
このタスクでこれまで行ったことをスキルにしてください。または、私のフィードバックを反映して/design-systemスキルを編集してください。
再現可能にする
アーティファクトとして共有する
ドリフトはスプリント間で静かに積み重なっていきます。Coworkにレポートをアーティファクトとして公開するよう依頼すれば、デザインシステムチームは1つのリンクを持つことになります。スキルを再実行するか、更新をスケジュールしてください。
そのドリフトレポートをデザインシステムチャンネル向けのアーティファクトとして公開してください。未解決の高深刻度項目の累計を維持してください。
UIに関わるすべてのPRで実行する
ドリフトはマージ前に検出するのが最も低コストです。プロンプトに/scheduleと入力するか、Coworkサイドバーのスケジュール済みを開いて、カスタマイズしたスキルを1日2回実行するように設定し、オープンなPRと最新の本番スクリーンショットを確認してください。
/schedule 平日の午前10時と午後4時に、「ui」とラベル付けされたオープンなPRと、新しい画面がないかDesign-QA/Sprint-42を確認し、それぞれに/design-systemを実行して、ドリフトレポートをコメントまたは#design-systemに投稿してください。
午前10時と午後4時に、オープンなUI PRとQAフォルダを確認し、/design-systemを実行して、ドリフトレポートをPRコメントまたは#design-systemに投稿します。
チームメイトと共有する
カスタマイズした/design-systemには、あなたのトークン、コンポーネントマップ、深刻度スケール、例外リストが組み込まれています。これを共有することで、すべてのスクワッドがすべてのPRで同じレビューを受けられるようになり、システムチームが「これはシステムに準拠しているか」のボトルネックになることがなくなります。