読み込み中

パターン一貫性オーディット

新しいパターンを設計する前に、すでにこれを解決している既存のすべてのサーフェスを確認します。

10 分デザインClaude Cowork
読み込み中

セットアップ

プラグインを試す

Designプラグインには、出発点として/design-handoffやその他のデザインシステムスキルが同梱されており、コンポーネントをインベントリ化し、それらがどこにあるかを相互参照できるようにすでに構成されています。管理者がプラグインを管理していて、まだ利用できない場合は、これをスキップしてください。以下の内容はこれを必要としません。

DesignAccelerate design workflows — critique, design system management, UX writing, accessibility audits, research synthesis, and dev handoff. From exploration to pixel-perfect specs.
追加
/design-handoffGenerate developer handoff specs from a design.
Cowork で開く
/research-synthesisSynthesize user research into themes, insights, and recommendations.
Cowork で開く

ツールを接続する

Claude Cowork は、お使いのシステムと直接連携することでより強力になります。権限とアクセスはあなたが管理します。ツールアクセスについて学ぶ。

設定するには、Cowork で Customize → Connectors に移動してください。

Figma
コンポーネントライブラリと公開済みファイルを検索し、パターンのすべてのインスタンスを見つけます。
接続
GitHub
パターンが製品内のどこに実装されているか、そしてそのサーフェスを誰が所有しているかを見つけます。
接続
Amplitude任意
各サーフェスのエンゲージメントとコンバージョンを取得し、推奨がデータに基づくようにします。
接続

作業フォルダを設定する

使用するファイル(デザインシステムのFigmaエクスポート、すでに把握しているサーフェスのスクリーンショット、製品のサイトマップ)を1つのフォルダにドラッグし、Cowork にそのフォルダを指定してください。Cowork はそこから読み取り、オーディットをそこに書き戻します。デザインシステムフォルダからCowork プロジェクトを作成すると、コンポーネントインベントリと所有権マップがすべてのオーディットに紐づいたままになります。

Design-system / Audits / inline-filter
component-inventory.mdMar 18, 202642 KB
search-results-current.pngApr 26, 2026410 KB
surface-ownership.csvFeb 9, 20268 KB
Cowork のチャットバーで:Design-system / Audits / inline-filter

プロンプト

これを Claude Cowork にコピーする

検索結果ページ用の新しいインラインフィルターパターンを提案する前に、似たようなもの(チップ、セグメントコントロール、ドロップダウンフィルター、ファセット付きサイドバー)を使用している製品内のすべてのサーフェスを見つけてください。それぞれについて、スクリーンショットまたはFigmaリンクを示し、どのチームがそれを所有しているかとそれがどのように機能したか(エンゲージメントやコンバージョンがあれば)を記載してください。どのパターンを再利用すべきか、その理由も教えてください。

Design-system / Audits / inline-filter

これが効果的な理由

プロンプト

検索対象のバリエーションを明示する。 チップ、セグメントコントロール、ドロップダウン、ファセットは、同じ意図が異なる名前で現れる形です。それらを明示することで検索範囲が広がります。

プロンプト

所有者を尋ねる。 どちらにしてもそのチームと話す必要があります。このオーディットはステークホルダーリストとしても機能します。

プロンプト

推奨をデータで裏付ける。 「そのサーフェスがどのように機能したか」によって、推奨は好みではなく、デザインクリットのための根拠に変わります。

ソース

参照リストをフォルダに入れる。 Cowork はコンポーネントリストから出発し、実際の製品で何がずれているかを確認します。

より良いドラフトを得る

練習

統合プランを依頼する。 「1つを再利用すべきなら、他のどのサーフェスもそれに移行すべきかをリストしてください」と追加すると、オーディットはデザインシステムのロードマップ項目になります。

練習

移行先のスクリーンショットを追加する。 パターンがどこに向かうかのスクリーンショットを入れると、Cowork は前例だけでなく適合性も検討します。

Cowork を自分のために活用する

プラグインスキルは出発点です — 自分の実践や専門知識でカスタマイズしてください。数分の対話で、それ以降は自分の基準で実行されるようになります。

このタスクでこれまでに行ったことをスキルにしてください。または、私のフィードバックで /design-handoff スキルを編集してください。

Design-system / Audits

繰り返し使えるようにする

デフォルトの最初のステップにする

このオーディットは、新しいパターンがレビューに入る前に実行されるべきです。デザイン組織全体が1行で呼び出せるスキルとして保存し、毎回パターン名を入れ替えるだけにすれば、「既存のものを確認したか」がクリット週の驚きになることはなくなります。

これを /pattern-audit として保存してください。パターン名を受け取り、Figma、コードベース、Amplitude で既存のインスタンスを検索し、再利用の推奨とともに並べた比較を Design-system/Audits/<pattern>.md に書き込むようにしてください。

Design-system / Audits

チームメイトと共有する

カスタマイズされた /pattern-audit には、コンポーネントインベントリ、所有権マップ、パフォーマンス検索が組み込まれています。すべてのデザイナーがクリット前に同じチェックを実行できるように共有し、デザインシステムが1つのことを5つの方法で行うように肥大化するのを止めましょう。

デザインクリットで何が変わるか