スマートウォークスルー

デザインのオプション

バルーンのデザインを変更するには 2 つの方法があります。

1. 1 つめはデザイン・ギャラリーから既製のデザインを選択することです。
2. 2 つめは CSS を使用してバルーンのデザインを完全に制御することです。

インタラクションタブの右上にあるデザインの変更をクリックするとことでデザイン・ギャラリーが開きます。 デザイン・ギャラリーでは特定のバルーンのデザインを選択できます。 また、Walk-Thru の設定ページからグローバル・レベルで設定することもできます。

HTML / CSS カスタマイズ・コンソールを使用することで高度なテンプレートを編集すると共に独自のテンプレートを作成します。

WYSIWYG Editor :

What-you-see-is-what-you-get Editor (WYSIWYG) を使用することでバルーンの外観およびコンテンツを簡単に変更すると共に結果を即座に確認できます。

WYSIWYG Editor のツール :

• フォントサイズ
• 太字
• 斜体
• 下線
• フォントの色
• テキストの配置
• リンクの追加 : URL ハイパーリンクを追加します
• 箇条書きリストの追加 : バルーンのテキスト内のアイテムのリストに箇条書きポイントを追加します
• スマートウォークスルーのリンクを追加：別のスマートウォークスルーを起動するリンクを作成します
  • このリンクは現在のスマートウォークスルーを停止すると共にリンクされたものを起動します。 スマートウォークスルーにリンクするには、リンク先のスマートウォークスルーが既に作成されていると共にウォークスルーIDが必要になります。
• 画像を追加 :
  • 新しい画像を追加するにはコンピューターから画像をアップロードするか、その URL を挿入します (この場合、画像を挿入する前にオンラインでホストする必要があります) 。
  • サポートしているファイルの種類には JPG、JPEG、PNG、GIF が含まれます。
  • ファイルサイズは最大で500KBです。
  • アップロードされた画像は Amazon S3 の専用バケットでホストされます。
  • URL からの画像の幅および高さは元の画像の縦横比を維持しながら、バルーンまたはシャウトアウトのサイズに自動的に調整されます。
  • 必要に応じて編集する画像をダブルクリックすることで画像の幅と高さを調整できます。
  • リサイズしてもアスペクト比が変わらないように、[Lock Aspect Ratio（アスペクト比のロック）]を使ってアスペクト比を固定できます。
  • 画像を削除するには画像 URL の横にあるごみ箱アイコンをクリックするか、テキスト・エディターでテキストを編集中に Backspace または Delete を使用して削除します。
  • BBCode 形式 : [img]img_URL[/img]、
  • 幅および高さのある BBCode 形式 : [img=widthxheight]img_URL[/] (例 : [img=40×24]img_URL [/img]。
  • 
    
• ビデオの追加 : 対応するビデオプラットフォームにビデオURLを入力します
  • ビデオはiFrameを使用するMP4形式である限り、どのプラットフォームからでも再生できます（下の表のBBCodeを参照） 。 必要に応じて幅と高さを入力してください
• iFrame を追加 : フレームにウェブページをロードします
• ダイナミック・テキストの追加 : ユーザーの実際の名前などのダイナミック・テキストをバルーンに追加します
• BBCode : BBcode を使用してテキストをフォーマットします。 以下の例をご覧ください :
  

  機能	BBCode
  テキストを中央に配置します	[div style=”text-align:center”]テキスト[/div]
  取り消し線	[s]text[/s]
  テーブル	[table]{rows}[/table]
  テーブル行	[tr]{cells}[/tr]
  テーブル・コンテンツ・セル	見出しセル： [th]{content}[/th]
  コンテンツ・セル	[td]{content}[/td]
  電子メールへのリンク	[url=mailto:[email protected] .com][email protected][/url]

• プレビューバルーンから以下のものを編集することができます :
  • タイトル : ユーザーに対するメインの指示を編集します
  • テキスト : 必要に応じて追加の指示またはステップの詳細を含みます

位置 :

選択した要素に関連するステップ・バルーンが表示される場所を変更します (外観タブの位置をさらにカスタマイズします) 。 ピクセルの配置を上下および左右に変更することで位置をさらに変更します。



テキストに揃える

この機能を有効にすると、エレメント内のテキストが両端に揃っていない場合でも、スマートウォークスルーのバルーンがエレメント内のテキストの中心を指します。

有効になっていない（デフォルト）場合、バルーンは選択したエレメントの中心に揃います。



テキストに揃えるが有効になっている場合、バルーンはエレメント内のテキストの中心に配置されます。



ステップ・トリガー :

スマートウォークスルーを次のステップに進めるアクションを決定します。 トリガーはガイダンスを前進させることでインタラクティブにします。

• クリック : ユーザーが要素をクリックすることで次のステップが再生されます
• 次へ : ユーザーがバルーンの[次へ]ボタンをクリックすると次のステップが再生されます
  • ヒント : 他のトリガーは PC のキーボードで Ctrl (または Mac キーボードでは Command) を押して 2 番目のトリガーを選択することで [次へ] と組み合わせることができます
• 入力 : ユーザーが選択したテキスト・フィールドにテキストを入力することで次のステップが再生されます
• カーソル : ユーザーが要素の上にカーソルを合わせることで次のステップが再生されます
• 遅延 : 設定された秒数の後に次のステップが自動的に再生されます
• 更新 : ページの更新時に次のステップが再生されます
• カスタム・トリガー : 次のステップに移動するタイミングを WalkMe に伝えるルールを作成します
  • ヒント : このトリガー・タイプを使用することでステップをトリガーできる要素を画面に追加できます。
• ドロップダウン・メニュー・トリガー : 次のトリガーはドロップダウン・メニュー要素が選択されている場合にのみオプションとして表示されます。
  • 任意の選択 : ドロップダウン・メニューの項目が選択されると次のステップが再生されます
  • 特定の選択 : 特定のドロップダウン項目が選択されると次のステップが再生されます

スマートウォークスルーをPDFとしてエクスポートする

鳥瞰図からスマートウォークスルーのフローを表示またはスマートウォークスルーの構築手法について従業員をトレーニングしたい場合はスマートウォークスルーのステップリストをPDFとしてエクスポートすることができます。

ステップ・リストをエクスポートするには以下の手順を実行します :

1. スマートウォークスルーまたはウォークスルーアイテムのメニューアイコンにカーソルを合わせます。
2. ファイルにエクスポートを選択します :
   
   
   
3. 複数の言語でビルドする場合はエクスポートする言語を選択するよう求められます :
   
   • エクスポートをクリックすると、 PDF のコンパイルの完了を示す進行状況バーが表示されます
4. コンパイルが完了すると、ファイルをマシンのどこに保存するかを選択するよう求められます
   • マシン上の場所を選択すると共にその場所にファイルをダウンロードします

注 : ファイルにエクスポートを機能させるには、全般タブのスクリーンショットのキャプチャ設定をオンにする必要があります。

ファイルの構造

ファイルの各ページには、ステップがキャプチャーされたアプリのページのスクリーンショット上にスマートウォークスルーのステップが表示されます。 各ステップは選択した要素の隣に位置しています。

ページ構造の追加機能には以下のものがあります :

1. ステップの時系列による番号
2. ステップのラベル
3. ステップの作成日時
4. スクリーンショットがキャプチャーされた URL の場所