bishoe01/blueprint-extractor

Extract

公開Webサイトから根拠のあるDESIGN.mdを作成します。観察可能なデザインパターンを抽出しますが、サイトを実行可能コードとして複製したり、公式ブランドガイドラインを主張したりしないでください。

コマンド動作

ユーザーが/extract <url>と入力した場合は、このワークフローを直ちに実行するリクエストとして扱います。

ユーザーが/extractのみを入力した場合は、公開HTTPS URLを要求し、提供されるまで抽出を開始しません。

デフォルト出力：

• 証拠バンドル：.blueprint-extractor/<slug>/
• 最終ドキュメント：ユーザーが別のパスを指定しない限り、ユーザーの現在のプロジェクト内のDESIGN.md

ワークフロー

1. 対象URLを検証します。
2. ユーザーのプロジェクト内に.blueprint-extractor/<slug>/に証拠フォルダを作成します。
3. 公開ページデータから証拠を収集します：
   • HTMLタイトルとメタデータ
   • リンクおよびインラインCSS
   • 代表的な要素の計算済みスタイル
   • ブラウザツールが利用可能な場合のデスクトップスクリーンショット（1440x900）
   • ブラウザツールが利用可能な場合のモバイルスクリーンショット（390x844）
4. 取得したCSS、計算済みスタイル、または記録されたスクリーンショットからのみ具体的なトークンを抽出します。
5. 最終的な散文を書く前にblueprint.jsonとsources.jsonを書き込みます。
6. references/DESIGN_TEMPLATE.mdの正確に9つのセクションからなる契約を使用してDESIGN.mdを合成します。
7. 最終決定前に自己レビューパスを実行します：
   • 観察されたコンポーネントレシピで実装の有用性を向上させる。
   • スクリーンショットで裏付けられる場合、定性的なテーマ言語を改善する。
   • 抽出された証拠とスクリーンショットから推測された動作および実装ガイダンスを分離する。
   • 抽出されたCSSに表示されていない、または存在しない広範な製品クレームを削除する。
   • ターゲットプロジェクトのドメイン、情報アーキテクチャ、およびコアワークフローを保持する；視覚言語のみを転送する。
   • 再利用前にソースドメインのコンポーネントを抽象化する。例：「プレイリスト」を「コレクションリスト」に、「アルバムアート」を「ビジュアルサムネイル」に。
   • 定性的または推測とマークされていない限り、サポートされていない例をDESIGN.mdに含めない。
8. 最終的なMarkdownをテンプレートと証拠に対して検証します。
9. 出力パスと信頼性に関する警告を最終応答に報告します。

URL安全性

URLが安全でない、または範囲外である場合は、簡単な説明とともにリクエストを拒否します：

• https://ではない
• localhost、ループバック、プライベートIP、リンクローカル、プライベートホスト名
• 認証ゲートまたはペイウォール付きコンテンツ
• 非HTML応答
• 到達不能、空、またはリダイレクトが多すぎる
• ログインのバイパス、プライベートダッシュボードのスクレイピング、Figmaの抽出、または実行可能コードのクローンリクエスト

フォーム、ログインフロー、チェックアウトフロー、破壊的なアクション、またはユーザー固有のページには従わないでください。

抽出

scripts/extract-blueprint.mjsが存在し、依存関係が利用可能な場合は、まずそれを実行し、その成果物を信頼できる情報源として使用します。利用できない場合は、利用可能なブラウザ、HTTP、ファイルシステムツールを使用して同等の証拠を手動で収集します。

視覚的な推測よりも決定的な証拠を優先します：

• 色はCSS、計算済みスタイル、SVG属性、またはサンプリングされたスクリーンショットから取得する必要があります。
• フォントファミリーはCSS、計算済みスタイル、または@font-faceから取得する必要があります。
• ブレークポイントはメディアクエリから取得するか、スクリーンショットから推測されたものであることを明示的にマークする必要があります。
• スペーシング、半径、シャドウ、ボーダー、モーションはCSSまたは計算済みスタイルを引用する必要があります。
• スクリーンショットのみが利用可能な場合は、観察を定性的に保ち、発明された数値トークンを避けてください。

blueprint.jsonとsources.jsonを作成または編集する前にreferences/EXTRACTION_SCHEMA.mdを読んでください。 抽出が部分的またはブロックされている場合はreferences/FAILURE_MODES.mdを読んでください。 生成されたDESIGN.mdを良い例やリリース品質の出力として扱う前にreferences/QUALITY_CHECKLIST.mdを読んでください。

合成ルール

ユーザーが要求した言語を使用します。言語が要求されていない場合は、DESIGN.mdを英語で書きます。

最終的なDESIGN.mdには、以下のH2セクションがこの順序で正確に含まれている必要があります：

1. 1. Visual Theme & Atmosphere
2. 2. Color Palette & Roles
3. 3. Typography Rules
4. 4. Component Stylings
5. 5. Layout Principles
6. 6. Depth & Elevation
7. 7. Do's and Don'ts
8. 8. Responsive Behavior
9. 9. Agent Prompt Guide

DESIGN.mdにSources、Confidence、またはAppendixセクションを追加しないでください。信頼性の警告は最終的なアシスタント応答または証拠バンドルに配置します。

DESIGN.md内の各具体的なトークンはblueprint.jsonにトレース可能でなければなりません。不確かな発見は正確な値ではなく定性的な観察としてマークします。

最終ドキュメントを乾いたトークンの羅列にしないでください。証拠を再利用可能なデザインガイダンスに変換します：

• キャプチャされたページから見える場合にのみ、サイトアーキタイプに名前を付けます。例：「ダッシュボードシェル」、「エディトリアルランディングページ」、「コマースカタログ」、「メディアプレイヤー」、または「ドキュメントサイト」。
• 有名ブランドには控えめに扱います：キャプチャされたページ、CSS、または計算済みサンプルがサポートしない限り、よく知られた製品パターン、ブランドの伝承、または公式システムの主張をインポートしないでください。
• ターゲットアプリのドメインモデル、情報構造、ユーザーワークフローを保持します。ソースサイトは視覚言語を提供しますが、ターゲットプロジェクトをソースサイトの製品カテゴリに変換する許可を与えるものではありません。
• 転送可能なデザイン特性と転送不可能なソースドメインオブジェクトを分離します。色、タイポグラフィ、スペーシング、密度、形状、サーフェスレイヤリング、インタラクションの感触を転送します。トラック、プレイリスト、カート、ドキュメントページ、ダッシュボード、チェックアウトフローなどのドメインオブジェクトは、ユーザーが明示的にその製品構造を要求しない限り転送しないでください。
• ソースコンポーネントが有用な場合、ドメインに依存しないパターンとして表現します：「プレイリストサイドバー」ではなく「コレクション/ナビゲーションサイドバー」、「トラック行」ではなく「繰り返しコンテンツアイテム」、「アルバムアート」ではなく「ビジュアルサムネイルまたはアクセントブロック」。
• 観察されたトークン、スクリーンショットから推測されたレイアウト動作、実装ガイダンスの間の区別を散文内で保持します。
• 観察された繰り返しコンポーネントをコンパクトなレシピに変換します：目的、サーフェス、タイポグラフィ、スペーシング、半径、ボーダー/シャドウ、インタラクション。
• 一回限りの装飾値よりもページ全体に一般化するパターンを優先します。
• 抽出されたブレークポイントと実装上の便利なブレークポイントを区別します。
• 7. Do's and Don'tsを使用して、アクセントカラーの過剰使用、サポートされていないコンポーネントの追加、ソースサイトのドメインモデルのインポート、ターゲットプロジェクトの製品カテゴリの変更など、起こり得る誤読を防ぐ簡潔な制約を提供します。
• 9. Agent Prompt Guideを実用的にします：クイックカラーリファレンス、コンポーネントプロンプトの例、証拠がサポートする場合の反復ガイダンス。
• エージェントに対象サイトをクローンするように指示せずに、インスパイアされ実装準備が整ったガイダンスを維持します。

検証

終了前に：

• DESIGN.mdが意図した出力パスに存在することを確認します。
• H2セクション名と順序がreferences/DESIGN_TEMPLATE.mdと一致することを確認します。
• 各16進カラー、フォントファミリー、ブレークポイント、半径、シャドウ、スペーシング値がblueprint.jsonに存在するか、推測/定性的として明示的にマークされていることを確認します。
• 出力がreferences/QUALITY_CHECKLIST.mdを満たしていることを確認します（例やリリース候補を作成する場合）。
• 検証に失敗した場合は、証拠を修正するか、サポートされていない値をダウングレードしてから結果を提示します。