anti-vibecode

anti-vibecode

AI エージェントに指示せずに生成させたサイトは、どのモデルも指示がなければ選びがちな、同じ43個のデフォルトに行き着きます。訪問者は一目でそれに気づき、「AI が作ったんだ、誰も気にかけていない」と受け取ります。このスキルでは、その一つひとつをルールにして、コード内で見つけ、実際に考えた選択に置き換えます。

ユーザーが /anti-vibecode の後に入力した内容：$ARGUMENTS

モード

• rules（Claude が UI を構築しようとしているとき、または引数がないときのデフォルト）：references/signs.md を読み込み、以降のセッションではその指示に従います。ページを書く前に、ありがちな特徴を最も多く避けられる3つの選択を決めます。紫やインディゴ以外のブランドカラーを1色、Inter / Geist / Space Grotesk 以外の書体を1つ、中央揃えのヒーロー＋機能カード3枚以外のレイアウト案を1つ選びます。それらを1行で伝えます。「43 règles actives」（または「43 rules active」）と、3つの選択を回答します。
• audit [path]：スキャナーを実行し、正規表現では検出できない項目を目視で確認します。報告のみで、編集はしません。
• fix [path]：監査を行い、見つかった特徴を影響の大きいものからすべて修正します（「What is missing」セクションは常に対象です。法的ページがないサイトは公開できません）。

監査

1. このスキルのフォルダーから、プロジェクトのルート（または指定されたパス）に対してスキャナーを実行します。

   node <skill folder>/scripts/scan.mjs <project root>
   

   検出した特徴の番号、ファイル、行番号と、検出できない特徴が出力されます。Node 18 以降が必要です。依存関係はありません。

2. サイトを開き（開発サーバーまたはビルド済みページ）、スキャナーが「check by eye」として挙げた視覚的な特徴（レイアウト、動き、コピー、不足しているもの）を確認します。ランディングページのコピーは自分で読んでください。

3. チェックリスト形式で報告します。問題がなければ ✓ NN <sign>、見つかった場合は ✗ NN <sign> <file:line> → <fix> と記載します。最後に件数を記載します：NN/43 signes trouvés

修正

• 見つかった各特徴について、references/signs.md の「Instead」列に従います。ある決まり文句を別の決まり文句に置き換えてはいけません（紫のグラデーションを青のグラデーションに変えても、同じ特徴です）。
• プロジェクト独自のブランドを優先します。ブランドガイド、DESIGN.md、PRODUCT.md、デザイントークンがある場合は、それらから色と書体を選びます。
• 埋め草ではなく、実際のコンテンツを使います。証言、ユーザー数、ロゴ一覧を捏造してはいけません。実物がまだない場合は、そのブロックを削除し、決して偽装しないでください。実際の数値はユーザーに尋ねます。
• 法的ページがない場合は、mentions-legales と confidentialite（または legal と privacy）のページを作成します。ユーザーが記入すべき項目には TODO と記し、会社情報を捏造してはいけません。
• 最後にスキャナーを再実行し、修正前と修正後の件数を示します。

さらに詳しく

クリーンアップ後にデザイン全体を見直すには、次の2つのスキルを組み合わせると効果的です。

• Impeccable（npx impeccable install）：ブランドから仕上げまで、本番向けのフロントエンドデザインを行います。
• better：アクセシビリティ、レイアウト、文章、タイポグラフィ、色を一度に1画面ずつ改善し、その後に検証します。