リソースセンターは、アプリに追加できるカスタマイズ可能なメニューで、ガイドモジュール、お知らせモジュール、フィードバックモジュール、インテグレーションモジュールをオンデマンドで利用できます。サブスクリプション内のアプリには、それぞれ1つのリソースセンターを設定できます。
リソースセンターのセットアップと導入には、次の手順を行う必要があります。
- リソースセンターを作成します。
- リソースセンターにモジュールを追加します。
- リソースセンターとモジュールのスタイルを設定します。
- モジュールにセグメントを追加します。
- リソースセンターでモジュールを削除します。
- リソースセンターを有効化します。
- リソースセンターを公開します。
- リソースセンターを削除します。
注:リソースセンターは、従来のガイドセンターに代わるもので、ビジュアルデザインスタジオで作成したガイドを起動します。リソースセンターでは、従来型のアプリ内デザイナーで作成したガイドを使用できません。
カスタマイズオプション
リソースセンターは、アプリの上に配置されるバッジで起動するか、UIのターゲット要素で起動するかを選択できます。
また、リソースセンターは、適切なコンテンツを適切なユーザーに適切なタイミングで表示するように設定することができます。セグメントとページを使って、ユーザーに表示したいモジュールとガイドを制御できます。設定とカスタマイズのオプションにより、すべてのユーザーに対するリソースセンターの体験を構築することも、ターゲットとなるセグメントに対して微調整を行うこともできます。
サブスクリプション内のウェブアプリごとに、固有のリソースセンターを作成できます。
モジュールとそこに表示されるコンテンツは、訪問者IDと表示されているページに基づくコンテキストに依存します。空のモジュールや使用できないガイドがリソースセンターに表示されないようにするために、モジュールとガイドは、訪問者が次の場合のみリソースセンターに表示されます。
- そのモジュールのセグメント設定と一致する
- そのモジュール内のガイドのセグメントと一致し、かつ
- そのガイドを有効化できるページにいる
同じタイプのモジュールを複数追加して、類似のコンテンツをグループ化したり、ユーザーのセグメントをターゲットにしたコンテンツを作成したりすることができます。たとえば、次のようなことが可能です。
- あるお知らせモジュールを使用してプロダクトのリリースを告知し、別のお知らせモジュールを使用してマーケティングイベントを宣伝する。
- ペルソナごとに異なるオンボーディングチェックリストを作成する。
- メタデータに基づき、各モジュールをセグメント化して表示する。
- 複数のインテグレーションモジュールやサンドボックスモジュールを使用して、顧客の種類に合わせたサポートワークフローとサービスレベルを提示する。
前提条件
- リソースセンターを作成および編集するには、管理者ユーザーである必要があります。
- レイアウトから、または最初からガイドを作成できるPendoユーザーは、お知らせの作成やモジュールに追加されたガイドの編集ができます。
リソースセンターの作成
リソースセンターの作成にはいくつかのステップがありますが、開発者の関与やカスタムコードを必要とせずに設計したり展開したりできます。
1. 左側のナビゲーションで[ガイド(Guides)] >[リソースセンター(Resouce Center)]に移動します。
2.[+リソースセンターを作成(+ Create Resource Center)]を選択します。
3. リソースセンターにモジュールを追加します。
モジュールの追加
リソースセンターはモジュールで構成されており、リソースセンターを使用するにはモジュールを追加する必要があります。モジュールによって、リソースセンターでユーザーに提供するコンテンツを整理することができます。
- ガイドリストモジュール
- お知らせモジュール
- オンボーディングモジュール
- Feedbackモジュール
- コードサンドボックス:開発者はリソースセンターでリリースされたカスタムコードを使用して、特注のモジュールを作成できます。
- インテグレーション:ナレッジベースのコンテンツへのアクセス、サポートチケットの送信、ライブチャットによる対話など、サードパーティツールによる追加機能を提供します。
各モジュールは、リソースセンターを作成する際に、モジュールの追加ワークフローで追加できます。追加したいモジュールタイプにカーソルを合わせると、[モジュールの選択(Select Module)]ボタンが表示されます。
同じタイプのモジュールを複数回追加することができます。同じモジュールタイプの複数のバージョンを追加する場合は、このワークフローを繰り返してください。スタイルとセグメントを使い分けることで、個別のグループのコンテンツを配信したり、さまざまなユーザーグループにコンテンツをターゲット設定したりできます。
インテグレーションをモジュールオプションとして追加するには、[+ インテグレーションを追加(+ Add Integrations)]を選択し、インテグレーションハブに移動します。どのようなインテグレーションが利用できるかは、Pendoの[インテグレーション(Integrations)]セクションを参照してください。
モジュールリストには、選択したモジュールが表示されます。
選択したモジュールを削除するには、モジュールにカーソルを合わせ、[モジュール選択解除(Deselect Module)]を選択します。
モジュールを選択したら、右の[モジュールを追加(Add Modules)]を選択します。リソースセンターの詳細ページには、リソースセンターに追加されたすべてのモジュールが表示されます。
モジュールの追加先となるリソースセンターがすでにある場合:
1. 左側のナビゲーションで[ガイド(Guides)] >[リソースセンター(Resouce Center)]に移動します。
2. リストから、モジュールを追加するリソースセンターを選択します。
3. リソースセンターのホームプレビューにカーソルを合わせ、[+ モジュールを追加(+ Add Module)]を選択します。
4. 利用可能なモジュールのリストから選択します。
リソースセンターのスタイル設定
ビジュアルデザインスタジオ(Visual Design Studio)で、リソースセンターをブランドや命名規則に合わせてスタイルを設定することで、アプリにあらかじめ組み込まれている一部のように感じさせることができます。タイトルやサブタイトルのテキストを変更することができます。コンテナ、ヘッダー、モジュール、アラートバッジの色、サイズ、位置などをスタイル設定できます。
モジュールには、ビジュアルデザインスタジオでリソースセンターをスタイル設定するときにも使用できる独自のオプションがあります。
内部名
内部名は、リソースセンターのリストやリソースセンターが識別されるあらゆる場所に表示されます。内部名はアプリで公開されている名前ではありません。内部名を変更するには、[詳細(Details)]ページでリソースセンターの名前にカーソルを合わせ、リソースセンターの内部名を編集します。
リソースセンターのスタイル設定
ビジュアルデザインスタジオでリソースセンターのスタイルを管理します。
1. リソースセンターの詳細ページに移動し、[アプリで管理(Manage in my app)]を選択します。
2. アプリのURLを入力し、ビジュアルデザインスタジオを起動します。
3. ビジュアルデザインスタジオでリソースセンターを編集します。リソースセンターのプレビューには、変更されたリソースセンターが表示されます。ここでは、以下を編集できます。
- リソースセンターとモジュールのテキスト
- モジュールの表示順
- リソースセンターとモジュールのスタイル設定。
- リソースセンターバッジとアラートバッジのスタイル設定
- リソースセンターのアクティベーション方法
セグメントの追加
セグメントを使い分けることで、個別のグループのコンテンツを配信したり、さまざまなユーザーグループにコンテンツをターゲット設定したりできます。モジュールのセグメントを編集するには、次の操作を行います。
- リソースセンターの詳細ページでモジュールにカーソルを合わせ、[モジュール詳細を表示(View Module Details)]を選択します。
- [セグメント]セクションの右上にある[編集(Edit)]を選択します。
- ドロップダウンメニューからセグメントを選択するか、[+カスタムセグメント(+ Custom Segment)]を選択します。新しいセグメントを作成する場合は、セグメントの記事の手順に従ってください。
- 右上の[保存(Save)]を選択し、[セグメントを保存(Save Segment)]を選択します。
モジュールの削除
リソースセンターがドラフトモードのときに、モジュールを削除できます。
- [リソースセンター(Resource Center)]リストで、ドラフトモードになっているリソースセンターを選択します。
- [リソースセンターの設定(Resource Center Settings)]で、[モジュール詳細を表示(View Module Details)]を選択します。
- ページの右上にあるゴミ箱アイコンを選択して削除します。
- 表示されたウィンドウで、[モジュールを削除(Delete Module)]を選択して、この決定を確定します。
モジュールを削除したら、ドラフトをステージングまたは実稼働にプッシュして、実際のサイトで変更が有効になることを確認します。
リソースセンターの有効化
リソースセンターは、次の2つの方法で有効化できます。
- バッジアイコンを使用する。
- アプリケーション内の既存の要素を選択する。
バッジの有効化
リソースセンターを有効にするには、プレビューに表示されているバッジアイコンをクリックします。
有効化設定では、バッジのアイコン、色、Zインデックス、位置をカスタマイズできます。未読のお知らせアラートの配置を調整することもできます。
バッジアイコン
リソースセンターのバッジは、定められたサイズの円形に設定されています。ただし、ガイドバッジと同様に、独自のカスタムイメージをアップロードすることもできます。アップロードできる画像サイズは最大30MBに制限されています。画像はできるだけ小さくすることをお勧めします。画像が大きければ大きいほど、エンドユーザーの読み込み時間は遅くなるからです。画質を維持しながら画像をできるだけ小さくすることで、ユーザー体験向上につながります。
画像はバッジのサイズに合わせて自動的に拡大縮小されます。
バッジの色
デフォルトで、色はPendoピンクに設定されています。変更するには、色をクリックして表示されるパレットを使用します。色の16進数コードがわかっている場合は、コードを手動で入力することもできます。
注:色は、ドロップダウンに表示されるアイコン画像にのみ適用されます。カスタム画像の色を変更する場合は、画像をアップロードする前に色を変更してください。
Zインデックス
バッジのスタック順序、またはバッジをページ上の別の要素の前に表示するか後ろに表示するかを指定します。デフォルトでは、Zインデックスは非常に大きな値 (19000)に設定されているため、他のすべての要素の上に表示されます。仕様に応じて、この値を増減します。
アラートバッジの位置
アラートバッジは、訪問者のお知らせモジュールに未読のお知らせがある場合に表示されます。ドロップダウンメニューで、通知バブルをリソースセンターのバッジの任意の角に再配置できます。
バッジの位置
リソースセンターのバッジは、ドロップダウンメニューで画面の任意の隅または辺の中央に配置し、その後[オフセット(Offset)]でアンカーの位置から調整できます。デフォルトの位置は右下隅で、ウィンドウの下端と右端から10ピクセルのオフセットとなっています。
要素の有効化
アプリケーションの既存の要素をクリックして、リソースセンターを有効化することもできます。
リソースセンターのプレビュー
アプリ内のモジュールをプレビューするとビジュアルデザインスタジオ(Visual Design Studio)が開き、リソースセンターの外観を編集できます。上部のアクションバーには、リソースセンターのホームビューと、リソースセンターに追加したモジュールが表示されます。
ホームビューでは、以下の設定を編集できます。
- リソースセンターのタイトル
- トップバーの色
- 閉じるボタン
- モジュールの名前
アクションバーの各モジュールでは、以下のような追加のカスタマイズオプションも使用できます。
- プログレスアイコンと塗りつぶしの色
- プログレスバーと塗りつぶしの色
リソースセンターの公開
ホームページ - ステージング
この状態では、現在ステージングまたは本番環境にあるものがすべて含まれたプレビューが表示されます。ドラフトに変更を加え、ステージングに移行させる場合は、ドラフト表示で「ステージングへプッシュ(Push to Staging)」ボタンをクリックしてください。
ステージングに変更をプッシュすると、それに対応してプレビューが更新されます。
ホームページ - 本番
コンテンツを公開する本番環境に何もプッシュしていない場合は、本番コンテンツがないことを示すメッセージが表示されます。一方、以前にコンテンツを本番環境にプッシュしたことがある場合は、そのコンテンツのプレビューが表示されます。ステージングの更新を本番環境に移行する準備ができたら、ページ中央のボタンでステージングを移行できます。
警告:すでにガイドセンターを本番環境で使用しているお客様は、リソースセンターを本番環境にプッシュする前に、必ずガイドセンターを無効にしてください。ガイドセンターを無効にする方法については、下記の「よくある質問」をご確認ください。
リソースセンターの削除
リソースセンターは削除できません。ただし、すべての有効化方法を無効にすることで、リソースセンターをお客様に表示しないようにすることができます。
リソースセンターを無効にする方法:
- Pendo UIでリソースセンターに移動し、[アプリで管理(Manage in my app)]を起動してデザイナーを開きます。
- デザイナーで、アクティベーションタイルを選択し、すべての有効化方法をオフにして、[保存(Save)]を選択します。
- リソースセンターに戻り、変更をステージングにプッシュします。
複数のリソースセンター
サブスクリプションに複数のウェブアプリがある場合、それぞれのウェブアプリに固有のリソースセンターを設定できます。1つのリソースセンターを複数のアプリで共有することはできません。
リソースセンターに移動すると、作成したリソースセンターのリストが表示されます。すべてのウェブアプリにリソースセンターがある場合、[+ リソースセンターを作成(+ Create Resource Center)]ボタンは無効になります。
1. [+ リソースセンターを作成(+ Create Resource Center)]を選択して、リソースセンターがないウェブアプリにリソースセンターを追加します。
2. リソースセンターを追加するアプリを選択します。ドロップダウンにはウェブアプリのみが表示されます。
リソースセンターのローカライズ
リソースセンターにはガイドと同様のローカライズ機能があり、言語メタデータに基づいて自動的に翻訳を表示できます。Pendoでは、リソースセンターのXLIFFファイルをエクスポートし、そのファイルの内容を翻訳してリソースセンターにインポートできます。
リソースセンターでのローカライズの詳細とXLIFFファイルの翻訳手順については、ローカライズの記事を参照してください。
右から左へ記述する言語を使用するUIでのリソースセンターの作成については、右から左へ記述する言語に関するリソースセンターのサポートをご覧ください。
よくある質問
クラシックデザイナーで作成したガイドを選択できますか?
はい。エンドユーザーに提供するガイドを、リソースセンター内からどれでも選択できます。表示名を編集して、よりわかりやすいタイトルに変更することもできます。これにより内部の命名規則に影響を与えることはありません。
なぜ、このようにさまざまなステージがあるのでしょうか?
さまざまなステージがあることで、さまざまな状態での更新が可能になり、エンドユーザーに中途半端な更新を提供しないようにするためです。
コンテンツのないモジュールがある場合はどうなりますか?
コンテンツのないモジュールがあり、更新を本番環境にプッシュした場合、そのモジュールはエンドユーザーには表示されません。
「最新情報(What’s New)」ガイドはリソースセンターに含まれていますか?
最新情報(What’s New)ガイドは「お知らせ(Announcements)」に名称が変わりました。このモジュールは、オンボーディングモジュールやガイドリストモジュールと同様に、追加やセグメント化が可能です。詳細については、お知らせモジュールの記事を参照してください。
リソースセンターを有効にする前に、古いガイドセンターを無効にする必要がありますか?
はい。リソースセンターを本番環境にプッシュする前に、必ずガイドセンターを無効にしてください。新しいリソースセンターをプッシュしても、自動的にガイドセンターが無効になることはありません。ただし、リソースセンターを「ドラフト」または「ステージング」の状態で編集して、必要に応じて切り替えの準備をしておくことができます。
ポインターがハンドポインターではなくテキストカーソルを表示するのはなぜですか?
独自のCSSを使用している場合、PendoのCSSを上書きしている可能性があります。
本番ドメインからガイドセンターを無効にする方法は?
ガイドセンターを無効にするには、アプリ内のクラシックデザイナーに移動し、右上の[グローバル設定(Global Settings)]をクリックします。新しいメニューで[ガイドセンター(Guide Center)]をクリックし、以下の手順を実行してください。
- 表示されているすべてのセクションを無効にします
- 下部の「保存(Save)」をクリックします
- 「グローバル設定(Global Settings)」を再度開き、「本番環境にコピー(Copy to Production)」をクリックします
注:すべての本番ドメインでリソースセンターを有効にする場合にのみ、ガイドセンターを無効にする必要があります。ガイドセンターを無効にしなくても、必要に応じてリソースセンターをドラフトまたはステージング状態でカスタマイズおよびテストできます。