オンボーディングモーダルを作成する

  • リリースバージョン: Xanadu
  • 更新日 2024年08月01日
  • 所要時間：6分

    • 独自のオンボーディングモーダルを作成して、ユーザーに新しいエクスペリエンスまたはアプリケーションを紹介します。

    始める前に

    必要なロール：admin

    手順

    1. 移動先 すべて > アダプションサービス > ガイダンスの作成.
    2. オンボーディングモーダルを作成するには、次の手順を実行します。
      1. フォームのフィールドに入力します。
        表 : 1. ガイダンスフォーム
        フィールド 説明
        順序 ガイダンスの表示順序。最も小さい番号が最初に表示され、次の時系列番号が続きます。
        名前 オンボーディングエクスペリエンスの名前。
        タイプ UI に表示されるガイダンスのタイプ。モーダルを選択します。
        ロール このガイダンスのロール。
        アプリケーション ガイダンスの申請。
        ステータス ガイダンスのステータス。
        アクティブ ガイダンスを有効または無効にする場合に選択します。
      2. [送信] を選択します。
    3. 作成したオンボーディングモーダルを起動するには、次の手順を実行します。
      1. UIB でクライアントスクリプトを作成します。
      2. コード スニペットの下に「 api.emit('SN_HELP#GUIDANCE_START_REQUESTED',{guidanceId:"ID"});
      3. ID を開くモーダルガイダンスのsys_idに置き換えます。
      4. ページを保存します。
      5. UIB ページの左パネルで [本文 ] を選択します。
      6. 右側のパネルで、[ イベント ]タブを選択します。
      7. [ディスパッチされたイベント (Dispatched Events)] で [追加] を選択します。
      8. イベント名に SN_HELP#GUIDANCE_START_REQUESTED を追加し、ラベルに名前を付けます。
      9. [保存] を選択します。
    4. 埋め込みヘルプガイダンスステップを作成するには、次の手順を実行します。
      1. [ガイダンス] リストからガイダンスを選択します。
        test2 が [ガイダンス] リストに表示されます。
      2. [ヘルプガイダンスステップ] 関連リストで、[ 新規] を選択します。
        test2 ヘルプガイダンスステップリストが表示されます。
      3. フォームのフィールドに入力します。
        表 : 2. [ヘルプガイダンスステップ] フォーム
        Field (フィールド) 説明
        名前 ガイダンスの名前。
        レイアウト ガイダンスの選択されたレイアウト。
        • ビデオ
        • イメージ
        • テキスト
        • 質問
        • 画像とテキスト
        • 画像と質問
        順序 ガイダンスの表示順序。最も小さい番号が最初に表示され、次の時系列番号が続きます。
        アクションラベル ユーザーがガイダンスモーダル内を移動できるようにするボタンラベル。
        アプリケーション ガイダンスのアプリケーションスコープ。このガイダンスは、グローバルスコープに適用されます。
        ガイダンス このヘルプガイダンスステップが適用されるガイダンス。
      4. [送信] を選択します。
    5. ヘルプガイダンスステップのヘルプコンテンツを作成するには、次の手順を実行します。
      1. 関連リストでヘルプガイダンスステップを選択します。
        test2 ヘルプガイダンスステップリストが表示されます。
      2. [ヘルプコンテンツ] 関連リストで、[ 新規] を選択します。
        [ヘルプコンテンツ] 関連リストが表示されます。
      3. 注:
        フォームフィールドは、ガイダンスのタイプごとに異なります。ガイダンスについては、正しいフォームを参照してください。
        テキストフォームのフィールドに入力します。
        表 : 3. [ヘルプコンテンツテキスト] フォーム
        Field (フィールド) 説明
        タイトル ヘルプコンテンツのタイトル。
        サブタイトル UI のヘルプコンテンツのモーダルに表示されるサブタイトル。
        タイプ 選択されているガイダンスのタイプ。
        アプリケーション ガイダンスのアプリケーションスコープ。
        ガイダンスステップ ヘルプガイダンス このヘルプコンテンツが関連付けられているステップ。たとえば、「イントロ/ようこそ」、「すべてのメニュー」、「履歴」などです。
        デフォルト ガイダンスステップのデフォルトのヘルプコンテンツ。
        フッター UI のヘルプコンテンツのモーダルに表示されるフッター。
        カスタム HTML を提供 ヘルプコンテンツのカスタム HTML です。
        テキスト UI のヘルプコンテンツのモーダルに表示されるテキスト。
      4. [送信] をクリックします。
      5. ビデオフォームのフィールドに入力します。
        表 : 4. ヘルプコンテンツビデオフォーム
        Field (フィールド) 説明
        タイトル ヘルプコンテンツのタイトル。
        サブタイトル UI のヘルプコンテンツのモーダルに表示されるサブタイトル。
        タイプ 選択されているガイダンスのタイプ。
        ビデオリンク 表示するビデオのリンク。
        注:
        YouTube と Vimeo のみがサポートされています。
        アプリケーション ガイダンスのアプリケーションスコープ。
        ガイダンスステップ ヘルプガイダンス このヘルプコンテンツが関連付けられているステップ。たとえば、「イントロ/ようこそ」、「すべてのメニュー」、「履歴」などです。
        デフォルト ガイダンスステップのデフォルトのヘルプコンテンツ。
        フッター UI のヘルプコンテンツのモーダルに表示されるフッター。
        カスタム HTML を提供 ヘルプコンテンツのカスタム HTML です。
        代替テキスト UI のヘルプコンテンツのモーダルに表示される代替テキスト。
      6. [送信] をクリックします。
      7. 画像フォームのフィールドに入力します。
        表 : 5. ヘルプコンテンツ画像フォーム
        Field (フィールド) 説明
        タイトル ヘルプコンテンツのタイトル。
        サブタイトル UI のヘルプコンテンツのモーダルに表示されるサブタイトル。
        タイプ 選択されているガイダンスのタイプ。
        イメージ ガイダンスに表示するように選択された画像。
        アプリケーション ガイダンスのアプリケーションスコープ。
        ガイダンスステップ ヘルプガイダンス このヘルプコンテンツが関連付けられているステップ。たとえば、「イントロ/ようこそ」、「すべてのメニュー」、「履歴」などです。
        デフォルト ガイダンスステップのデフォルトのヘルプコンテンツ。
        フッター UI のヘルプコンテンツのモーダルに表示されるフッター。
        カスタム HTML を提供 ヘルプコンテンツのカスタム HTML です。
        画像リンクを提供 画像リンクがガイダンスに表示されます。
        代替テキスト UI のヘルプコンテンツのモーダルに表示される代替テキスト。
      8. [送信] をクリックします。
      9. 質問フォームのフィールドに入力します。
        表 : 6. ヘルプコンテンツの質問フォーム
        Field (フィールド) 説明
        タイトル ヘルプコンテンツのタイトル。
        サブタイトル UI のヘルプコンテンツのモーダルに表示されるサブタイトル。
        タイプ 選択されているガイダンスのタイプ。
        アプリケーション ガイダンスのアプリケーションスコープ。
        ガイダンスステップ ヘルプガイダンス このヘルプコンテンツが関連付けられているステップ。たとえば、「イントロ/ようこそ」、「すべてのメニュー」、「履歴」などです。
        デフォルト ガイダンスステップのデフォルトのヘルプコンテンツ。
        フッター UI のヘルプコンテンツのモーダルに表示されるフッター。
        カスタム HTML を提供 ヘルプコンテンツのカスタム HTML です。
      10. [送信] を選択します。
      11. [ヘルプの質問] 関連フィールドで [新規 ] を選択します。
        表 : 7. ヘルプの質問フォーム
        Field (フィールド) 説明
        質問 ガイダンスに追加する質問の内容。
        順序 ガイダンス内の質問の順序。
        バリアント 質問のバリアント。
        • ラジオは、回答が 1 つしかない質問に対して選択されます。
        • 複数の解答がある質問では、チェックボックスがオンになっています。
        アプリケーション ガイダンスのアプリケーションスコープ。
        ヘルプコンテンツ 質問が作成されるヘルプコンテンツ。
        必須 選択されている場合、質問は必須です。
      12. [ヘルプの回答] 関連フィールドで [新規 ] を選択して回答を作成します。
        表 : 8. ヘルプ回答フォーム
        Field (フィールド) 説明
        ラベル 回答のラベル。
        値 回答の値。
        順序 回答の順序。
        アプリケーション ガイダンスのアプリケーションスコープ。
        質問 回答が作成される質問。
      13. [送信] を選択します。
    6. オンボーディングエクスペリエンスを構築するための追加のガイダンスを作成します。
    7. オンボーディングガイダンスの作成が完了したら、[ガイダンス] フォームでガイダンスのステータスが [ 公開済み ] に設定されていることを確認します。
    8. ガイダンスフォームで、 更新 を選択します。