ChurnScript - 解約防止トークスクリプト&ロールプレイ練習ツール

## 1. アプリの目的・ターゲットユーザー
顧客サポート担当者・カスタマーサクセス担当者・SaaS/サブスク事業の営業担当者が「解約申し出」を受けたとき、適切な引き止めトーク・代替案提示・感情対応をスムーズにできるよう練習・準備できる無料ツール。外部APIなし・登録不要・ブラウザ完結。

## 2. 主要機能
- **スクリプトビルダー**: 解約理由カテゴリ(価格・機能不満・競合乗り換え・利用頻度低下・担当者交代・予算削減)を選択すると、5ステップ(傾聴→共感→課題確認→代替提案→クロージング)の引き止めトークスクリプト雛形を自動生成。各ステップのテキストは自由編集可。
- **業種別プリセット20件**: SaaS/EC/ジム/保険/通信/学習サービスなど業種ごとに最適化された引き止めトーク例を内蔵。ワンクリックで読み込んでカスタマイズできる。
- **ロールプレイ練習モード**: 画面が「顧客側」「担当者側」に分かれ、顧客の追撃セリフ(30パターン内蔵)がランダムに表示され、担当者が返答を入力。最後に「共感度・提案の具体性・クロージング強度」の3軸を自己採点できるルーブリック。
- **想定問答ライブラリ**: よくある顧客の反論フレーズ(「他社の方が安い」「使いこなせなかった」等)と模範返答例を30件収録。キーワード検索で即引き出せる。
- **スクリプトの保存・エクスポート**: 作成したスクリプトをLocalStorageに複数保存し、テキスト/Markdown形式でクリップボードコピーまたはファイルダウンロード可能。

## 3. 画面構成
- **トップページ**: 解約理由カテゴリを6枚のカードで選択するスタート画面。「プリセットから始める」「スクリプトを新規作成」「ロールプレイを始める」の3ボタン。
- **スクリプトエディタ画面**: 左カラムに5ステップのアコーディオンフォーム、右カラムにリアルタイムプレビュー(チャット吹き出し風)。上部に業種プリセット選択ドロップダウン。
- **ロールプレイ画面**: 上半分が顧客発言エリア(テキストカード)、下半分が担当者入力テキストエリア+「次へ」ボタン。全5ターン終了後、自己採点スライダー3本が出現しスコアを記録。
- **想定問答ライブラリ画面**: 検索ボックス+カテゴリフィルター+カード一覧。各カードに「顧客の言葉」→「模範返答」を折りたたみ表示。
- **保存スクリプト一覧画面**: サムネイル(業種・解約理由・最終更新日)のカード一覧。編集・削除・コピーボタン付き。

## 4. データ構造
**LocalStorage (JSON)**
- `churnscripts`: [{id, title, industry, churnReason, steps:[{stepNo, stepName, scriptText}], updatedAt}]
- `roleplayscore`: [{date, industry, churnReason, scores:{empathy, proposal, closing}, memo}]

**内蔵JSONファイル(静的)**
- `presets.json`: {industry, churnReason, steps[]} × 20件
- `objections.json`: {category, customerPhrase, modelAnswer} × 30件
- `roleplayLines.json`: {churnReason, turn, customerLine} × 150件(30パターン×5ターン)

**PHP/MySQL**: スコアの匿名集計(任意)。テーブルは`roleplay_scores(id, industry, churn_reason, empathy, proposal, closing, created_at)`の1テーブルのみ。なくても動作可能。

## 5. デザインの方向性
- カラーパレット: ネイビー(#1E3A5F)×ティール(#2EC4B6)×ホワイト×ライトグレー。ビジネスツールらしい落ち着いた知的な印象。
- フォント: 日本語はNoto Sans JP、本文14px。
- スクリプトプレビューはLINEライクな吹き出し形式で視覚的にわかりやすく。
- ロールプレイ画面はチャットUIを踏襲し、顧客発言は左グレー吹き出し、担当者入力は右ティール吹き出し。
- スマホでは縦1カラム、PCでは2カラムに切り替えるレスポンシブCSS Gridレイアウト。
- アニメーションは最小限(フェードイン/スライドイン)にとどめ、業務集中を妨げないUXを優先。