> ## Documentation Index
> Fetch the complete documentation index at: https://docs.pubrio.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Stripo 連携

> Stripoからレスポンシブなテンプレートを直接Pubrioのシーケンスにプッシュできます。

# Stripo x Pubrio: デザインからシーケンスへのパイプライン

**Stripo** のクリエイティブスタジオと **Pubrio** の実行インフラストラクチャの間のギャップを埋めましょう。

この統合により、デザインアセットを即座に運用可能にできます。HTMLファイルを手動で移動させる代わりに、テンプレートをStripoからPubrioの **シーケンス (Sequences)** へ直接プッシュ（送信）できるため、自動化フローで常に最新のレスポンシブデザインを使用することが保証されます。

<img src="https://mintcdn.com/pubrio/-pF8aRy6kVilh7uE/images/stripo-integration.png?fit=max&auto=format&n=-pF8aRy6kVilh7uE&q=85&s=ca0674742024b4e0ff1459b7403dafef" alt="PubrioとStripoの連携" width="1263" height="619" data-path="images/stripo-integration.png" />

## テックスタック

<CardGroup cols={2}>
  <Card title="Stripo" icon="paint-brush" href="https://stripo.email">
    **デザインレイヤー。**
    Stripoを使用すると、コードなしで複雑でレスポンシブなHTMLメールモジュールを作成できます。ここはビジュアルアセットが生まれる場所です。
  </Card>

  <Card title="Pubrio" icon="list-check" href="https://pubrio.com">
    **シーケンスエンジン。**
    Pubrioは配信インフラストラクチャとして機能します。テンプレートを取り込み（Ingest）、シーケンスロジックとデータトリガーに基づいてローカライズされた配信をオーケストレーションします。
  </Card>
</CardGroup>

## なぜ両者を接続するのか？

メールデザインを、自動化されたCI/CDパイプラインの一部として扱いましょう。

### 1. 摩擦ゼロのハンドオフ

運用を遅らせる手動の「ダウンロードしてアップロード」のサイクルを排除します。

* **手動の方法:** ZIPをエクスポート -> 解凍 -> HTMLをコピー -> エディタに貼り付け。
* **自動化された方法:** Stripoで「Export to Pubrio」をクリックします。テンプレートは即座にリソースとしてPubrioの **シーケンスライブラリ (Sequence Library)** で利用可能になり、すぐに有効化できます。

### 2. データ駆動型レンダリング

Pubrioのエンジンは、ビジュアルデザイン内での「ヘッドレス（Headless）」パーソナライゼーションを可能にします。

* **動的注入:** Pubrioの変数（例：`{{company.tech_stack}}`, `{{person.location}}`）をStripoのテキストブロックに直接埋め込みます。
* **実行:** シーケンスがトリガーされると、Pubrioはグローバルデータグラフを使用してこれらの変数をリアルタイムで解決し、レンダリングされたメールがすべての受信者にとって文脈的に正確であることを保証します。

***

## 設定ガイド

パイプラインを一度設定すれば、継続的なテンプレート同期が可能になります。

<Steps>
  <Step title="API認証情報を生成">
    Pubrioワークスペースで、**Settings > API & Integrations** に移動します。Stripoコネクタ専用の新しいキーを生成します。
  </Step>

  <Step title="Stripoで送信先を接続">
    Stripoエディタで任意のテンプレートを開き、**Export** をクリックします。

    1. 連携リストから **「Pubrio」** を選択します。
    2. **API Key** を入力します。
    3. 接続にラベルを付けます（例：「Prod Sequences」）。
  </Step>

  <Step title="アセットをプッシュ">
    **Export** をクリックします。システムはHTMLコードとホストされた画像をPubrioのアセットマネージャーに転送します。
  </Step>

  <Step title="シーケンスに添付">
    Pubrio内で **Sequences** を開きます。メールステップを定義する際、**「Load from Library」** を選択し、同期したばかりのテンプレートを選択します。
  </Step>
</Steps>

<Note>
  **プロのヒント:** Stripoでデザインを更新した場合は、単に再エクスポートするだけです。Pubrio内の既存のアセットを上書きすることを選択でき、そのテンプレートを使用している稼働中のシーケンスを即座に更新できます。
</Note>

***

## 運用ユースケース

### 1. 自動化されたカスタマーオンボーディング

**目標:** アプリの使用状況によってトリガーされる、高精細なウェルカムメールを配信する。

* **デザイン:** プロダクトチームがStripoでビジュアルな「利用開始ガイド」を作成します。
* **ロジック:** 新しいユーザーがサインアップすると、Pubrioシーケンスがトリガーされます。
* **実行:** Pubrioは最新のStripoデザインを取得し、ユーザー固有のアカウント詳細を注入して、配信ステップを実行します。

### 2. 動的なプラットフォーム通知

**目標:** ビジネスシグナルに基づいてローカライズされたアラートを送信する。

* **デザイン:** マーケティングチームがStripoでモジュール式のアラートテンプレートを作成します。
* **ロジック:** Pubrioが「購買シグナル」（例：見込み客が競合他社の技術を導入した）を検知します。
* **実行:** シーケンスは自動的にアカウント所有者にアラートメールを送信します。この際、Stripoテンプレートを使用して、データをクリーンでブランド化された形式で提示します。

***

## パイプラインを構築する

<CardGroup cols={2}>
  <Card title="Stripoを開く" icon="palette" href="https://stripo.email">
    **アセットを作成。**
    テンプレートをデザインし、エンジンにプッシュしましょう。
  </Card>

  <Card title="シーケンスを設定" icon="arrow-progress" href="https://dashboard.pubrio.com">
    **Pubrioを開く。**
    新しいテンプレートをシーケンスステップにマッピングして、稼働させましょう。
  </Card>
</CardGroup>
