ビジュアルデザインスタジオのガイドボタンアクション

最終更新日:

ビジュアルデザインスタジオ(Visual Design Studio)でガイドを作成する際に、コントロールやナビゲーションなどさまざまなアクションを起こすボタンを追加できます。この記事では、利用可能なボタンアクションについて説明します。

ビルディングブロックでのボタンの追加

ボタンは、ビジュアルデザインスタジオのガイドステップで[ボタン(Button)]または[マルチボタン(Multi Button)]のビルディングブロックで追加します。

ButtonBlocks.png

注:マルチボタンはモバイルガイド専用です。

ボタンアクションの編集

[ボタンを編集(Edit Button)]メニューは、新しいボタンが追加されるか、ガイドステップのボタンにカーソルを合わせるとすぐに開きます。メニューでは、ボタンのスタイル、ボタンのテキストを設定し、ボタンのアクションを定義できます。

ActionEditButton.png

ボタンの[アクション]は、[コンテナを編集(Edit Container)]メニューの[動作(Behavior)]タブでも使用できます。ここでは、コンテナ内のすべてのボタンのアクションが表示されます。

ButtonEditContainer.png

プライマリアクションを選択した後、URLを開く、別のガイドを開く、特定のステップに移動する、ガイドをスヌーズする時間を追加するなど、複合ボタンアクションを追加できます。詳しくは、後述の複合ボタンアクションを参照してください。

ボタンのアクションを編集するには、以下の手順を実行します。

  1. ボタンの上にカーソルを合わせ、編集アイコンを選択します。

    ButtonEditButtonButton.png
  2. [アクション(Actions)]ドロップダウンメニューから、ボタンで開始する動作を選択します。

使用可能なアクションのリストについては、ボタンアクションを参照してください。

ボタンアクション

このセクションでは、ビジュアルデザインスタジオでガイドを作成する際に使用できるボタンアクションの詳細について説明します。

次のステップ

ActionNext.png

[次のステップ(Next Step)]は、デフォルトのボタンアクションです。このアクションは、マルチステップガイドの次のステップに進みます。このアクションはUIとは連動せず、次のステップは同じページに表示されます。必要に応じて対象のCSS要素を利用できるようにしなければ、ユーザーには次のガイドステップは表示されません。

使用可能な複合ボタンアクションは[URLリンク(URL Link)」のみです。

注:次のステップがない場合は、デフォルトでガイドが閉じます。

ガイドを閉じる

ActionDismiss.png

[ガイドを閉じる(Dismiss Guide)]はガイドを閉じ、これ以上このガイドのアナリティクスを行わないことを示します。

使用可能な複合ボタンアクションは[URLリンク(URL Link)」のみです。

すべての投票を送信+ガイドを進める

ActionSubmitPoll.png

[すべての投票を送信 + ガイドを進める(Submit All Polls + Advance Guide)]は、投票のビルディングブロックがガイドステップにある場合にのみ使用できます。このアクションは、すべての投票の回答をガイドのアナリティクスに送信し、ガイドを次のステップに進めます。次のステップがない場合は、ガイドを終了します。

使用可能な複合ボタンアクションは[URLリンク(URL Link)」のみです。

URLリンク

ActionURL.png

[URLリンク(URL Link)]は、テキストのリンクを選択するのと同じです。ブラウザはターゲットURLに移動します。ユーザーが新しいブラウザタブでターゲットURLを開くかどうかを指定します。

使用可能な複合ボタンアクションは、[次のステップ]、[ガイドを閉じる]、[すべての投票を送信+ガイドを進める]、[前のステップ(Previous Step)]、[ガイドのスヌーズ(Snooze Guide)]、[ステップに移動(Go To Step)]です。

注:以下のボタンアクションには、Pendoエージェントのバージョン2.62以降またはモバイルSDK 2.3.3以降が必要です。

ガイドの起動

[ガイドを起動(Launch Guide)]は、現在のガイドを閉じて、対象のガイドを起動します。起動するガイドには、現在表示されているガイドステップと同じページと対象のセグメントが必要です。それらがない場合、ガイドは起動されず、ボタンを選択するとユーザー体験が停止します。

このアクションでは、ドロップダウンリストからガイドを選択するよう求められます。ドロップダウンリストには、ドラフト(Draft)、ステージング(Staged)、公開(Public)の各ガイドが表示されます。ガイドは、現在のページではアクティベーション順に、それ以外のガイドではアルファベット順に並べ替えられます。無効化されたガイドとリソースセンター(個々のモジュールを含む)は、[ガイドを起動]ボタンアクションのオプションではありません。

ActionLaunch.png

起動したガイドは、本番環境のユーザーが見ることができるように[公開(Public)]に設定する必要があります。[ステージングのガイド(Staged Guide)]は、ステージング環境でのみ見ることができます。

ActionLaunchSelect.png

利用可能な複合ボタンアクションはありません。

[ガイドを起動]ボタンのステップを指定する

[ガイドを起動]を使用するときに、どのステップを起動するかを指定できます。これにより、ガイド作成者はエンドユーザーをどのように導くかをより詳細に制御できるようになり、またガイドを複製する必要がなくなります。

specify_starting_step.png

パーマリンクを使用してステップを指定する

ガイドの一部をすでに閲覧したユーザーのために、パーマリンクを使用して特定のステップでガイドを再起動できます。たとえば、あるユーザーがガイドのステップ1とステップ2を閲覧済みの場合は、ガイド全体をもう一度見せる代わりに、ステップ3などの特定のステップに移動するためのパーマリンクを手動で追加します。

  1. ガイドの[設定(Settings)]ページで右上の省略記号ボタンを選択し、[パーマリンク(Permalinks)]を選択します。

    select_permalinks.png
  2. 必要なステップのリンクをコピーし、特定のステップのURLに追加します。

    permalinks.png

パーマリンクの詳細については、ガイドのパーマリンクを作成するを参照してください。

前のステップ

ActionPrevious.png

[前のステップ(Previous Step)]は、マルチステップガイドの前のステップに戻ります。

注:ステップ1を削除したり、[前のステップ]アクションを持つステップをステップ1に移動したりすると、ボタンを更新するように通知するエラーメッセージが表示されます。

 ButtonAlert.png

使用可能な複合ボタンアクションは[URLリンク(URL Link)」のみです。

ガイドのスヌーズ

ActionSnooze.png

[ガイドをスヌーズ(Snooze Guide)]は、ガイドを閉じ、設定した期間が経過した後で再度アクティブにします。スヌーズ期間は、ウェブアプリの場合は分/時間/日単位で、モバイルアプリの場合は時間/日単位で設定できます。スヌーズは、自動アクティベーションのガイドに最も適しています。

スヌーズされたガイドは、引き続きガイドスロットリングの設定に従います。スヌーズされたガイドは、ガイドスロットリングのガイドビューとしてカウントされ、ガイドスロットリングの設定で許可されているスヌーズ期間が経過すると、再びアクティブになります。スヌーズされたガイドは、対象の要素、バッジ、またはリソースセンターから手動で起動することができます。ガイドを手動で表示すると、そのガイドの保留中のスヌーズアクションがキャンセルされます。

ボタン1つに対して設定できるスヌーズ期間は1つのみです。訪問者にスヌーズ期間を選択してもらう場合は、期間の異なる複数のボタンを追加します。[閉じる(Close)]ボタンのボタンアクションとしてスヌーズを追加することはできません。また、NPSアンケート調査で使用することもできません。

使用可能な複合ボタンアクションは[URLリンク(URL Link)」のみです。

ステップに移動

ActionGoStep.png

[ステップに移動(Go to Step)]は、ガイドを同じガイド内の指定されたガイドステップに進めます。すぐ次のステップである必要はなく、現在のステップの前後の任意のステップを使用できます。ガイドのアナリティクスでは、訪問者が[ステップに移動]を使用して直後以外のガイドステップを表示したことを示します。

ActionStep3.png

[ステップに移動]にはクリエイティブな使用例が多くあり、複数のフローを含む単一のガイドを作成できます。この場合のガイドは単一の始点から起動しますが、始点には各フローを開始するステップにユーザーを誘導するボタンが複数あります。

1つのガイドに複数のワークフローが含まれる例は、以下のとおりです。

  • フロー1は、ガイドステップ2~4です。
  • フロー2は、ガイドステップ5から始まります。
  • ステップ1にあるボタンを押すと、ユーザーはステップ5に直接進み、ステップ2~4をスキップしてフロー2を開始できます。
  • また、ボタンを押すことでユーザーをステップ1に戻してガイドを再開したり、ワークフローを先に進めたりすることができます。

また、複数のボタンを使用して、ユーザーの選択に応じて適切なガイドステップに条件付きで誘導できます。たとえば、「弊社のプロダクトに満足していますか?」という質問に「はい」と「いいえ」ボタンを使用し、ユーザーを適切な投票とアンケート調査またはコンテンツに誘導します。

対象のステップは、対象の要素が存在するページと同じページになければ適切に表示されません。このアクションは、要素のクリックやホバーとは併用できず、投票調査のビルディングブロックの回答やイベントプロパティに基づく条件付きのものではありません。

使用可能な複合ボタンアクションは[URLリンク(URL Link)」のみです。

複合ボタンアクション

ボタンは、選択すると最大2つのアクションを実行できます。これは、サイトのナビゲーションや、ガイドを操作しながら外部リソースを開くのに便利です。

最初のアクションの下にある[+ アクション(+ Action)]を選択して、複合アクションを追加します。ボタンアクションは、特定の組み合わせのみ可能です。たとえば、ボタンを使用して[ガイドを閉じる(Dismiss Guide)]を選択した場合、利用できる唯一の追加アクションは、URLリンクへのユーザーの誘導です

button-add-action.gif

この記事は役に立ちましたか?
18人中7人がこの記事が役に立ったと言っています