SmartTips

概要

スマートチップは、ユーザーがウェブサイトや製品を理解するのに役立つ高度なツールチップです。 例えば、以下の用途で使用できます。

• 分かりにくい領域に役立つヒントを追加する

• ユーザーを正しく検証する

スマートチップはエディタで作成されます。 個々のスマートチップは、同じフォームまたはページに表示されるスマートチップのグループである、セット内で作成されます。 スマートチップはスマートウォークスルーの代わりに、または追加して使用できます。

ユースケース

SmartTips には 2 つのタイプがあります :

• ガイダンス SmartTips ページ上の内容または入力フィールドに対して追加情報をユーザーに提示します。 例えば、名前フィールドにガイダンススマートチップを配置することで、ユーザーが姓および名の両方を入力する必要があることを明確にできます。 このフィールドのガイダンススマートチップはページに常に表示され、ユーザーがその上にマウスを移動すると「名および姓を入力してください」というメッセージが表示されます。
  
• 検証SmartTips フォーム送信前にフィールドに関するリアルタイムのフィードバックを提供します。 例えば、メールアドレスフィールドにスマートチップをすると、誤った入力がされた場合に表示され、間違いが修正されたときに画面から消えます。
  

使用方法

SmartTips はアイコン上または選択した要素上にツールチップを表示できます。 SmartTip が要素の上に表示されるように設定されている場合、ユーザーが選択したフィールド (ホバー、クリック、タブ) にフォーカスするとガイダンス SmartTip が表示されます。 ユーザーが選択したフィールドにフォーカス (クリックまたはタブアウト) した際にフィールドが正しくない (検証ルールが false と評価される) 場合は、検証 SmartTip が表示されます。

ガイダンスおよび検証の両方のスマートチップを使用するとガイダンスメッセージがアイコンの上に配置され、選択したエレメント上に検証メッセージが表示されます（上記の gif を参照）。

セット

セットとは、関連するスマートチップのグループです。 Walk-Thruステップと同様に、スマートチップはセット内のグループとして作成されます。 Walk-Thruから独立したステップが存在できないのと同じように、セットから独立したスマートチップは存在できません。 スマートチップを作成する最初のステップは、関連するスマートチップをグループ化するセットを作成することです。

セットの設定

セットを作成する際、最初にこのセットを実行する場所、特定のページか、複数のページかを決定するように求められます。

• 特定のページでのみ表示するには、ルールエンジンを使用してページを定義する必要があります（最も一般的に使用されるのはURLルールタイプです）。 特定のページを指定すると、パフォーマンスが最大化します。
  注

  設定された条件で画面上のエレメントを使用しないでください。 これらはページ読み込み時に評価され、スマートチップがSPAシステムに表示されない原因となります。 画面上のすべてのエレメント条件をスマートチップ表示ルールに配置します。

• 複数ページの表示の設定では、すべてのページでセットを実行するため、ルールを作成する必要はありません。

セグメンテーションの設定

スマートチップを表示する前に、WalkMeはセットのセグメンテーションルールを確認してルールが正しいかどうかを確認します。 実行されている場合、WalkMeはセット内のすべてのスマートチップを同時に実行します。

セグメントにセットを追加して、特定のオーディエンスをターゲットにします。 管理者とセールスの両方に適用されるフォームについては、両方のグローバルセグメントをスマートチップセットに適用します。

エディタからセグメントを追加できます。

Segmentation

メモ

右上にある「+メモを追加」アイコンをクリックして、メモを作成します。

メモは、エディタでチームメンバーと共同作業を行うために使用できますが、ユーザーには表示されません。

メモの使用例は、次のとおりです：

1. アイテムに後で実行するアクションのリマインダーを残す
2. 同僚向けにコメントを残す
3. 構築した内容とその理由を自分の言葉で説明する

ガイダンススマートチップとは何ですか？

ガイダンススマートチップは、ユーザーにメッセージのみを表示します。 カーソルをアイコンに合わせるとガイダンス SmartTip メッセージが表示されます。要素にメッセージが表示されるようになっている場合は、要素にカーソルを合わせるかフォーカス (クリックまたはタップ) することでメッセージが表示されます。 このメッセージはアンカー要素またはスマートチップのアイコンに表示される場合があります。

行動タブを使用してこれらの設定を設定したり、リッチテキストエディタにアクセスしてスマートチップのデザインをカスタマイズしたりできます。

ティップ・チューズデーの動画

確認SmartTipsとは

確認 SmartTips はユーザーがフィールドに有効なコンテンツを追加したことを確認します。 確認ルールと照合してフィールド入力を検証します。

確認ルールを使用することで、フィールドにおいて有効な入力とみなされるものを設定できます。 確認ルールによってfalse（フィールドへの誤った入力）と評価された場合、SmartTipは確認メッセージを表示します。

ユーザーがフィールドにフォーカス (クリックまたはタブアウト) すると確認ルールがチェックされます。 確認 SmartTip アイコンまたは要素のハイライトはユーザーがフィールドに正しく入力しない場合に表示され (確認ルールによって false と評価されます) 、ユーザーが誤りを修正することで表示されなくなります (確認ルールによって true と評価されます) 。

確認 SmartTip はルールが false の場合にのみ再生されます。つまり、選択した要素が有効な電話番号でない場合に確認が表示されることになります。

確認はスマートチップアイコンまたは選択したフィールドに表示されるように設定できます。 ユーザーがアイコンにカーソルを合わせるとメッセージが表示されます。

インタラクションタブから確認ルールとサクセスメッセージを設定できます。

以下のプリセット確認ルールから選択するか、新しいカスタムルールを作成します :

• 必須: ルールでは添付フィールドにテキストがあるかどうかを評価します。 空のままにしておくと、確認ルールでは false となります。
• 数値フィールド : 入力内容が数値であることを確認します。
• 日付形式 ：入力内容が有効な日付形式（dd/mm/yyyy など）であることを確認します。
  注

  日付選択を使用する場合、ユーザーは入力フィールドで操作してから、検証を行われるようフィールドの外をクリックして終了する必要があります。

• 時間形式 : 入力内容が14:00や2PMなどの有効な時間形式であることを確認します。
• 米国の電話番号: 入力内容が10桁の米国の電話番号 (市外局番と番号) であることを確認します。 このルールは数字が正しいかどうかを確認することはできず、正しい形式で書かれていることのみ確認します。
• Eメールアドレス形式 : 入力内容が有効なEメールの形式で @ 記号が含まれていることを確認します。ウェブアドレス形式 : 入力内容が有効なウェブアドレス形式であることを確認します。

プリセットのいずれかを選択して条件の更新をクリックした場合、これらのプリセットがルールエンジンに書き込まれる方法がわかります。 例えば、 米国の電話番号プリセットでは以下のルールが使用されます :

グローバル・カスタマイズ

グローバル・カスタマイズを使用することで、作成中の各 SmartTips をカスタマイズする必要なくすべての SmartTips の設計を変更することができます。 グローバル・カスタマイズを使用することで、すべての SmartTips の一貫したルック・アンド・フィールが維持されます。

ベストプラクティスはエラーツールチップに 1 つのスタイルを設定することで、プラットフォーム内の均一性を維持することです。 グローバル・カスタマイズは遡って適用されず、設計の保存後に作成された SmartTips にのみ影響します。

スマートチップオプションメニューでガイダンススマートチップのグローバルカラー、テキスト、アイコンのスタイルを上書きできます。 これは、ガイダンス SmartTips にはさまざまなユースケースがあり、常に同じスタイルが必要になる訳ではないためです。

公開

スマートチップを公開する準備ができたら、セットを選択し、[Publish（パブリッシュ）]をクリックします。

セット内のスマートチップを公開しない場合は、スマートチップの横にあるオプションメニューをクリックし、スマートチップを無効にするを選択して無効にできます。

同様に、個々のスマートチップはアーカイブできず、全体のスマートチップのみがアーカイブされます。 個々のスマートチップを廃止するには、オプションメニューから無効にしてください。

SmartTips が表示されない場合は？

セット内のスマートチップがいずれも表示されない場合：

1. セットのページ表示ルールを確認してください
2. セットのセグメンテーションルールを確認してください

個別のSmartTipsが表示されない場合：

1. スマートチップの表示ルールを確認してください。スマートチップが表示されるには、表示ルールとセグメンテーションの両方がtrueである必要があります。
2. エレメントを再キャプチャしてみてください。検証スマートチップが表示されない場合は、検証ルールを確認してください。 ルールでtrueであると評価されると、確認メッセージが表示されます。

スマートチップが依然として表示されない場合は、サポートまでお問い合わせください。

関連リソース

• セグメンテーションのヘルプについてはルールエンジンをご覧ください
• Walk-Thrus
• Launchers
• フォームの確認についてご覧ください
• 多言語機能についてご覧ください