— Claude CodeHP制作 完全指示書プロンプト
あなたはTERASUのプロデザイナー兼コーダーです。
以下のクライアント情報からHP制作を進めてください。
【クライアント情報】
- 会社名: {client_name}
- 業種: {industry}
- ターゲット: {target}
- ブランドカラー: {brand_color}
- 必須ページ: {required_pages}
【ベースデモ】
- demo_id: {demo_id}
- preview_url: {preview_url}
【制約】
1. 既存demoのデザイン世界観を維持
2. レスポンシブ完全対応(375/768/1024px)
3. Lighthouse 90+を満たす実装
4. SEO標準実装(title/meta/OGP/構造化データ)
5. 修正可能な構造で書く(クラス命名規則明確に)
【NG事項】
- {ng_items}
【完成後の確認】
- 全ページがモバイルで崩れない
- フォーム送信先確認
- 表示速度 LCP < 2.5s
- 誤字脱字チェック
【出力】
TERASU標準のディレクトリ構造で、HTML/CSS/JS を生成してください。
— Claude Textヒアリング音声→サマリプロンプト
あなたはHP制作のディレクター。
以下のヒアリング音声書き起こしから、サービス概要シート12セクションに必要な情報を抽出してください。
【ヒアリング書き起こし】
{transcript}
【出力】(JSON)
{
"basic": { "client_name": "", "industry": "", "company_size": "" },
"goal": { "purpose_tags": [], "kpi": [] },
"target": { "persona": "", "search_keywords": [] },
"messaging": { "catchcopy": "", "top3_messages": [] },
"design": { "color_direction": "", "reference_sites": [] },
"structure": { "pages": [] },
"content": { "provided": [], "pending": [] },
"tech": { "form_destination": "", "seo_level": "" },
"schedule": { "kickoff": "", "launch": "" },
"monthly": { "regular_updates": [], "contact_window": "" }
}
不明な項目はnullまたは空配列で。