# lp-next プロジェクトジャーナル

最終更新：2026-04-26

---

## アプリ版メモ（Site Reverse CMS）

| 版 | 日付（目安） | 要約 |
|---|---|---|
| **1.3.0** | 2026-04-26 | `clone_id` 単位のカスタム画像・ZIP エクスポート、AI テキスト上限トグル、画像メモの生成HTML埋め込みと精製パイプライン、Step1 プロジェクトプロフィール・プレビュー復帰挙動等（下節レポート参照）。 |
| **1.2.1** | 2026-04-26 | PHP セッション単位のワークスペース（`data/ws_*` / `output/ws_*`）で他ユーザーとの生成物混在を防止。`preview.php` スプラッシュは `document` が **`complete`** になるまで待ち、**`fonts.ready`** と短い描画猶予の後に閉じる（スプラッシュ直後の真っ白 iframe を低減）。Step 3 のアセット診断は `debug.php` の実 JSON 形に整合。インポート後の業種推定・AI テキスト置換の導線整理など。 |
| **1.2.0** | （固定ライン） | Ph.0 完成・CSS `@import` / `url()` / `srcset` / `LpUrlContext` 等の資産解決強化（下記および `lp_reverse_cms/README.md` 履歴表）。 |

---

## v1.3.0 要件と実装状況レポート

**対象アプリ:** `lp_reverse_cms`（`APP_VERSION` 1.3.0）  
**本節の最終更新:** 2026-04-26

### 機能別（要件 → 実装）

| 要件・意図 | 実装状況 | 主な根拠（ファイル・挙動） |
|---|---|---|
| AI テキスト置換の「60件相当」の上限を**トグル**で外せる。サーバと `no_element_limit` を同期 | ✅ 実装済 | `assets/js/index.js`、`store/text_replace.php` |
| プレビューから戻ったときに**自動 AI 置換を再実行しない**（別タブ・空 `sessionStorage` 含む） | ✅ 実装済 | `from_preview` の扱い、`index.js` |
| 画像ごとの**テキストメモ**を生成 HTML に載せ、精製パイプラインへ渡す | ✅ 実装済 | `data-lp-image-text-memo` / `image_embedded_text_memo`、`template/editPage.php`、`lib/LpGenerator.php`、`lib/lp_image_memo_merge.php`、`store/lp_ai_image_pipeline.php`、`lib/lp_image_text_memo.php` |
| 画像メモの利用者向け**件数・バイト上限は既定なし**（検証用は環境変数のみ） | ✅ 方針どおり | 既定無制限、テスト用のみ env |
| プレビュー「編集に戻る」は **Step 2**、URL に **`?step=2`** | ✅ 実装済 | `preview.php`、`template/generated_lp.php`、`index.php` の `$initialStep`（`?step`） |
| **手動画像差し替え**: モーダル、左右比較、アップロード／D&D／サムネ選択；保管サイドは **`sites/<clone_id>/custom_images/`** | ✅ 実装済 | `assets/js/index.js`、`store/upload_user_image.php`、`store/list_workspace_images.php` |
| API パスからの公開 URL がサブパス配下でも壊れない | ✅ 実装済 | `publicUrlFromApiPath` + `document.baseURI`（`index.js`） |
| 取得・編集単位で **`clone_id`** を揃え、フェッチ時に **`data/clone_id.txt`** を更新 | ✅ 実装済 | `store/fetch_lp.php`、`lib/LpCloneContext.php`、フロントの fetch 連携 |
| **エクスポート**: 既定は **ZIP バンドル**、単体 HTML は **`export.php?type=html`** | ✅ 実装済 | `lib/LpExportBundle.php`、`export.php`（サーバに `php*-zip` / `ZipArchive` が必要） |
| **Step1 プロジェクトプロフィール**（会社・住所 ZipCloud・電話・訴求・トーン・ブランド色・URL／SNS 等）を JSON 永続化 | ✅ 実装済 | `store/project_profile.php`、`lp_project_profile.json`、`index.php` / `index.js`（`projectProfileInitial` / `initProjectProfile`） |
| 企業名から **LP ソース候補**（業種・URL・沿革・資本金等の参考ヒント＋任意で国税庁法人番号 API）。**正確性は利用者が公式情報で確認してから反映** | ✅ 実装済 | `store/company_profile_lookup.php`、`lib/company_profile_lookup.php`、`lib/houjin_bangou_client.php`、`index.php` モーダル。**法人番号 API 連携の有無・本番での載せ方はクライアント契約・運用次第**（例: 反社チェック用の別データ基盤との整理）。未設定時は API を呼ばず Haiku のみで可 |
| プロフィールを**丸ごと消費する AI 一括 LP 生成** | 🔲 **未着手** | スキーマと UI は先行。生成フローはロードマップ（S2〜S3 帯）で別途 |
| クローン／セッション境界の**エンティティ図**（仕様固定後に整備） | 🔲 **未着手** | 機能追加が続く間は図を保留 |
| エクスポート ZIP に **`lp_project_profile.json` を同梱** | 🔲 **任意・未着手** | 要望が固まり次第 `LpExportBundle` で拡張可 |

### 技術・環境メモ（v1.3.0 関連）

- **Zip:** 本番・検証環境で `ZipArchive` が使えること（例: `php8.2-zip`）。
- **後方互換:** 画像一覧はレガシー平坦ディレクトリの参照に配慮（リスト用途）。
- **法人番号 API:** `HOUJIN_BANGOU_APP_ID` は任意。クライアントが反社チェック等で別契約を持つ場合、本 CMS に同APIを載せる範囲は不要・縮小・将来差し替えのいずれもあり得る（実装は **オフでも成立** する前提）。

---

## フェーズ進捗

| フェーズ | 中身（一言） | 今の段階 |
|---|---|---|
| **Ph.0** | 参照URLからLPを再現。テキスト・素材の手直し。いまの製品 v1.3.0 | ✅ 完了 |
| **S1** | AI画像エンジン（Vision分類・FLUX生成・GD合成） | 🔄 実装中 |
| **S2 前** | 画像候補用の**プロンプト文**を、用途別に**まとめて管理**（版も追う） | 🔲 未着手 |
| **S2** | 業種の文脈に合いそうな**代替画像**を候補出し | 🔲 未着手 |
| **S3** | 業種とトーンに合わせた**文章**の自動下書き | 🔲 未着手 |
| **S4** | 人が選んだ内容を**記録**し、次に活かす回し方 | 🔲 未着手 |
| **S5** | 業種**テンプレ**の化と、出てくる品質の**足し上げ** | 🔲 未着手 |

> **見方:** 上から順に、Ph.0 が「いま届いている土台」、S1 以降がロードマップ。詳しいテーブルは下の「開発スプリント計画」を参照。

---

## プロジェクトの本質

**「任意の業種のLPを参考に、別業種のLPを生成する」**

> 例：美容室の洗練されたWebデザインを参考に、マッサージ店のLPを作る  
> 例：DEXサービスの説明ページを参考に、両替所サービスのLPを作る

レイアウト・デザインの意図（世界観・トーン・構成）を保ちながら、  
業種固有のコンテンツ（テキスト・画像・色調）をAIが自動で置き換える。

---

## 現在地（S1 実装中）

### Ph.0 — 完成

| 機能 | 状態 |
|---|---|
| URL入力 → HTML取得・解析 | ✅ 完成 |
| アセット（画像・CSS・フォント）自動ダウンロード | ✅ 完成 |
| テキスト・画像・リンクの編集UI（手動） | ✅ 完成 |
| 完全スタンドアロンHTML出力 | ✅ 完成 |

### S1 — AI画像エンジン（実装中）

| 機能 | 状態 |
|---|---|
| Claude Vision で画像タイプ自動判定（7パターン対応） | ✅ 完成 |
| HF FLUX による任意サイズ画像生成 | ✅ 完成 |
| ボタン・UI画像のテキスト合成（余白保持） | ✅ 完成 |
| グラデーション・バッジ・フレーム付き画像対応 | ✅ 完成 |
| 写真・イラスト系画像の自動生成 | 🔲 次フェーズ |
| 背景＋テキスト混在画像の再合成 | 🔲 次フェーズ |

**技術構成：** PHP 8.x / JSONファイル管理（DBなし）  
**リポジトリ：** https://github.com/BinaryTraffic/lp-next

---

## コアとなる課題（GAP）

| 現在できること | 要求との差 |
|---|---|
| 画像URLの機械的差し替え（手動） | 「同じ意図・世界観を持つ別画像」をAIが自動選定できない |
| テキストの手動編集 | 業種に合わせたテキストのAI自動生成ができない |
| レイアウト・CSS構造の保持 | 業種の文脈に沿った色調・トーン調整ができない |

**人間とAIのセンスの差をどう埋めるか** が開発の核心。

---

## v1.2.0 を起点に、先に補っておくもの（S2 前提）

**現行 v1.2.0** は Ph.0（参照LPの取得・手動編集・スタンドアロン出力）の**固定ライン**。**S2（AI 画像候補出し）**に着手する前に、少なくとも次を用意しておく、という方針にする。

| 補完項目 | 内容 |
|---|---|
| **プロンプトコレクション管理** | 候補画像を出す各フローで使う**プロンプト文**を、用途（業種・**S1**の意図・役割タグ・世界観など）に紐づけて**登録・改訂・版の追跡**し、同じ条件で**再利用**できること。再現性と改善のたどり用に、プロンプトを「資産」として扱う。 |

S2 本体（検索・生成APIとの接続、候補の並べ替え・スコアリング等）と**併走または先行**しないと、プロンプトがコードやドキュメントに散在し、**品質の再現**と**試行の比較**が難しくなる。

### 店舗・事業文脈の入力設計（入力コストを抑える）

**方針:** 多くの項目は**省略可能**。未入力は **「お任せ」** として、業種プリセット＋地域レベルから**機械側で補完**する。人が触るのは**本当に分岐が大きいところ**に絞る。

#### 1. 画面を分けない（1画面 or ステップ2まで）

| ステップ | 中身 | 目標操作数 |
|----------|------|------------|
| **A. 最速** | 参照URL（または既存セッション）＋**業種**＋**プリセット1つ**＋（任意）**地域レベル** | クリック中心 **5 回前後** |
| **B. 足す** | 折りたたみ「**だいたい合ってる？**」でタグ数個 | +**1 分** |
| **C. 上級** | 自由記述1欄＋色サンプルURL＋数値 | 必要な人だけ |

#### 2. 「1クリック立ち位置」プリセット（内部で多項目を一括展開）

「業種」選択後、**立ち位置**を**1つだけ**選ばせる（未選択＝**お任せ**）。

| プリセット名 | 内包するイメージ（ユーザーには短い説明1行） |
|--------------|----------------------------------------------|
| **駅前・好アクセス** | 利便・入りやすさ。アクセス重視のコピーと明るいトーン候補 |
| **隠れ家・静か** | 特別感・専用感。地図は補助、**予約導線**を強く |
| **路面・一見で分かる** | 看板店舗感、通行量・入りづらさ払拭 |
| **商業施設内** | 安心・併せ持ち。家族/買い物ついで想定 |
| **オフィス・フロア型** | 誠実・専門。BtoB/通いのプロ感 |
| **戸建て・一軒家型** | 非日常・プライベート。隠れ家に近いが**住宅地**想定 |
| **スタジオ・工房** | 職人・体験。手元・作業風景の画像候補を優先 |
| **オンライン/訪問中心** | 店舗写真は必須にしない。利便・時短のトーン |
| **お任せ** | 上記を混ぜず、業種平均＋**参照LP**の雰囲気を優先 |

**路面多層階でなくても好印象**にしたい場合は、上の **戸建て／隠れ家／スタジオ／オフィス／オンライン** から選ばせ、**看板外観を前面に出さない**方向を内部ルール化する（画像プロンプト用）。

#### 3. フィールドと「省略したとき」

| 項目 | UIの形 | 未入力のとき（デフォルト） |
|------|--------|---------------------------|
| **業種** | 検索＋大カテジリ | *必須*（1つ） |
| **地域** | 都道府県 or 粗い圏（例：首都圏） | **非表示**＝言及を弱める／「全国」扱い |
| **客層** | 2択＋**お任せ**（富裕/一般/お任せ） | お任せ＝業種の一般的イメージ |
| **年齢・性別** | **お任せ** トグルON時はスライダー**非表示** | 人口比は**出さない**。ONなら**任意**で男女比・年齢帯のざっくり |
| **立地タイプ** | 上のプリセット1つ＋**お任せ** | お任せ＝参照LPの雰囲気維持＋業種補正 |
| **世界観・色** | 参照LPから**自動抽出候補を3件チップ**表示、1タップ採用 | チップ非選択＝**お任せ**（抽出＋業種） |
| **価格帯の打ち出し** | ラジオ3つ（要問合せ/帯を出す/お任せ） | お任せ＝業種のよくある出し方 |
| **禁句・注意** | 1テキストエリア、**空でよい** | 空＝汎用コンプラ文言のみ考慮 |

**入力の連動:** プリセット（立地）を選ぶと、**画像用プロンプト**の「外観を出す/出さない」「道順/静けさ」などが裏でセットされ、**手入力は増えない**。

#### 4. 自由記述は1枠に集約

- **「追加で一言だけ」** テキストエリア1つ（200字程度）。**ターゲット・差別化・雰囲気**のメモ用。  
- ブロック別の細かい欄は**最初は出さない**（S4 でよく出る文だけテンプレ化を検討）。

#### 5. 保存形式のイメージ（実装用メモ）

1 JSON にまとめ、**プロンプトコレクション**のキーに `industry` + `preset` + オプションを持たせる。

```json
{
  "industry": "リラクゼーション",
  "preset_location": "omakase",
  "audience": "omakase",
  "region": null,
  "demographics_omakase": true,
  "worldview_chip": "落ち着き",
  "free_note": ""
}
```
（`preset_location` / `audience` の値は固定列挙子。`omakase` = お任せ。）

**まとめ:** 必須は **業種＋（任意の）立ち位置プリセット** に寄せ、人口統計は **お任せが既定**、色・雰囲気は **参照LPから候補チップ**で**タップ1つ**可能にすれば、入力コストを抑えつつ、駅近/隠れ家/非路面好印象の**分岐**は揃えられる。

---

## クライアント提示ユースケース

クライアントから手渡された2枚の資料は、  
**「このような内容のLPを、別業種スタイルで生成したい」という出力イメージ**として受け取る。

- 資料①：DEX流動性提供の仕組み・戦略・シミュレーション・自律エージェント
- 資料②：両替所モデルとして噛み砕いた同内容の説明

これらはシステムの機能要件そのものではなく、  
**lp-nextが生成すべきLPのコンテンツ例**である。

---

## 開発スプリント計画

> **注記：** AI生成工数は確定値。人間結合テスト工数はテスト要員確定後にリスケ。

| スプリント | 内容 | AI生成 | 人間結合テスト | 打ち合わせ |
|---|---|---|---|---|
| **S1** | 画像の意図分類（役割・世界観タグ付け） | 半日 | **TBD** | 要員確定後設定 |
| **S2** | AI画像提案エンジン（業種文脈に合う代替候補提示）。**前提:** 一つ上の節の**プロンプトコレクション管理** | 半日 | **TBD** | 〃 |
| **S3** | テキスト自動生成（業種・トーンを指定して生成） | 半日 | **TBD** | 〃 |
| **S4** | 承認ログと学習ループ（人間の選択をAIに蓄積） | 1日 | **TBD** | 〃 |
| **S5** | 自動生成精度の向上・業種テンプレート化 | 半日 | **TBD** | 〃 |

---

## 開発/デプロイの棲み分け（スクリプト・画像）

**目的:** 開発中のモック用スクリプト・画像と、本番（またはステージング）に乗せる静的ファイルの**取り違え**を減らす。ディレクトリ名で揃え、デプロイ手順の `--exclude` と対応づけやすくする。

| 置き場 | パス | 想定 |
|--------|------|------|
| **開発専用** | [`current/dev/`](dev/) | ローカル検証スクリプト、モック画像、下書き。**本番URLに出したくない**作業。サブ: `dev/scripts/`, `dev/images/`。大容量は `dev/images/_local/`（[`.gitignore` 対象、README のみ追跡](../.gitignore)）。 |
| **配信用（ルートHTML用）** | [`current/assets/`](assets/) | `index.html` 等から参照する、**本番含め配信**するJS・画像。サブ: `assets/js/`, `assets/images/`。 |
| **管理画面アプリ** | `lp_reverse_cms/assets/` | 既存の管理UI用 CSS/JS。上記とは別領域。 |
| **生成LPの資産** | `lp_reverse_cms/output/assets/` 等 | ツールの生成物。手動の入れ分け（`dev/` との混在禁止想定） |

**デプロイ:** リポジトリの `dev/` ごと**同期しない**運用にすると、開発用が本番パスに混ざりにくい。必要な成果物は **`assets/` へ移してから**コミット、またはビルド手順でコピーする。Apache では `dev/.htaccess` で当ディレクトリを**拒否**しているが、Nginx では同等の制御か、**そもそも本番に `dev/` を置かない**のが安全。PHP ローカルサーバーでは `.htaccess` 無効のため、公開サーバー扱いにしない。

詳細: [`dev/README.md`](dev/README.md) ・ [`assets/README.md`](assets/README.md)。

---

## 次のアクション

- [ ] S1 残タスク：写真・イラスト・複合画像の自動生成
- [ ] テスト要員の確定
- [ ] 要員確定後、各スプリントの結合テスト日程を設定

---

## 今後の課題（バックログ）

- **プレビュー読み込みの進捗を細かく見せる（任意）** — 現状の `preview.php` は親フレームの推定（`readyState`、`fonts.ready`、画像 `load`、高さ・テキスト量、iframe 上カーテン）で実用上問題ない。**より段階的な％やマイルストーン**が要る場合は後追いで検討する。方向性の例: 生成 LP にプレビュー専用の極小スクリプトを差し込み `parent.postMessage` で通知する／同一オリジンで `performance` のリソース完了を親が集計する。サーバの PHP がレスポンスを返したあとの読み込みはブラウザ内のため、**進捗のソースは基本的に iframe 側か親 JS** になる。

---

## 未確定事項（ハルシネーション防止のため明記）

- 利用するAI画像生成・検索APIの具体名（未決定）
- テスト要員数・体制（未決定）
- 各スプリント完成日（テスト工数TBDのため未確定）
- 業種テンプレートの対象範囲（未決定）
- プロンプトコレクションの**格納形式**・**管理UIの置き方**（`lp_reverse_cms` 拡張か別アプリか、など未決定）

## 運用注意事項

| 項目 | 内容 |
|---|---|
| `output/ai_images/` | www-data所有。Apache経由のみ書き込み可 |
| PHPビルトインサーバ | shimizuユーザーで起動すると画像保存が500になる |
| テスト実行 | 必ずApache経由（https://lp-next.jitan.app/）で行う |
| 自動テスト | リポジトリに未整備。CI導入時はwww-data権限またはテスト専用ディレクトリが必要 |

---