Mobile Web向けWalkMe

Last Updated 10月 23, 2026

概要

Mobile Web向けWalkMeは、SafariやChromeなど、あらゆるモバイルブラウザでユーザーにガイダンスを提供します。 ユーザーの多くがリモートまたはフィールドで作業している場合、Mobile Webでは、実際に使用するデバイス上でサポートできます。

モバイルウェブコンテンツは、デスクトップ向けと同様に、専用モバイルウェブシステムで構築します。 この記事では、Mobile Webシステムの追加方法、WalkMeが表示するコンテンツを決定する方法、小さな画面の構築とテスト方法について説明します。

アクセス

コンソールでシステムにアクセスするには:

  1. WalkMeコンソールを開きます
  2. 管理者カテゴリに移動します
  3. 「システム管理」を選択します
  4. システムを選択します

ユースケース

  • フィールドユーザーまたはリモートユーザーを誘導し、電話機で完了するプロセスを完了できます。
  • デスクトップとモバイルの間でレイアウトが変更されるページ用に、別のスマートウォークスルーを作成します。
  • 電話とタブレットユーザーの画面サイズに応じてコンテンツを表示します。

Mobile Webシステムを追加する

モバイルウェブを既存のウェブシステムに追加できます。

  1. システムにカーソルを合わせます
  2. オプションメニューを開きます
  3. [Mobile Webの追加]を選択します
  4. [Mobile Webの追加]を選択して確認します

プラットフォーム列にMobile Webタグが表示されるようになりました

新しいシステムを作成する方法については、以下の記事を参照してください。

Creating a System

使用方法

ウェブで利用可能なすべてのアプリは、Mobile Webでも利用可能であり、同じ方法で構築できます。 モバイルウェブシステム内のアイテムは、ウェブおよびデスクトップのアイテムとは別個のものであるため、各環境はそのアイテムに対応して設計されたコンテンツを取得できます。ウェブ上で利用可能なすべてのアプリは、モバイルウェブでも利用可能であり、同じ方法で構築できます。 Mobile Webシステムのアイテムは、ウェブおよびデスクトップのアイテムとは別個のものであるため、各環境はそのために設計されたコンテンツを取得します。

スニペット

Mobile Webは、デスクトップと同じスニペットを使用します。 サイトに標準スニペットを使用するか、セルフホストのセットアップが必要です。 WalkMe拡張機能を使用する場合は、カスタマーサクセスマネージャーまたはWalkMeの担当者にお問い合わせください。

注

モバイル向けWalkMeメニューはWalkMe拡張機能を使用するため、ユーザーはスニペットなしでメニューのモバイルブラウザでShuttleを使用してWalkMeコンテンツを開くことができます。

デバイスの検出

コンテンツを表示する前に、WalkMeはデバイスタイプを確認し、次に画面の解像度を確認します。

  • モバイルデバイスでは、WalkMeはモバイルエミュレーターで構築されたアイテムのみを表示します
  • デスクトップブラウザーでは、WalkMeは600x800px未満の画面用に構築されたアイテムを非表示にします。この解像度をカスタマイズできます。

エディターで構築します

モバイルウェブ向けに構築するには、エディターのシステムボタンからMobile Webプラットフォームに切り替えます。

次に、開発ツールでブラウザをモバイル表示に設定します。 これにより、モバイルユーザーが目にする方法でコンテンツを録画し、プレビューできます。

モバイルエミュレータ

モバイルエミュレーターでは、特定のデバイスを選択し、その画面解像度でサイトをプレビューできます。 モバイルレイアウトはデスクトップとは異なる場合が多いため、デスクトップのアイテムを再利用するのではなく、モバイル専用にアイテムを構築してください。

デスクトップとの違い

スマートウォークスルー、ランチャー、リソース、オンボーディングタスク、シャトルは、セグメンテーションや目標を含め、デスクトップ上と同じように機能します。 一部のデザインは、小さな画面に合わせて自動的に調整されます。

  • WalkMeメニューが小さく表示されます
  • バルーンは、画面の解像度に応じてスケールします
  • シャウトアウトは、モバイルテンプレートを使用します

モバイルエミュレーターでは、スマートウォークスルーステップでは、クリックとマウスオーバーの代わりに、タップとスワイプのトリガーを使用します。

セグメンテーション

変数、jQuery、クッキーのルールなど、すべてのルールタイプがMobile Web上で機能します。 2は特に便利です。

  • 画面サイズ:デスクトップの最小サイズまたはモバイルの最大サイズを設定します
  • ブラウザサイズ:レスポンシブなサイトを処理します

ポートレートモードで電話機で動作するスマートウォークスルーは、ランドスケープモードのタブレット上で機能しない場合があります。 その場合、スマートウォークスルーを複製し、異なるステップのみを更新し、各バージョンを構築対象のデバイスにセグメント化します。

セグメンテーションの詳細については、以下の記事を参照してください。

Segmentation

ベストプラクティス

  • エディターですべてのアイテムをプレビューし、レイアウトを注意深く確認してください。
  • テスト環境に公開し、ユーザーが最もよく使用するデバイスでテストします。
  • モバイルエミュレーターで既存のスマートウォークスルーを再作成し、デスクトップとモバイルでサイトがどのように異なるかを確認します。
  • チームとユーザーに尋ねてください。モバイル上で完了するプロセスはどれか。これらのプロセスはデスクトップとは異なる場合が多いためです。

技術的なノート

  • Mobile Webは、Proメニューとカリフォルニア州ウィジェットをサポートしています
  • WalkMeエディタのローカルCSSは、モバイルウェブではサポートされていません
  • 本番環境に公開すると、モバイルウェブデータはインサイトのデスクトップウェブデータとマージされます。

この記事は役に立ちましたか?

ご意見ありがとうございます!

Be part of something bigger.

Engage with peers, ask questions, share ideas

Ask the Community
×
×