0. 全体像と業務の流れ
このシステムの目的
1つの商品情報を入力するだけで、楽天・Amazon・Yahoo!などのモール商品ページと、SNS投稿・メルマガ・広告コピーなどのマーケティング文面を AI で一括生成し、人が1つずつ承認したうえで配信まで管理する「EC×AI の一元生産管理ツール」です。
業務の流れ（この順にマニュアルを読めば一巡できます）
→ ② AI一括生成で全チャネルの文章を自動作成
→ ③ エディタで微調整・プレビューで仕上がり確認
→ ④ 承認ゲートで人が1項目ずつOK（未承認があると配信できない安全装置）
→ ⑤ 一気出品（モール）／SNS予約／マーケ文面出力で配信
→ ⑥ コンテンツ一覧で全体の進み具合を管理
→ ⑦ 月1回、アルゴリズム管理で各モール・SNSの最新ルールを更新 → 次の生成に自動反映
システム間の連携（裏側のつながり）
| 仕組み | 役割 | どの画面とつながるか |
|---|---|---|
| 商品マスター | 商品情報（スペック・画像・価格）の唯一の原本 | 全画面の生成元データ |
| ルールエンジン | 文字数上限・禁止語・採点基準をデータとして保持 | AI生成・エディタ・プレビュー・SNS採点・管理設定・アルゴリズム管理 |
| 承認ゲート | 未承認の成果物の配信を止める安全装置 | 一気出品・SNS予約の前提条件 |
| 外部連携（本実装時） | モール出品API・SNS予約投稿（PostEverywhere） | 一気出品・SNS投稿スタジオ |
1. ログイン
目的
利用者ごとにデータを分けるための入口です。デモでは「デモユーザーでログイン」ボタン1つで入れます。
使い方
- mock.html をダブルクリックしてブラウザで開く
- オレンジ色の「デモユーザーでログイン」ボタンをクリック
- ダッシュボードに移動したらログイン完了
システム間の連携
ログインした利用者の商品・成果物だけが表示されます（本実装ではデータベースの行単位セキュリティで、他の利用者のデータは見えない仕組みです）。
2. ダッシュボード
目的
全商品の「いまどの段階か」を件数で一望する画面です。毎朝ここを見れば、今日やるべき作業（承認待ちが何件あるか等）が分かります。
使い方
- 上段のカードでステータス別の件数を確認（下書き → 生成済 → 要修正 → 承認待ち → 承認済 → 書き出し済 の順に進みます）
- 「承認待ち」が多ければ承認ゲートへ、「下書き」が多ければ AI一括生成へ進む
- 下段の「最近更新された商品」から直近で動きのあった商品を確認
システム間の連携
件数は商品マスターのステータスを集計したものです。AI生成・承認・出品の各画面で操作すると、この画面の数字が自動で変わります。
3. 商品一覧（一括管理）
目的
登録済みの全商品を一覧で管理する画面です。ここが全作業の起点になります。
使い方
- 左メニュー「商品一覧」をクリック
- 各行のステータスバッジで進捗を確認（色付きのラベル）
- 行末の「プレビュー」リンクをクリックすると、その商品の仕上がり確認画面へ移動
システム間の連携
デモでは、単品登録した3商品（電気ケトル・イヤホン・チェア）と、CSVで一括投入した10商品（DEMO-BULK-001〜010）が並んでいます。一括投入分は「9. 一括生成管理」のジョブと連動しています。
4. AI一括生成
目的
商品情報から、3モール×8項目の販売文章（商品名・キャッチコピー・説明文・箇条書きなど）を8段階の工程で自動生成します。手作業なら数時間かかる文章作成が数十秒で終わります。
使い方
- 左メニュー「AI一括生成（商品C）」をクリック
- 「AI一括生成を開始」ボタンをクリック
- Step 0（入力正規化）〜 Step 7（保存）が順番に緑色に変わるのを待つ（デモでは約8秒）
- 完了すると下に「生成結果（3モール×8項目）」が表示される
システム間の連携
生成時にはルールエンジンから各モールの文字数上限・禁止語・SEOキーワード設計が自動で読み込まれます。つまり「13. アルゴリズム管理」でルールを更新すると、次回の生成から自動で新ルールが効きます。生成結果は「5. エディタ」「6. プレビュー」「7. 承認ゲート」に引き継がれます。
5. エディタ（微調整）
目的
AIが生成した文章を、モール別の3列で見比べながら人が微調整する画面です。文字数の超過や禁止語はその場で赤く警告されます。
使い方
- 左メニュー「エディタ（商品B）」をクリック
- Amazon／楽天市場／Yahoo!ショッピング の3列で文章を確認
- 各欄の下の「○○/上限○○字」で文字数の余裕を確認（緑=OK・赤=超過）
- 禁止語が入っていると「⚠ 禁止語『日本一』が含まれています」のように赤い警告が出る（デモでは楽天の説明文にわざと仕込んであります）
システム間の連携
警告の判定基準（文字数・禁止語）は「14. 管理設定」の禁止語辞書・文字数ルールと同じデータです。ルールを1箇所直せば、エディタ・プレビュー・SNS採点の全部に同時に効きます。
6. 実画面風プレビュー（最終ゴールの絵）
目的
「実際にモールに出品されたらこう見える」を出品前に確認する画面です。Amazon風・楽天風・Yahoo!風の商品ページの見た目を再現し、右側のチェックリストで合格状態も一目で分かります。
使い方
- 左メニュー「実画面風プレビュー」をクリック
- 上部タブ「Amazon／楽天市場／Yahoo!ショッピング」で表示を切替
- 右上の「PC／スマホ」ボタンで表示幅を切替（スマホは幅375pxで再現）
- 右上のプルダウンで商品を切替（商品B に切り替えると、禁止語による「×」がチェックリストに出る例が見られます）
- 右側チェックリストの「必須・文字数・禁止語」が全部○になっていることを確認してから承認へ進む
システム間の連携
表示内容は「4. AI一括生成」の結果 + 商品マスターの画像・価格・スペックを組み合わせたものです。チェックリストの判定はエディタと同じルールエンジンを使っています。
7. 承認ゲート
目的
AIまかせにしない安全装置です。チャネル×項目ごとに人が「承認」を押さない限り、出品もCSV書き出しもできません（誤った文章がそのまま世に出る事故を構造的に防ぎます）。
使い方
- 左メニュー「承認ゲート（商品B）」をクリック
- 上部の「承認進捗: 1/8」と黄色い「未承認あり — 出品・CSV書き出しはブロック中」を確認
- 各行の生成内容を読み、問題なければ「承認」ボタンをクリック → 進捗が 2/8 に増える
- 全8項目を承認すると表示が緑色の「全項目承認済 — 出品・CSV書き出し可能」に変わる
システム間の連携
「8. 一気出品」と「12. SNS投稿の予約」は、この画面で全項目承認済みになった商品だけ実行できます。承認の記録（誰がいつ承認したか）は監査ログに残ります。
8. 一気出品
目的
承認済みの商品を、ボタン1つで複数モールへ順番に出品する画面です（1件ずつ順番に処理する安全設計）。
使い方
- 左メニュー「一気出品（商品A）」をクリック
- 緑色の「全項目承認済 — 出品可能」を確認
- 「3モールへ一気出品」ボタンをクリック
- 楽天市場 → Yahoo!ショッピング → Amazon の順に「✅ 出品成功 + 出品先URL」が表示される（デモではダミーURL）
- 最後に「✅ 出品ジョブ完了（ステータス: 成功）」を確認
システム間の連携
本実装では各モールの公式API（Amazon SP-API・楽天RMS・Yahoo!ストアAPI）に接続します。出品結果は履歴に記録され、ダッシュボードのステータスが「書き出し済」に変わります。
9. 一括生成管理
目的
CSVで投入した多数の商品をまとめて生成するときの進捗管理画面です。どの商品が終わり、どれがエラーかが一覧で分かります。
使い方
- 左メニュー「一括生成管理」をクリック
- 進捗バーで全体の完了度（デモでは 7/10 件）を確認
- 下の表で1件ずつの状態を確認。「失敗」の行はエラー内容（例:「楽天: 商品名が127文字を超えています」）が表示される
- エラー行は「5. エディタ」で修正してから再生成する
システム間の連携
ジョブの1件1件は「3. 商品一覧」の各商品と紐づいています。完了した商品はステータスが「生成済」になり、承認ゲートへ進められます。
10. コンテンツ一覧（一元生産管理）Phase 2 新機能
目的
このツールの中核画面です。1つの商品から生まれた全成果物（モール商品ページ・SNS投稿・メルマガ・広告コピー）が「いまどの状態か」を1枚のマトリクスで管理します。
使い方
- 左メニュー「コンテンツ一覧（一元管理）」をクリック
- 行=商品、列=チャネル（楽天/Amazon/Yahoo!/Instagram/X/TikTok/メルマガ/広告コピー）の表を見る
- マークの意味: ⬜未生成 → 🔵生成済 → 🟡承認待ち → ✅承認済/配信済 → 🔴エラー
- 気になるセルをクリックすると該当の編集画面へ移動
- 「未生成分を一括生成」ボタンで、空いているマスをまとめて埋められる（本実装では1件ずつ順番に生成）
システム間の連携
全画面の状態がここに集約されます。「商品ページはできたが SNS がまだ」「メルマガが承認待ちで止まっている」のような抜け漏れの発見がこの画面の役割です。
11. マーケティングライティングPhase 2 新機能
目的
商品情報からメルマガ・LINE・広告コピー・キャッチコピー・ブログ記事の文面を AI 生成する画面です。媒体ごとの文字数と法令チェック（メルマガの特定電子メール法）つきです。
使い方
- 左メニュー「マーケ文面（商品A）」をクリック
- 上部タブで媒体を切替（メルマガ／LINE配信／広告コピー／キャッチコピー／ブログ記事）
- 各欄の文字数（緑=上限内）を確認
- 右側チェックリストで「特定電子メール法: 配信停止導線あり ○」など法令チェックの合格を確認
- 問題なければ「承認へ回す」をクリック（承認ゲートへ送られる）
システム間の連携
生成元は商品マスター + 商品ページの生成結果（言い回しの一貫性を保つため）。承認後の文面はコピー用テキスト／メルマガ用HTMLとして出力し、配信ツールに貼り付けて使います（本実装Phase 3で配信ツール連携予定）。
12. SNS投稿スタジオPhase 2 新機能
目的
Instagram・X・Facebook・Threads・TikTok・LinkedIn・YouTube の7プラットフォーム別に投稿文を AI 生成し、品質採点 → 承認 → 予約投稿まで行う画面です。
使い方
- 左メニュー「SNS投稿（商品A）」をクリック
- 上部タブでプラットフォームを切替
- 右側の「品質採点（5項目）」を確認: Hook（冒頭のつかみ）／価値（具体数字）／CTA（行動喚起1つ）／PF最適／文字数
- 80点以上なら「承認して予約する」をクリック → 「✅ 予約完了（scheduled 確認済み）」表示
- 80点未満なら（デモでは Facebook が65点の例）「指摘を反映して再生成」で作り直す
- 下部の「推奨投稿時間」（プラットフォーム別に効果の高い時間帯）に合わせて予約する
システム間の連携
採点基準と推奨投稿時間は「13. アルゴリズム管理」のルールデータから読み込まれます（各SNSの最新事情が採点に自動反映）。予約投稿は本実装では PostEverywhere という予約投稿サービスの API に接続し、登録後に「scheduled（予約済み）」になったことを確認してから完了表示する二重チェック設計です。
13. アルゴリズム管理Phase 2 新機能
目的
各モール・SNSの「いま効くルール」（検索順位の傾向・優遇される投稿形式など）は頻繁に変わります。この画面はそのルールをデータとして管理し、古くなったら警告する仕組みです。プログラム改修なしで最新アルゴリズムに追従できます。
使い方
- 左メニュー「アルゴリズム管理」をクリック
- PF別カードの色を確認: 🟢緑=最新 ／ 🟡黄=60日更新なし（要確認）／ 🔴赤=90日更新なし（更新してください）
- 月1回、各モール・SNSの公式発表を確認し、変更があれば「改定を記録」で台帳に記録 + ルールを更新
- 下の「更新台帳」で過去の改定履歴（内容・出典）を確認できる
システム間の連携
ここで更新したルールは「4. AI一括生成」の文章生成、「12. SNS投稿スタジオ」の品質採点・推奨投稿時間に次回から自動で反映されます。更新履歴は全て残り、問題があれば1クリックで前のルールに巻き戻せます。
14. 管理設定（ルール）
目的
禁止語辞書・チャネル別文字数ルール・採点の重みをノーコード（プログラム不要）で編集する画面です。クライアントごとに違うルールを持てます。
使い方
- 左メニュー「管理設定（ルール）」をクリック
- 「禁止語辞書」で使ってはいけない言葉（例: 日本一・No.1・最安値）と置換候補を管理
- 「チャネル別 文字数ルール」で各モール・媒体の上限と必須項目を確認
- 「採点の重み」で SEO／訴求力／読みやすさ の配分を調整（クライアント別に変更可能）
システム間の連携
ここのルールが全画面の判定の大元です: AI生成（4）・エディタの警告（5）・プレビューのチェックリスト（6）・SNS採点（12）が全て同じデータを参照するため、1箇所直せば全部に効きます。