よくあるフローのレシピ

このセクションでは、フロー&ペイウォールビルダーで最もよく使われる画面テンプレートを、レイアウトの選択からインタラクションまで、要素ごとに順を追って解説します。一部のガイドはアプリのコードまで続き、フローが結果を返す方法についても説明します。各ガイドは独立しており、標準的なフロー&ペイウォールビルダーの要素を使用しています。

フロー間で要素を再利用する

プラン選択画面、タイムライン、または画面全体をファイルに保存し、同じアプリや別のアプリの任意のフローに追加できます。

アナリティクス用の名前 ID

フローの画面、入力フィールド、クイズの選択肢にわかりやすいIDをつけることで、AmplitudeやMixpanelに送信されるイベントがコードではなく名前で表示されるようになります。

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

フロー&ペイウォールビルダーで標準的なペイウォール画面を作成するためのステップバイステップガイド。

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

シングルCTAのヒーローペイウォールに「すべてのプランを表示」リンクとボトムシートを追加し、プロダクト一覧を表示する方法を説明します。

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

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

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

条件付き表示を使用して、ユーザーが選択したプロダクトに応じて異なる機能リストを表示する方法を説明します。

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

ユーザーがペイウォールを離れる前に、最後のオファーを表示するためにクローズタップを横取りします。

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

年間プランの月換算価格の横に、月額プランの価格を取り消し線で表示して、割引を一目でわかるようにします。

購入結果への対応

アプリのコードで購入結果に反応し、購入成功時に2つ目のフローを開く方法を説明します。

トライアル切り替え付きのペイウォールを作成する

ペイウォールをトライアルありのプロダクトとなしのプロダクトで切り替え、選択されたプロダクトをトグルに連動させます。

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

実際の例を使って、マルチスクリーンのオンボーディングフローを構築するプロセス全体(スクリーン、コンテンツ、ナビゲーション、条件分岐)を順を追って説明します。

基本的なパーソナライズされたフローを作成するには、こちらのクイックスタート動画をご覧ください: