← GPT-AI-LP
CODE · 4.8 KB

scripts/create-qa-export.mjs

Workspace snapshot · 08/31 23:51

import { mkdir, writeFile } from "node:fs/promises";
import { exportHtml, exportThanksHtml } from "../src/export-html.js";

const output = new URL("../output/qa-export/", import.meta.url);
await mkdir(new URL("images/", output), { recursive: true });

const base = {
  role: "読者の判断を一段進める",
  userQuestion: "次に何を判断すべきか",
  proof: "確認可能な一次情報",
  content: "具体情報A。具体情報B。具体情報C。",
  asset: "確認済みの画面・資料",
  implementation: "PC/SP対応、情報の優先順位を維持",
  cta: "相談する",
};
const sections = [
  { ...base, id: "hero", type: "hero", layoutVariant: "hero-form", label: "FIRST VIEW", title: "判断を、前へ。", body: "必要な情報と次の行動が、一つの流れで分かるBtoBサービスです。", imageBrief: { subject: "サービス利用場面", composition: "横長" } },
  { ...base, id: "trust", type: "trust", layoutVariant: "logo-metrics", label: "TRUST", title: "検討に必要な根拠を先に。", body: "導入数。継続率。顧客ロゴ。" },
  { ...base, id: "problem", type: "problem", layoutVariant: "pain-cards", label: "PROBLEM", title: "判断が遅れる三つの理由。", body: "情報が散らばる。比較軸がない。社内説明が難しい。" },
  { ...base, id: "risk", type: "risk", layoutVariant: "risk-cost-stack", label: "RISK", title: "先送りのコストを可視化。", body: "機会損失。確認工数。対応の遅れ。" },
  { ...base, id: "mechanism", type: "mechanism", layoutVariant: "before-after", label: "MECHANISM", title: "情報を、決定へ変える仕組み。", body: "入力。整理。比較。行動。" },
  { ...base, id: "difference", type: "differentiation", layoutVariant: "feature-zigzag", label: "DIFFERENCE", title: "違いは、制作工程にある。", body: "理解。設計。検証。実装。" },
  { ...base, id: "process", type: "process", layoutVariant: "process-timeline", label: "PROCESS", title: "導入は四つのステップ。", body: "相談。要件整理。試行。公開。" },
  { ...base, id: "usecase", type: "usecase", layoutVariant: "usecase-story", label: "USE CASE", title: "部門ごとの使い方。", body: "営業。マーケティング。事業責任者。制作。" },
  { ...base, id: "comparison", type: "comparison", layoutVariant: "comparison-table", label: "COMPARISON", title: "代替手段との違い。", body: "導入速度。情報量。更新性。支援範囲。" },
  { ...base, id: "proof", type: "proof", layoutVariant: "case-study-featured", label: "CASE STUDY", title: "導入前後を、事実で比較。", body: "課題。実施内容。確認済みの結果。" },
  { ...base, id: "pricing", type: "pricing", layoutVariant: "pricing-cards", label: "PRICE", title: "条件に合うプランを選ぶ。", body: "基本プラン。拡張プラン。個別見積もり。" },
  { ...base, id: "faq", type: "faq", layoutVariant: "faq-list", label: "FAQ", title: "導入前の疑問に回答。", body: "開始時期。必要な素材。運用体制。契約条件。" },
  { ...base, id: "contact", type: "form", layoutVariant: "form-split", label: "CONTACT", title: "まず、状況をお聞かせください。", body: "1営業日以内に担当者からご連絡します。" },
];
const project = {
  name: "QA BtoB Service",
  sourceSummary: "実ブラウザQA用の納品LP",
  answers: {
    formalCompanyName: "株式会社QA",
    formalServiceName: "QA BtoB Service",
    formFields: "会社名,お名前,メールアドレス,相談内容",
    formEndpoint: "http://127.0.0.1:5184/thanks.html",
    formSuccess: "1営業日以内に担当者からご連絡します。",
    privacyUrl: "http://127.0.0.1:5184/privacy.html",
    priceAmount: "月額9,800円から",
  },
};
const tone = { palette: ["#171717", "#ff5b35", "#f4f1e8"], type: "ゴシック" };
await writeFile(new URL("index.html", output), exportHtml(project, sections, tone, [{ sectionId: "hero", src: "images/hero.svg" }]), "utf8");
await writeFile(new URL("thanks.html", output), exportThanksHtml(project, tone), "utf8");
await writeFile(new URL("privacy.html", output), "<!doctype html><meta charset=utf-8><title>個人情報の取り扱い</title><h1>個人情報の取り扱い</h1><p>QA用ページです。</p>", "utf8");
await writeFile(new URL("images/hero.svg", output), `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 800"><rect width="1200" height="800" fill="#171717"/><path d="M80 610C260 260 480 760 690 330s360-60 430-230" fill="none" stroke="#ff5b35" stroke-width="80"/><text x="90" y="150" fill="#f4f1e8" font-family="sans-serif" font-size="72" font-weight="700">FROM BRIEF</text><text x="90" y="235" fill="#f4f1e8" font-family="sans-serif" font-size="72" font-weight="700">TO DECISION.</text></svg>`, "utf8");
console.log(new URL("index.html", output).pathname);