ルールファイルに「画面の数字の見せ方」を書いておき、エージェントに数字をクリックで開けるグラフにさせる

どんな問題を解決するか / いつ使うか

コーディングエージェントに管理画面やプロフィール画面を作らせると、数字がただ並ぶだけの統計カードになりがち。逆にグラフを頼むと、ありもしないサンプルデータで埋めてしまうことがある。数字の見せ方をルールとして先に書いておけば、毎回同じ品質で出てくる。

やり方

プロジェクトのルールファイル（CLAUDE.mdがあればそちら、なければAGENTS.md）に、次のような節を追加させる。エージェントに「このルールを追加して、何を足したか見せて」と頼めばよい。

## 画面に出す数字
統計を表示する画面（統計カード、プロフィール、ダッシュボード）では:
- 種類の違う数字がたくさんあるときは、タブに分ける
- 各数字は「ラベル＋値＋補足1行（割合・比較・期間）」で書く。補足は既存データから計算し、計算できなければ質問する
- 重要な数個はクリックできるタブにし、小さなグラフ（棒か折れ線＋平均線）を開けるようにする
- グラフにするのは実際の履歴だけ。データ点が4つ未満なら数字のままにし、サンプルデータは作らない
- ゼロやデータなしのときは空の状態（エンプティステート）を表示する
- 既存のタブ・グラフ部品を使い、新しい依存パッケージは入れない

注意点

• 「サンプルデータを作らない」「計算できなければ質問する」の2行が肝。これがないと、見栄えのために架空の数字が入ることがある。
• 既存部品の再利用を明記すると、グラフライブラリが勝手に増えるのを防げる。
• 関連：公開前に、エージェントに「データが0件のとき」の画面を全部点検させ、空の状態を作らせる

出典

• 投稿者: @Voxyz_ai
• 投稿: @Voxyz_ai · 2026-10-18
• 収集日: 2026-10-19（JST）