開発者向けインストールガイド(Pendo Flutter SDK)

注:この記事はiOSでの設定を参照します。

Pendoはプロダクトの使用データやユーザーからのフィードバックを取得し、アプリ内でユーザーとコミュニケーションをとりながら、ユーザーにオンボーディングを促したり、ユーザーを教育したり、価値あるものに導いたりすることができます。Pendoのタグ付けとガイドは完全にコードレスで、エンジニアリングリソースは不要です。ただし、SDKのインストールとアプリにおけるPendoの初期化にはエンジニアの力が必要です。Pendoと一般的なインストールプロセスに関する情報は、導入計画文書(Installation Planning article)に掲載されています。準備をすれば、Pendo SDKの技術的なインストールは簡単です。

Pendoを最初にインストールする際の技術的な部分はSDKだけです。SDKが正しくインストールされれば、誰でもPendoを使うことができます。SDKは、訪問者のアプリ内での行動を追跡し、ガイドを読み込み、セッションのメタデータをキャプチャします。トラックイベントなど、モバイル向けのPendoの使用を最適化および拡張するために、後から追加の開発を行うことができます。最新のPendoの機能を使用するには、新しいバージョンがリリースされた際に、モバイルアプリのSDKもアップデートする必要があります。

Pendoは、他の一般的なCRM、分析、およびコラボレーションツールとのインテグレーションを行っています。インテグレーションの範囲は、コードレスのインストールウィザードによるネイティブインテグレーションから、カスタム開発まで多岐にわたりますが、この記事では説明しません。一般的なインテグレーションについては、インテグレーションに関する記事をご覧ください。また、SDKのインストールが完了した後のサブスクリプションのインテグレーションについては、Pendoの担当者にお問い合わせください。

 

利用可能なインサイト

このソリューションを使用するFlutterアプリでは、次のようなアナリティクスが可能です。

  • トラックイベントアナリティクス([トラックイベント(Track Events)]ページでは、ユーザーやアカウントの分析、使用量の合計、時間経過による使用量を確認できます)
  • パスとファネル(トラックイベント経由)
  • データエクスプローラー、トレンド(トラックイベント経由)
  • 定着率の分析(トラックイベント経由)
  • 訪問者とアカウントの分析
  • アプリケーションの滞在時間(トラックイベントに基づく)
  • ページ閲覧数/ボタンのクリック数に関連しないダッシュボードウィジェット
  • ガイドまたは分析を目的とした、作成した任意のセグメントでのトラックイベントアナリティクスの使用

要件

Pendo FlutterプラグインSDKのインストール

アプリケーションフォルダーで次のコマンドを実行します。

flutter pub add pendo_sdk

 

インストール手順

  1. [設定(Settings)]>[サブスクリプション設定(Subscription Settings)]>[他のアプリを追加(Add Another App)]を選択し、Flutterのアプリタイプを選択します。

     

    Select_flutter.png

    注:Pendoでは、2種類のアプリケーション(iOS用およびAndroid用)が[サブスクリプション設定]ページに作成されます。

    Flutter.png

  2. iOSアプリにカーソルを合わせ、[インストールに進む(Continue to installation)]を選択します。

Pendoの設定と初期化

SDKの初期化には、SDKのインポートと、訪問者が識別されたときのSDKの初期化という2つの要素があります。Pendo SDKは、アプリケーションがonCreateされる時にインポートされます。初期化コールは、現在の訪問者を識別してセッションを開始するすべてのアクティビティで発生する可能性があります。

ユーザーを識別し、データ収集を開始し、ガイドのコンテンツを表示するには、Pendoを初期化する必要があります。SDKは、訪問者が認証され、メタデータが既知であるか、匿名の訪問者である場合に初期化できます。初期化は、アプリケーションの起動時、後で訪問者が識別されたとき、または現在の訪問者を識別して新しいセッションを開始する必要があるときに実行できます

識別された訪問者は、定義されたスキーマを使用して、Pendoのメタデータに関連付けられた訪問者オブジェクトとアカウントオブジェクトを作成します。このデータがPendoでどのように定義され、使用されているかについては、訪問者とアカウントのメタデータに関する記事を参照してください。nullまたは""visitorIdとして渡すと、匿名の訪問者IDが生成されます。

  • visitorId - 一意のユーザーIDを含む文字列(例:「user-SFGH-56gh」)。このIDは、他のPendoウェブアプリまたはモバイルアプリの訪問者IDと一致する必要があります
  • accountId - 一意のアカウントID、訪問者の特定の企業またはグループへの所属(例:Acme Inc)を含む文字列。このIDは、他のPendoウェブアプリまたはモバイルアプリの訪問者IDと一致する必要があります
  • visitorData - 訪問者のメタデータ(例:Eメール、電話、国など)
  • accountData - アカウントのメタデータ(例:種別、レベル、ARRなど)

1. アプリケーションのAppDelegateファイルに次のコードを追加します。

import Pendo

関数(application、openURL、options)を追加または修正します。

func application(_ app: UIApplication, open url: URL, options: [UIApplication.OpenURLOptionsKey : Any] = [:]) -> Bool {

        if url.scheme?.range(of: "pendo") != nil {

            PendoManager.shared().initWith(url)

            return true

        }

        return true

    }

Pendo SDKインテグレーション

アプリケーションのmain file (lib/main.dart)に以下のコードを追加します。

import 'package:pendo_sdk/pendo_sdk.dart';

Pendoトラックイベントを設定して、アナリティクスをキャプチャし、Pendoにアナリティクスイベントを通知します。initStateメソッドに次のコードを追加します。

dynamic initParams = {
    'visitorId': 'John Smith',
    'accountId': 'Acme inc.',
    'visitorData': {
        'age': 25,
        'country': 'USA'
    },
    'accountData': {
        'Tier': 1,
        'Size': 'Enterprise'
    }
};

var pendoKey = '[PENDO_KEY]';
PendoFlutterPlugin.initSDK(pendoKey,
        initParams); // initParams is optional.

 

トラックイベント

イベントを追跡するアプリケーションファイルに、以下のコードを追加します。

import 'package:pendo_sdk/pendo_sdk.dart';
PendoFlutterPlugin.trackEventWithProperties('name', { 'firstProperty': 'firstPropertyValue', 'secondProperty': 'secondPropertyValue'});

ステップ3:テスト用のモバイルデバイス接続の設定

次のステップに従い、テストのためにモバイルデバイスの接続を有効化します。

  1. [情報(Info)]>[URLのタイプ(URL Types)]で、[+]ボタンをクリックして新規URLを作成します
  2. [識別子(Identifier)]「pendo-pairing」または任意の名前に設定します
  3. [URLスキーム(URL Scheme)]pendo-[PENDO_SCHEME]に設定します
  4. アプリケーションのAppDelegateファイルに次のコードを追加します
    #import "PendoManager.h";
  5. 関数application:openURL:options:を追加または修正します。
    - (BOOL)application:(UIApplication *)app
                openURL:(NSURL *)url
                options:(NSDictionary<UIApplicationOpenURLOptionsKey,id> *)options
    {
        if ([[url scheme] containsString:@"pendo"]) {
            [[PendoManager sharedManager] initWithUrl:url];
            return YES;
        }
        //  your code here ...
        return YES;
    }

ステップ4:インストールの検証

    • Xcodeを使用したテスト:
      Xcodeにアタッチしてアプリを起動します。
      デバイスログを確認し、次のメッセージを探します。
      Pendo Mobile SDK was successfully integrated and connected to the server. (PendoモバイルSDKのインテグレーションは正常に終了し、サーバーに接続されました。)
    • Pendo UIを使ったテスト:
      [サブスクリプション設定]に、[統合済み(Integrated)]と示されたアプリが表示されていることを確認します。