Common flow recipes

This section walks through how to build the most common screen templates in the Flow Builder — element by element, from the layout choices to the interactions. Each guide is self-contained and uses the standard Flow Builder elements.

基本的なペイウォール画面の作成

フローBuilder で標準的なペイウォール画面を構築するためのステップバイステップガイド。

ボトムシートですべてのプランを表示

シングルCTA、「すべてのプランを表示」リンク、プロダクト一覧を展開するボトムシートを備えたヒーローペイウォールを作成します。

タブ付きペイウォールの作成

2つのタブで異なるフィーチャーリスト、プロダクトグループ、購入アクションを切り替えるペイウォール画面を作成します。

プロダクトごとに異なる機能を表示

条件付き表示を使って、ユーザーが選択したプロダクトに応じて異なる機能一覧を表示します。

ユーザーが閉じるボタンをタップしたときにオファーを表示する

最初の閉じるボタンのタップを検知して、ユーザーがペイウォールを離れる前にラストチャンスオファーを表示します。

割引バッジ付きの取り消し線価格を表示する

年間プランの実質月額価格の横に月額プランの価格を打ち消し線付きで表示して、割引をひと目でわかるようにします。

パーソナライズされたオンボーディングフローの作成

複数画面で構成されるオンボーディングフローの全構築プロセス(画面、コンテンツ、ナビゲーション、条件分岐)を実例を使って説明します。

Follow this quickstart video to create a basic personalized flow: