---
title: "フロー間で要素を再利用する"
description: "プラン選択、タイムライン、または画面全体をファイルに保存し、同じアプリや別のアプリの任意のフローに追加できます。"
---

> **AI agents**: to search Adapty docs faster and with fewer tokens, install the Adapty skill. Claude Code (self-updating via plugin): `claude plugin marketplace add adaptyteam/adapty-skills && claude plugin install adapty-skills@adapty` — other tools: `npx skills add adaptyteam/adapty-skills --all`

アプリ内のほとんどのペイウォールには、プラン選択、トライアルのタイムライン、比較ブロックなど、共通のパーツが含まれています。これらを毎回手作業でフローに組み込むのは手間がかかり、コピー間で内容がズレていきます。[flow-generator スキル](flow-generator-skill)を使えば、フローの任意のパーツをファイルに保存し、同じアプリや別のアプリの別のフローに追加できます。その際、そのパーツが依存するカラー、フォント、アイコン、プロダクトのバインディングも自動的に解決されます。

保存されるファイルはプレーンな JSON 形式です。アプリのコードと並べて管理したり、コミットしたり、チームメンバーに送ったりできます。

:::important
これはflow-generatorスキルの一部であるため、追加のインストールは不要です。[flow-generatorのインストール手順](flow-generator-skill#install-the-skill)に従えば、すぐに使えます。ダッシュボード内のフローへの変更を保存するため、まずドラフトに対して実行し、公開前にペイウォールビルダーで結果を確認してください。
:::

## 用途 \{#what-its-for\}

- **チームで本当に共有できるコンポーネントライブラリ。** プラン選択を一度保存すれば、新しいフローはすべて近似値ではなく本物から始められます。
- **一度修正して、すべてに反映。** 一つのフローでトライアルのタイムラインを修正して保存し、他のフローにも追加できます。
- **実績あるブロックを新しいアプリへ。** あるアプリでコンバージョンが取れたブロックは、次のアプリでも合理的な出発点になります。スキルが対象アプリのカタログにプロダクトを再バインドします。
- **デザインシステムを統一された状態に保つ。** 色とテキストスタイルだけを保存し（要素は一切なし）、別のフローに適用できます。

## 使い方 \{#how-to-use-it\}

普通の言葉で話しかけるだけです。あとはスキルが自動でやってくれます。

### フローの一部を保存する \{#save-a-piece-of-a-flow\}

```
Save the plan selection from my Premium paywall so I can reuse it.
```

このスキルはファイルを1つ書き出し、そのフルパスを表示するため、コミットまたは共有するファイルが常に明確です。また、保存内容のサマリーとして、要素の数、含まれるカラー・テキストスタイル・グループ・プロダクトの数も表示します。

確認事項は1つだけ：同じアプリ内で再利用するか、それとも他の場所でも使うかです。ファイルはどちらを選んでも完全な状態で保存されるため、間違えてもコストはかかりません。

要素とその内部コンテンツ、画面全体、再利用可能なコンポーネント、またはテーマ単体を保存できます。

### 別のフローに追加する \{#add-it-to-another-flow\}

```
Add the two-plan selection to my onboarding paywall, above the CTA.
```

書き込む前に、スキルはまずプランを表示します。ブロックがどこに配置されるか、何が追加されるか、移動先のどの色やテキストスタイルを引き継ぐか、衝突を避けるためにどのIDをリネームする必要があるかを正確に示します。また、インポートされるコピーも表示されるので、古いフローに属していたテキストを確認できます。

Adaptyが自力で解決できないもの——このアプリのカタログに存在しないプロダクト、ここにソースのない変数——は、Adaptlyが推測するのではなく、あなたが仕上げるべき項目として別途リストアップされます。

プランを確認したら、「go」と言ってください。スキルがドラフトを作成し、画面をレンダリングして結果を確認できるようにします。

## 例 \{#examples\}

以下の各行は、3つの異なるフローに追加された1つの保存済み要素です。何も再ビルドする必要はなく、同じファイルがそれぞれの配置先に合わせて適用されました。

**2プランの選択UI**が、投資アプリ、語学アプリ、音楽アプリにそれぞれ表示されています。カードの構造はそのままに、各アプリのアクセントカラーが適用されています。

**トライアルのタイムライン。** 構造は使い回せますが、コピーはプロダクトごとに固有のものにする必要があります。番号付きの3ステップも、別のアプリの説明になっていては意味がありません。

**トライアルの比較。** こちらはプロダクトも変数も含まないため、アプリ間でそのまま使い回せます。

## 仕組み \{#how-it-works\}

保存した要素は、単体で完結することはほとんどありません。フロー内の他の場所に定義されているカラー、テキストスタイル、フォント、アイコン、プロダクト、変数などを参照しています。このスキルは、それらを2種類に分類します。

**一緒に持ち運べるもの。** カラー、テキストスタイル、フォント、アイコンはそれぞれの定義ごとファイル内に格納され、移動先では

| 送信先 | 動作 |
| :--- | :--- |
| 同じ名前で同じ内容がすでに存在する | 再利用する |
| その名前を別の内容で使用している | **送信先の値を採用**し、通知する |
| その名前を認識していない | ファイルの定義を追加する |

採用は通常、望ましい動作です。別のアプリに移動したカードは、そのアプリの見た目に合わせるべきだからです。両方の値がプランに表示されるため、選択を上書きすることもできます。

**スキルが引き継げないもの。** プロダクトID、変数のソース、**Navigate to screen**のターゲットなど、フローやアプリに固有の参照は自動では解決できません。スキルは可能な限り再バインドを試みますが、解決できなかったものはこっそり修正するのではなく、`NEEDS YOU` としてリストアップします。

下書きが保存される前に、スキルはフロー全体を再チェックします。すべての参照が解決されているか、すべてのロケールが埋まっているか、IDが衝突していないか、そして公開チェックに合格するかを確認します。残った問題は必ず開示され、サイレント修正は行われません。

## 確認すべき点 \{#what-to-check\}

- **コピーはプロダクトに関するものです。** 元のフローで読みやすいブロックでも、移動先のフローでは内容が合わないことがあります。プランには `WILL SAY` としてインポートするテキストが表示されるので、書き込む前に確認できます。
- **価格は変数であり、テキストではありません。** 移動先に価格が参照するプロダクトが存在しない場合、価格は空白になります。プランにはその旨が表示されます。
- **サイズはコンテキストによって変わることがあります。** 元のコンテナに合わせてサイズ調整された要素が、移動先では引き伸ばされる場合があります。これはレンダリングプレビューで確認できます。

## 制限事項 \{#limitations\}

- **プロダクトはアプリをまたいで自動的に引き継がれません。** スキルはストアのプロダクト ID を照合して再バインドを試みますが、移行先のアプリにプロダクトが存在しない場合はバインドを解除し、手動でアタッチするよう通知します。
- **動画とカスタムフォントは手動での対応が必要です。** いずれもターミナルからアップロードすることはできません。
- **プレビューは1つの画面・1つの状態のみ表示します。** ロケールの変更や選択状態はプレビューに反映されません — それらはプランを確認してください。