変数を使うと、フロー内に動的なコンテンツ（プロダクトの価格、オファーの詳細、各ユーザーのコンテキストに応じて更新されるデータなど）を表示できます。要素の表示制御や画面コンテンツのパーソナライズにも活用できます。

変数パネルを開くには、左パネルの { } アイコンをクリックします。パネルには3つのタブがあります：

• カスタム: 自分で作成・管理する変数。
• プロダクト: ストアからローカライズされたプロダクト・オファーデータを取得する組み込み変数。
• エレメント: キャンバス上のエレメントの状態に紐づく変数。

カスタム変数

カスタム変数を作成する

1. 変数パネルで + をクリックします。
2. 変数の名前を入力します。
3. タイプを選択します：String、Number、または Boolean。
4. 初期値を設定します。これはフローが開始したときに変数が保持する値です。
5. Create variable をクリックします。

インタラクションで変数を更新する

任意の要素に Set variable アクションを追加することで、変数の値を実行時に更新できます。

1. キャンバス上の要素を選択します。
2. Interactions タブで Add trigger をクリックします。
3. On tap を選択し、Add action をクリックします。Action type ドロップダウンから Set variable を選択します。
4. Add variable をクリックし、変数を選択して新しい値を設定します。

プロダクト変数

プロダクト変数は、アプリストアからローカライズされたデータを直接取得します。テキストフィールドで使用すると、ローカライズされた価格、タイトル、オファーの詳細を表示できます。また、条件に使用すると、オファーの対象資格に基づいてコンテンツを表示または非表示にできます。

変数	説明	例
prod_title	プロダクトのローカライズされたタイトル	Premium Subscription
prod_price	1請求期間あたりのローカライズされた価格	$9.99
prod_price_per_day	1日あたりに換算したサブスクリプション価格。サブスクリプション以外は空。	$0.33
prod_price_per_week	1週間あたりに換算したサブスクリプション価格。サブスクリプション以外は空。	$2.33
prod_price_per_month	1ヶ月あたりに換算したサブスクリプション価格。サブスクリプション以外は空。	$9.99
prod_price_per_year	1年あたりに換算したサブスクリプション価格。サブスクリプション以外は空。	$119.88
offer_price	初回オファーまたはプロモーションオファーのローカライズされた価格。ユーザーがいずれのオファーにも対象外の場合は空。	$0.99
offer_billing_period	オファーのローカライズされた請求期間。トライアルおよび前払いオファーの場合は offer_full_duration と同じ。対象外の場合は空。	1 week
offer_full_duration	オファーのローカライズされた合計期間。対象外の場合は空。	1 month
is_free_trial	ユーザーが無料トライアルのオファーに対象である場合に true を返す。	true
is_pay_up_front	ユーザーが前払いオファーに対象である場合に true を返す。	true
is_pay_as_you_go	ユーザーが従量課金オファーに対象である場合に true を返す。	true

prod_price_per_* 変数は、プロダクトの請求期間の価格を指定した期間に換算します。換算には実際のカレンダー日付ではなく、固定の期間の長さを使用します：

• 1週間 = 7日
• 1ヶ月 = 30日
• 1年 = 12ヶ月、または365日

月額 $59.99 のサブスクリプションの場合、prod_price_per_week は $14.00 を返します：$59.99 × 7 ÷ 30 = $13.9977 を表示用に丸めた値です。1ヶ月は 30 ÷ 7 ≈ 4.2857週間なので、週あたりの値に4を掛けても元の価格には戻りません。

オファー変数の値は、ユーザーが対象となるオファーの種類によって異なります。例として、週次サブスクリプション「Premium Subscription」（$5）に3種類のオファーがある場合を見てみましょう。

• Pay As You Go: 最初の3週間は3ドル（週ごとに請求）、その後は週5ドル。
• Pay Up Front: 最初の3週間は8ドル（即時請求）、その後は週5ドル。
• Free Trial: 最初の1週間無料、その後は週5ドル。

この例では、prod_title は「Premium Subscription」を返し、prod_price は5ドルを返します。オファー変数の値は、ユーザーが対象となるオファーによって異なります：

変数	Pay As You Go	Pay Upfront	Free Trial
offer_price	$3	$8	$0
offer_billing_period	1週間	3週間	1週間
offer_full_duration	3週間	3週間	1週間
Pay UpfrontおよびFree Trialオファーの場合、offer_billing_periodとoffer_full_durationは同じ値を返します。Pay As You Goの場合、課金期間は1週間ですが全体の期間は3週間であるため、両者の値は異なります。

これらの値はすべてストアから取得されるため、ビルダーのプレビューで解決できるのは一部のみです。オファーの値はキャンバス上では未解決のまま表示され、is_free_trial、is_pay_up_front、is_pay_as_you_go はプロダクトカードで選択したオファーに従います。ビルド中に各オファータイプをプレビューするには、プロダクトとオファーのプレビュー を参照してください。

要素変数

要素変数は、ユーザーの選択（クイズで選んだ項目、現在表示しているタブ、トライアルトグルのオン/オフなど）を記録します。

要素の変数タイプはグループによって異なります：

• Single choice：シングルチョイスのクイズ、タブ、トライアルトグル：
  • selectedOptionId：条件で使用する要素ID
  • selectedOptionTitle：動的テキストで使用する要素タイトル
• Multi-choice：マルチチョイスのクイズ：
  • selectedOptionIds：条件で使用する要素ID
  • selectedOptionTitles：動的テキストで使用する要素タイトル
• Toggle：オン・オフを切り替える要素：
  • isActive：ブール値
• Product：プロダクトカード：
  • selectedProduct：条件で使用する選択済みプロダクト

よくあるユースケースとしては、以下のようなものがあります：

• トライアルトグルが有効かどうかに応じて異なるコンテンツを表示する。
• クイズの回答に基づいてユーザーを異なる画面に誘導する

テキストに変数を使用する

テキスト要素に変数を挿入するには:

1. キャンバス上のテキスト要素を選択します。
2. Design タブで Content フィールドを見つけ、テキストを入力します。
3. フィールド内の { } アイコンをクリックします。
4. リストから変数を選択します。

スタイル変数

変数単体にリッチテキスト書式を適用することはできません。Content フィールドで変数を選択して太字、斜体、下線、取り消し線、色の変更を適用しても、効果はありません。

リッチテキストの設定はテキストブロック全体にのみ適用されます。テキストにスタイルを設定するには、Design タブの Typography セクションを使用するか、保存済みのテキストスタイルを適用してください。

フロー内でコンテンツを再利用する

ボタンのラベル「Continue」、繰り返し使うコール・トゥ・アクション、複数の画面に表示する免責事項など、フロー内で同じコンテンツが何度も登場することがあります。機能説明のような長めのテキストを複数の画面で使い回す場合も同様です。各要素にいちいち入力する代わりに、カスタム変数に保存しておきましょう。ユーザーによって異なる画面に誘導する場合でも、表示される文言を統一できます。

1. カスタム変数を作成して、タイプを String に設定し、初期値に再利用したいテキストを入力します。たとえば、変数名を button.navigation、値を Continue にします。
   
2. テキストを表示したい各要素の Content フィールドにこの変数を挿入します。 テキストをすべての箇所で変更するには、変数の初期値を一度更新するだけです。その変数を使用しているすべての要素が自動的に更新されるため、各画面を手作業で編集する必要はありません。