dilson-developer/DAVINCI-skill

DAVINCI — ランディングページデザインスキル

実行フロー

1. ユーザーの生のリクエストを読み取る

製品の機能、対象ユーザー、および（言及されている場合）ページタイプを抽出します。

2. ページタイプを分類する — 必須かつ対話的なステップ

ユーザーが以下のタイプのいずれかを明確に示しているか確認します：

• SaaS B2B — 企業に販売される管理/データ/インフラ製品
• SaaS Consumer — 個人が使用する製品（個人の生産性、ウェルネス、ソーシャル、クリエイティブ）
• AI Tool / Dev Tool — 技術ツール、API、または開発者/技術チーム向けのAI製品
• Fintech — 金融製品（決済、銀行、投資）

リクエストでタイプが明確でない場合は、続行する前に停止してユーザーに質問してください。黙って推測しないでください。 質問の例：

「この製品はどのタイプですか？ (a) SaaS B2B — 企業向け (b) SaaS Consumer — 個人向け (c) AI/Dev Tool — 技術ツール (d) Fintech — 金融製品」

回答を得てから先に進みます。ユーザーが十分なコンテキストを提供していて自信を持って推測できる場合（例：「数千人のユーザーがいる個人の財務管理アプリ」→ SaaS Consumer、Fintechに近いトーン）、推測したこととそのタイプを明示的に伝え、ユーザーに修正する機会を与えてください。黙って推測しないでください。

3. ページタイプのテンプレートを読み込む

templates/page-types/ にある対応するファイルを読み込みます：

• saas-b2b.md
• saas-consumer.md
• ai-tool.md
• fintech.md

このファイルはセクションの順序と、タイプ固有のルール（トーン、色、タイポグラフィ）を定義します。

4. セクションを組み立てる

タイプのテンプレートにリストされている各セクションについて、templates/sections/ にある対応するファイル（hero.md、features.md、pricing.md、testimonials.md、faq.md、cta.md）を読み込み、プレースホルダーを製品情報で埋めます。

5. 横断的ルールを適用する

各セクションテンプレートで参照されている rules/typography.md、rules/color-systems.md、rules/layout-grids.md、rules/copywriting.md を参照します。相互参照（例：[rules/copywriting.md #1]）は、各ポイントで適用するルールを正確に示します。

6. 出力を生成する

ユーザーの言語で書かれた、単一の構造化プロンプトを生成します。このプロンプトは、そのまま任意のコードエージェント（Claude Code、Cursor、v0など）に貼り付けて実際のページを生成できます。

コンテンツのセキュリティルール

• メトリクス、証言、または顧客のロゴを決して捏造しないでください。実際のデータがない場合は、templates/sections/testimonials.md に記述された代替案を使用します。
• ユーザーが急いでいるように見えても、ステップ2（分類）を絶対にスキップしないでください。これは後続のすべてに最も影響を与える決定です。

このスキルのファイル

SKILL.md                        ← このファイル
rules/                          ← デザイン原則（タイポグラフィ、色、レイアウト、コピー）
templates/sections/             ← 再利用可能なブロック（hero、features、pricing...）
templates/page-types/            ← 製品タイプごとの完全な組み合わせ
references/design-patterns.md   ← 実際のリファレンスから抽出されたパターン