ポップアップステップ：はじめに

更新日 2月 10, 2021 Download as PDF

概要

ポップアップステップは特定のエレメントに添付されていない浮動式のバルーンステップです。 ポップアップステップは任意のページエレメントにメッセージを添付せずに、ユーザーに対して一般的な情報やガイダンスを提供するために使用することができます。

ポップアップは注目すべきテキストにユーザーの関心を引くために使用されます。 通常のステップバルーンとは異なり、ポップアップは要素に添付されずにページの中央に表示されます。 ポップアップはSmart Walk-Thru内のどこにでも配置できます。

ポップアップは一般的に、サイトやユーザーが完了するプロセスについてのメッセージを伝えることでユーザーエクスペリエンスを強化するために使用されます。 ポップアップはプロモーションのために使用することもできます。

ユースケース

ポップアップの一般的な使用例には以下のようなものがあります。

• プロセスの終わりにサクセスポップアップを使用する
• サイトにアクセスしたときに、Smart Walk-Thru の AutoPlay の初めにウェルカムポップアップが出るように配置する
• リッチテキスト・エディターを使用してミニメニューのポップアップを作成し、他の Smart Walk-Thru へのリンクを追加する

使用方法

ポップアップは最初に Smart Walk-Thruで構築しても、後から追加してもかまいません。 ポップアップは画面の中央に表示され、任意のエレメントには添付されません。 ポップアップはメインパスや Smart Walk-Thru のブランチのどこでも使用できます。

ポップアップステップの作成

1. Smart WalkThruで、ポップアップステップを追加したい 2 つのステップの間にあるオレンジ色のプラス記号にカーソルを合わせます。
   
2. ホバーメニューでポップアップを選択します。
   
3. インタラクションタブでは、バルーンセクションは通常のバルーンステップと同じように動作します。 任意のタイトルと本文を入力し、テキストツールを使用して調整することができます。
   
   グリッドではポップアップステップが画面上に表示される場所を指定することができます。 スポットライトを有効にし、オーバーレイを無効にすることができます。 これにより、ポップアップの表示中もユーザーがサイトとインタラクションを継続できるようにします。
   
   スポットライトを無効にすると、ステップトリガーを使用してポップアップステップにカスタムトリガーを追加することができます。
   
4. ポップアップステップは WalkThru の概要にあるポップアップアイコンで表示されます。

ポップアップのインタラクション (オプション)

ポップアップを作成すると、ポップアップステップのオプションメニューが開きます。 インタラクションタブで以下の設定を行います。

• ［テキストを追加する］をクリックします。タイトルフィールドのポップアップ部分にメインメッセージを追加し、下のフィールドにテキストを追加します。
• デザインの変更：デザインギャラリーを使用してバルーンにテンプレート外観を適用します。
• リッチテキストエディターと CSS： リッチテキストエディターにアクセスして、テキストのサイズ、スタイル、色の変更、ダイナミックテキストの追加、または画像の挿入を行います。 CSS にアクセスしてカスタム変更を行います。
• バルーンに X を表示する：バルーンから X を削除しないよう推奨されます。
• スポットライト：スポットライトがオンになっている場合、ページ上の他のエレメントとインタラクションを行うことはできません。
• ボタンを表示する：
  • 次へ/完了：次へはポップアップの後のステップがある場合、完了はそのステップが最後である場合。
  • スタートボタン：Walk-Thru の最初のステップである場合。
  • 戻る：前のステップに戻ります。
    • [戻る] ボタンは前のステップに次へのトリガーがある場合にのみ表示されます。
  • キャンセル：Walk-Thru を終了します。

外観タブでポップアップをカスタマイズする

ポップアップにメモを追加する

ノートの使用についての詳細はこちらをご覧ください