ポップアップ：スタートガイド
概要
ポップアップは特定のエレメントに添付されていないフローティングバルーンステップです。 ポップアップは任意のページエレメントにメッセージを添付せずに、ユーザーに対して一般的な情報やガイダンスを提供するために使用することができます。
ポップアップは注目すべきテキストにユーザーの関心を引くために使用されます。 通常のステップバルーンとは異なり、ポップアップは要素に添付されずにページの中央に表示されます。 ポップアップはスマートウォークスルー内のどこにでも配置できます。
ポップアップは一般的に、サイトやユーザーが完了するプロセスについてのメッセージを伝えることでユーザーエクスペリエンスを強化するために使用されます。 ポップアップはプロモーションのために使用することもできます。
ユースケース
ポップアップの一般的な使用例には以下のようなものがあります。
- プロセスの終わりにサクセスポップアップを使用する
- サイトにアクセスしたときに、スマートウォークスルーのAuto Playの初めにウェルカムポップアップが出るように配置する
- リッチテキストエディターを使用してミニメニューのポップアップを作成し、他のスマートウォークスルーへのリンクを追加する
使用方法
ポップアップは最初にスマートウォークスルーで構築しても、後から追加してもかまいません。 ポップアップは画面の中央に表示され、任意のエレメントには添付されません。 ポップアップはメインパスやスマートウォークスルーのブランチのどこでも使用できます。
ポップアップステップの作成
- Smart WalkThruで、ポップアップステップを追加したい 2 つのステップの間にあるオレンジ色のプラス記号にカーソルを合わせます。
- ホバーメニューでポップアップを選択します。
- インタラクションタブでは、バルーンセクションは通常のバルーンステップと同じように動作します。 任意のタイトルと本文を入力し、テキストツールを使用して調整することができます。
グリッドではポップアップステップが画面上に表示される場所を指定することができます。 スポットライトを有効にし、オーバーレイを無効にすることができます。 これにより、ポップアップの表示中もユーザーがサイトとインタラクションを継続できるようにします。
スポットライトを無効にすると、ステップトリガーを使用してポップアップステップにカスタムトリガーを追加することができます。
- ポップアップステップは WalkThru の概要にあるポップアップアイコンで表示されます。
ポップアップのインタラクション (オプション)
ポップアップを作成すると、ポップアップステップのオプションメニューが開きます。 インタラクションタブで以下の設定を行います。
- ［テキストを追加する］をクリックする：タイトルフィールドのポップアップ部分にメインメッセージを追加し、下のフィールドにテキストを追加します。
- デザインの変更：デザインギャラリーを使用してバルーンにテンプレート外観を適用します。
- リッチテキストエディターと CSS： リッチテキストエディターにアクセスして、テキストのサイズ、スタイル、色の変更、ダイナミックテキストの追加、または画像の挿入を行います。 CSSにアクセスしてカスタム変更を行います。
- バルーンに X を表示する：バルーンから X を削除しないよう推奨されています。
- スポットライト：スポットライトがオンになっている場合、ユーザーはページ上の他のエレメントとインタラクションを行うことができません。
- ボタンを表示する：
- 次へ/完了：次へはポップアップの後にステップがある場合、完了はそのステップが最後である場合。
- スタートボタン：ウォークスルーの最初のステップである場合。
- 戻る：前のステップに戻ります。
- ［戻る］ボタンは前のステップに次へのトリガーがある場合にのみ表示されます。
- キャンセル：ウォークスルーを終了します。
- オートメーション中に表示： オートメーションの実行中にポップアップを表示します。 詳細は以下をご覧ください。
オートメーション中に表示
フローステップ（自動ステップ、待機など）の再生中に、ユーザーは画面をクリックして自動再生を中断し、スマートウォークスルーによる再生を停止できます。
この機能を有効にすると、ポップアップが画面上に表示され続け、自動再生中であることをユーザーに知らせます。
自動再生中であることにユーザーが気づかず、単なる動作の異常だと思われかねない場合などに便利です。 自動再生だとわからなければ、コンピューターが遠隔操作されているように見えることすらあるかもしれません。
ポップアップの表示をやめるタイミングには、以下の選択肢があります。
- 自動再生の終了時：例えば、Smart Walk-Thruが最後のステップに達した場合や、通常のステップまたは別のポップアップが続く場合。
- 特定のフローステップの再生後：この選択肢を有効にするには、[Close after playing（再生後に閉じる）]のボックスにチェックを入れ、ドロップダウンリストから希望のフローステップを選択します。
💡ヒント：
- 最後のフローステップの後に別のポップアップを設定して、ユーザーにオートメーションプロセスが終わったことを知らせましょう。また、完了を示すメッセージが表示されるまで待つように、最初のポップアップで指示しましょう。
外観タブでポップアップをカスタマイズする
ポップアップにノートを追加する
Tip Tuesday動画
クリック可能なアクションアイテムを使ったポップアップを作成する方法
ポップアップでテーブルを構築する方法
ポップアップステップにCSS矢印を追加します。