ノーコードのモバイルアプリ向けオンボーディングビルダーは、ユーザーに最高のオンボーディング体験を提供するための強力でカスタマイズ性の高いツールです。開発者やデザイナーでなくても、優れた結果を得ることができます。

オンボーディングの画面

オンボーディングのフローは、追加してデザインする複数の画面で構成されます。

ユーザーはボタンをタップして画面間を移動します。

オンボーディングの要素

オンボーディングの要素は、左側に表示順で表示されます。右上の Add をクリックして新しい要素を追加します。

追加できる要素のグループは以下のとおりです：

• Containers：コンテナを使うと、柔軟なレイアウトを設定できます。たとえば、2カラムのテキストを追加したい場合は、Columns を追加してから、左ペインの Columns に2つのテキストブロックをドラッグします。カルーセルを追加する場合は、内部の Media 要素に画像を追加する必要があります。

• Typography：事前にフォーマットされたテキストブロックを追加し、見た目を自由に設定できます。

• Media & Display：画像や動画のほか、アプリの価値をアピールしてユーザーの意欲を高めるアニメーションチャートも追加できます。

  対応している動画フォーマットはMP4とWebMです。メディアファイルの最大サイズは15MBです。

  Lottieのような非対応のアニメーション要素を追加したい場合は、動画に変換して（例：このツールを使用）、動画として埋め込むことができます。

• Quiz：テキストや画像の選択肢を使った短いアンケートを作成し、オンボーディング体験をカスタマイズしながらユーザーのことをより深く知ることができます。

• Inputs：ユーザーのデータを収集します。

• Buttons：ボタンを使うと、画面間の移動、オンボーディングの終了、ペイウォールへの移動をユーザーが行えます。光沢のあるボタンや動くボタンを追加して、ユーザーの注意を引き、インストールを購入につなげることもできます。

• Loaders：アニメーションローダーで、処理中もユーザーを飽きさせません。

• User engagement：テスティモニアル、ユーザーメールリスト、カウントダウンを追加できます。

要素IDとアクションID

ボタンをカスタムアクションに使用したい場合は、アクションID を割り当て、ソースコード内で使用します。アクションIDを使うと、同じアクションIDを持つ複数のボタンを同じ方法で処理できます。

特定のフィールドでユーザーの入力を処理したい場合（例：年齢やメールアドレスを保存する）は、要素ID を割り当て、ソースコード内で質問と回答を紐付けるために使用します。要素IDはオンボーディング内で1回だけ使用できます。

カスタマイズオプション

ビルダーでは以下のカスタマイズオプションを利用できます：

• Styles タブ：要素の見た目を調整します。
  
• Element タブ：表示/非表示、ボタン押下時のアクションなど、要素の見た目以外の属性を設定します。
  
• Screen タブ：ヘッダーや画面カウンターの表示など、画面全体の設定を行います。
  

画面と要素のコピー

オンボーディングを作成済みで、その一部を再利用したい場合や、少し変更を加えてA/Bテストを行いたい場合は、1つまたは複数の画面を別のオンボーディングにコピーできます。

画面をコピーするには、オンボーディングビルダーを開き、次のいずれかを行います：

• 単一の画面を右クリックして Copy を選択する
• 目的の画面を選択して Ctrl+C（Windows）または ⌘+C（Mac）を押す

個々の要素やテキストブロックも、同じオンボーディング内でも別のオンボーディング間でもコピーできます。

ウェブ to アプリファネルからの画面のコピー

FunnelFox で作成したウェブ to アプリファネルを使用していて、ファネルの画面をオンボーディングで使いたい場合は、ファネルビルダーで画面をコピーしてオンボーディングビルダーに貼り付けることで素早く実現できます：

1. FunnelFoxのファネルビルダーで画面を右クリックして Copy を選択するか、画面を選択して Ctrl+C/⌘+C を押します。
2. オンボーディングビルダーを開きます。
3. コピーした画面を挿入したい画面を右クリックして Paste を選択するか、その画面を選択して Ctrl+V/⌘+V を押します。コピーされた画面は選択した画面の下に挿入されます。