# 通知設計書 20-感謝メール

## 概要

本ドキュメントは、ユーザーへの感謝を伝えるスペシャルメールの設計仕様を定義する。

### 本通知の処理概要

この通知は、Giselleを利用してプロダクトを構築しているユーザーに対して、感謝の気持ちを伝えるスペシャルメールを送信する処理である。

**業務上の目的・背景**：ユーザーの創造性と貢献に対する感謝を表明することで、ユーザーとの感情的なつながりを強化し、長期的なロイヤルティを醸成することを目的としている。ユーザーのワークフロー、実験、デプロイメントがプロダクトの進化に貢献していることを伝え、ユーザーがプロダクトの成功に不可欠な存在であることを実感させる。

**通知の送信タイミング**：特別な機会（年末、周年記念、ユーザーの活動マイルストーン達成時など）に、マーケティングチームがキャンペーンを実行して送信される。

**通知の受信者**：Giselleで積極的にプロダクトを構築しているユーザー、または全ユーザーに送信される。感謝の表明は全員に共通するメッセージとなる。

**通知内容の概要**：感謝のメッセージ、ユーザーの創造性への称賛、継続的なビルドへの誘導CTAが含まれる。視覚的に印象的なヒーロー画像を含む。

**期待されるアクション**：受信者が感謝のメッセージを受け取り、プロダクトへの帰属意識を感じること。「Continue Building」ボタンからGiselle Studioに戻り、創作活動を続けること。

## 通知種別

メール（マーケティングメール / スペシャルメール）

## 送信仕様

### 基本情報

| 項目 | 内容 |
|-----|------|
| 送信方式 | 非同期（バッチ送信） |
| 優先度 | 低〜中 |
| リトライ | 有・3回 |

### 送信先決定ロジック

マーケティングプラットフォームで管理されるメーリングリストに基づき送信。アクティブユーザーまたは全ユーザーをターゲットとする。

## 通知テンプレート

### メール通知の場合

| 項目 | 内容 |
|-----|------|
| 送信元アドレス | noreply@giselles.ai（想定） |
| 送信元名称 | Giselle |
| 件名 | Thank you for building with Giselle |
| 形式 | HTML |

### 本文テンプレート

```
[Giselleロゴ]

[感謝ヒーロー画像]

Thank You for Building with Giselle.

Every workflow, every experiment, every deployment — they all move
us forward.

Your creativity shapes the way AI gets built.

Here's to you, and to what comes next.

[Continue Building →]

[フッター]
```

### 添付ファイル

| ファイル名 | 形式 | 条件 | 説明 |
|----------|------|------|------|
| なし | - | - | 添付ファイルなし |

## テンプレート変数

| 変数名 | 説明 | データ取得元 | 必須 |
|--------|------|-------------|-----|
| continueBuildingUrl | Giselle StudioへのURL | 固定値（デフォルト: https://studio.giselles.ai） | Yes |

## 送信トリガー・条件

### トリガー一覧

| トリガー種別 | トリガーイベント | 送信条件 | 説明 |
|------------|----------------|---------|------|
| 手動操作 | マーケティングキャンペーン実行 | 特別な機会（年末、周年等） | 感謝メール送信 |

### 送信抑止条件

| 条件 | 説明 |
|-----|------|
| 配信停止済みユーザー | マーケティングメールの配信停止ユーザーには送信しない |

## 処理フロー

### 送信フロー

```mermaid
flowchart TD
    A[感謝メールキャンペーン開始] --> B[対象ユーザーリスト取得]
    B --> C[配信停止ユーザー除外]
    C --> D[テンプレート変数セット]
    D --> E[Reactメールコンポーネントレンダリング]
    E --> F[メール送信サービスへ送信]
    F --> G{送信結果}
    G -->|成功| H[送信ログ記録]
    G -->|失敗| I[リトライ処理]
    H --> J[終了]
    I --> J
```

## データベース参照・更新仕様

### 参照テーブル一覧

| テーブル名 | 用途 | 備考 |
|-----------|------|------|
| users | ユーザー情報取得 | メールアドレス |
| email_preferences | 配信設定確認 | マーケティングメール配信可否 |

### テーブル別参照項目詳細

#### users

| 参照項目（カラム名） | 用途 | 取得条件 |
|-------------------|------|---------|
| email | 送信先メールアドレス | アクティブユーザーまたは全ユーザー |

### 更新テーブル一覧

| テーブル名 | 操作 | 概要 |
|-----------|------|------|
| email_send_logs | INSERT | 送信履歴の記録 |

#### 送信ログテーブル

| 操作 | 項目（カラム名） | 更新値 | 備考 |
|-----|-----------------|-------|------|
| INSERT | email_type | 'thank_you_for_building' | 通知種別 |
| INSERT | recipient_email | {送信先} | 受信者メール |
| INSERT | sent_at | CURRENT_TIMESTAMP | 送信日時 |
| INSERT | status | 'sent' / 'failed' | 送信結果 |

## エラー処理

### エラーケース一覧

| エラー種別 | 発生条件 | 対処方法 |
|----------|---------|---------|
| 送信失敗 | メールサーバー接続エラー | リトライ処理 |
| 画像読み込みエラー | ヒーロー画像URL無効 | フォールバック処理 |
| テンプレートエラー | 必須変数の欠落 | エラーログ記録 |

### リトライ仕様

| 項目 | 内容 |
|-----|------|
| リトライ回数 | 3回 |
| リトライ間隔 | 指数バックオフ |
| リトライ対象エラー | 一時的なサーバーエラー |

## 配信設定

### レート制限

| 項目 | 内容 |
|-----|------|
| 1分あたり上限 | メールサービスプロバイダーの制限に準拠 |
| 1日あたり上限 | 対象ユーザー数 |

### 配信時間帯

特別な感謝メールのため、受信者のタイムゾーンを考慮した最適な時間帯に送信。年末年始など、感謝の気持ちが伝わりやすいタイミングを選択。

## セキュリティ考慮事項

- 配信停止リンクをフッターに含める
- TLS暗号化通信

## 備考

- ヒーロー画像（thank-you-for-building-1.jpg）で視覚的なインパクトを提供
- h1スタイルで感謝メッセージを強調
- シンプルな構成で、感謝の気持ちを明確に伝える
- 署名なし（シンプルな構成）

---

## コードリーディングガイド

本通知を理解するために参照すべきファイルと、推奨する読み解き順序を以下に示す。

### 推奨読解順序

#### Step 1: データ構造を理解する

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 1-1 | thank-you-for-building.tsx | `apps/studio.giselles.ai/emails/marketing/special/thank-you-for-building.tsx` | 29-31行目：`ThankYouForBuildingEmailProps`インターフェースの定義 |

**読解のコツ**: 最小限の1プロパティ構成（continueBuildingUrl）で、シンプルな感謝メッセージに焦点を当てていることに注目。

#### Step 2: エントリーポイントを理解する

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 2-1 | thank-you-for-building.tsx | `apps/studio.giselles.ai/emails/marketing/special/thank-you-for-building.tsx` | 33-77行目：メインコンポーネントの構造 |

**主要処理フロー**:
1. **33-35行目**: Props受け取りとデフォルト値設定
2. **36行目**: ヒーロー画像URL取得
3. **46-53行目**: ヒーロー画像セクション
4. **54-69行目**: コンテンツセクション
5. **66-68行目**: 「Continue Building」CTAボタン

#### Step 3: 感謝メッセージ構造を理解する

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 3-1 | thank-you-for-building.tsx | `apps/studio.giselles.ai/emails/marketing/special/thank-you-for-building.tsx` | 55-65行目：感謝メッセージの構成 |

**主要処理フロー**:
- **55行目**: h1スタイルで感謝見出し「Thank You for Building with Giselle.」
- **56-59行目**: 貢献への称賛メッセージ
- **60-62行目**: 創造性への称賛
- **63-65行目**: 今後への期待

### プログラム呼び出し階層図

```
ThankYouForBuildingEmail (メインコンポーネント)
    │
    ├─ getEmailAssetUrl() ─── ヒーロー画像URL生成
    │
    ├─ EmailHeader ─── ヘッダー部品（ロゴのみ）
    │
    ├─ Section (imageSection)
    │      └─ Img ─── 感謝ヒーロー画像
    │
    ├─ Section (コンテンツ)
    │      ├─ Heading (h1) ─── 感謝見出し
    │      ├─ Text ─── 貢献への称賛
    │      ├─ Text ─── 創造性への称賛
    │      ├─ Text ─── 今後への期待
    │      └─ Button ─── Continue Building CTA
    │
    └─ EmailFooter ─── フッター部品
```

### データフロー図

```
[入力]                       [処理]                            [出力]

キャンペーン設定    ───▶  ThankYouForBuildingEmail    ───▶  HTMLメール
└── continueBuildingUrl        コンポーネント                    │
                                     │                          │
                                     ▼                          │
                            React Email レンダリング ────────────┘
```

### 関連ファイル一覧

| ファイル | パス | 種別 | 役割 |
|---------|------|------|------|
| thank-you-for-building.tsx | `apps/studio.giselles.ai/emails/marketing/special/thank-you-for-building.tsx` | ソース | メインテンプレートコンポーネント |
| email-header.tsx | `apps/studio.giselles.ai/emails/components/email-header.tsx` | ソース | 共通ヘッダーコンポーネント |
| email-footer.tsx | `apps/studio.giselles.ai/emails/components/email-footer.tsx` | ソース | 共通フッターコンポーネント |
| index.ts | `apps/studio.giselles.ai/emails/components/index.ts` | ソース | 共通スタイル・コンポーネントのエクスポート |
| thank-you-for-building-1.jpg | `（アセットディレクトリ）` | 画像 | 感謝ヒーロー画像 |
