ハンズオンの目的

本ハンズオンは、下記を目的として実施致します。

  • KARTEというプロダクトを知る
  • EventBridgeを介したAWSとKARTEの連携方法とその容易さを知る
  • AWSとKARTEの組み合わせで、カスタマーデータ活用の可能性が広がることを知る

ハンズオンで構築する基盤のアーキテクチャ

null
本ハンズオンでは、KARTEのカスタムイベントタグが設置されているWEBサイトを訪問したユーザーのデータをEventBridgeを経由してDynamoDB・S3に連携するシステムを構築します。 このシステムは大きく分けて3つのセクションに別れます。

  • KARTE
    • KARTEのカスタムイベントタグが設置されているWEBサイトを訪問したユーザーを解析し、EventBridgeへデータをリアルタイムで送信します。
  • DynamoDBインテグレーション
    • KARTEからEventBridge経由で連携されてきたデータを、Amazon SNS・AWS Lambdaを利用してテーブルに格納します。
  • S3インテグレーション
    • KARTEからEventBridge経由で連携されてきたデータを、Amazon Kinesis Data Firehoseを利用してJSON Lines形式でS3に保存します。

ハンズオンの流れ

本ハンズオンは下記のような流れに沿って実施致します。

  • 事前準備
  • KARTEの機能概要
  • EventBridgeプラグインのインストール
  • パートナーイベントソースの設定
  • QuickStartを利用したDynamoDBインテグレーションのデプロイ
  • QuickStartを利用したS3インテグレーションのデプロイ
  • カスタマイズ例:KARTEでバナーが表示されたユーザー情報をEventBridge経由で送信する(optional)
  • ハンズオン完了後のAWSリソースの削除
  • KARTEとEventBridgeを活用したアプリケーション実装例とユースケース

事前準備

利用するAWSアカウント

本ハンズオンは、全てのAWS上での作業を「米国東部 (バージニア北部)us-east-1リージョン」で実施します。他のリージョンで作業を行うとハンズオンがうまく行かない可能性がございますので、確認しながら進めてください。

本ハンズオンでは、参加者ご自身のAWSアカウントをご利用いただくことが可能です。ご自身のAWSアカウントにログインの上、以下の設定を進めてください。

KARTEアカウントの有効化

KARTEの利用を今回開始される方には、アカウント有効化のための招待メールが届いております。メールのリンクから、アカウントの有効化をお願い致します。

デモサイトの確認

KARTEの動作確認用のデモサイトが、KARTEプロジェクト毎に用意されています。デモサイトにはKARTEプロジェクトのタグが埋め込まれており、デモサイト上での行動データが蓄積され、接客を表示させることが可能です。
null
デモサイトのURLは、https://{文字列}.demo-karte.ioとなります。

デモサイトのURLがわからない方は、KARTEチャットサポートからお問い合わせください。

KARTEの機能概要

KARTEの機能の概要については、ハンズオン内で口頭でご説明致します。ご自身でKARTEへの理解を深めたい方は、下記のようなドキュメントをご参照ください。

  • KARTEとは
  • KARTE Academy
    • KARTEの利用方法を勉強できるコンテンツが多数ございます。KARTEアカウントを持っている方限定でアクセスできるページとなりますので、ご自身のKARTEアカウントを利用の上でアクセスしてください。

EventBridgeプラグインのインストール

グローバルメニューから、ストア>アプリストアアプリストアのリンクはこちら)を選択して、アプリストアにアクセスしてください。
null

一覧からAmazon EventBridgeアプリを選択してください。
null

画面中央にインストールボタンがありますので、押下してください。
null

パートナーイベントソースの設定

パートナーイベントソースの作成

Amazon EventBridgeアプリ設定画面に進み、パートナーイベントソースのタブを押下します。画面右上の追加ボタンを押下して、パートナーイベントソースの設定に進みます。
null
下記のガイドに従って、パートナーイベントソースの設定を入力して保存してください。これにより、Amazon EventBridge側に、パートナーイベントバスが作成されます。なお、DynamoDBインテグレーションのデプロイ・S3インテグレーションのデプロイのそれぞれで別々のパートナーイベントバスが必要になるため、2つのパートナーイベントソースを作成するようにしてください。
null

項目 入力内容
AWS Account ID ハンズオンで利用するAWS環境の AWS Account IDをハイフンなしの12桁の数字で入力してください。
名前 ハンズオンで作成するEventBridgeのイベントバスの名前に利用されるため、任意の名前を入力してください。作成する2つのパートナーイベントソースが区別できるように、-s3-dynamodbなどのsuffixを付与するようにしてください。利用できる文字は、半角英数字、.(ドット)、-(ハイフン)、_(アンダースコア) になります。
有効化 チェックボックスにチェックを入れてください。
Region 本ハンズオンでは、米国東部 (バージニア北部) / us-east-1をご選択ください。

パートナーイベントソースの確認

AWSにログインし、 Amazon EventBridgeのパートナーイベントソース画面 にアクセスし、前工程で入力した名前に従ってパートナーイベントソースが2つ作成されていることを確認してください。このaws.partner/karte.io/{AWSAccountID}/{KARTEProjectId}/{名前}のパスは、後ほど入力が必要になるため、メモしておいてください
null

データ連携用の接客・アクションの作成

接客・アクションの役割

KARTEからEventBridgeへデータを送信するために、「どのタイミング」で「どのデータ」を送信するか設定する必要があります。KARTEでは、この設定を「接客」「アクション」の2つの設定で実施します。今回のハンズオンでは、DynamoDB・S3と2つのサービスへの連携を行うため、2つの接客とアクション を作成致します。

以下に記載している接客・アクションの設定内容は、デモサイトの全てのページを訪問した際に、KARTEがユーザー情報を取得し、user_id等をEventBridge経由で各サービスに送信する設定 となります。お時間がある方は、EventBridgeへの配信タイミングや送信するデータの内容などを、下記を参考にカスタマイズしてみてください。

接客・アクションの作成

「接客・アクションの作成」はS3・DynamoDB連携のために2回実施する必要があります。ほぼ同一の作業を繰り返し実施することになるため、「接客サービス一覧」ページから対象の接客の「三点リーダ」を選択し、「複製」を押下して、接客をコピーすることを推奨します。また、作成・複製時は、混乱しないようにそれぞれのサービスに対応した名称設定をするように注意してください。

KARTE画面内のグローバルメニュー(画面左端のKARTEの顔のロゴの下にあるアイコン)から、アクション>接客サービスを押下して接客サービス画面に遷移し、接客サービス画面から作成ボタンを押下します。
null

任意の接客サービス名を入力し、アクションを追加ボタンを押下します。
null
検索ボックスにEventBridgeと入力し、「AmazonEventBridgeテンプレート」を選択します。
null
接客の設定画面にて、下記を参考に接客の設定を変更してください。
null

名前 設定内容
配信率 EventBridgeのアイコンがあるアクションを100%に変更
配信頻度 アクセス毎に変更
同時配信 OKに変更

アクションの編集ボタンを押下し、アクションの設定画面に遷移します。
null

編集画面にて、下記を参考にアクション設定を入力し、保存ボタンを押下します。
null

名前 入力内容
name DynamoDB連携の場合_write_to_dynamo_requestS3連携の場合 _write_to_s3_requestと入力してください
content 下記のjson形式のデータをコピーして入力してください。
パートナーイベントソース名 パートナーイベントソースの確認 でメモした、aws.partner/karte.io/{AWSAccountID}/{KARTEProjectId}/{名前}という形式のパートナーイベントソースのパスの中から、{名前} のみを入力してください。 また、DynamoDB・S3連携用にそれぞれ異なるパートナーイベントソースを作成しておりますので、正しい情報が入力されるように注意してください。
{
  "values": {
    "name": "KARTE",
    "user_id": "#{visitor_id}",
    "user_name" : "#{user_name}",
    "segments" : "#{segments}",
    "campaign_id" : "#{campaign_id}",
    "shorten_id" : "#{shorten_id}",
    "is_web" : "#{is_web}",
    "is_ios" : "#{is_ios}",
    "is_android" : "#{is_android}",
    "address"  : {
        "country" : "JP",
        "prefecture": "tokyo"
    }
  }
}

接客・アクションの公開

作成した接客は公開する必要があります。接客の設定画面にて、右上の公開ボタンを押下して、接客を公開してください。
null

QuickStartを利用したDynamoDBインテグレーションのデプロイ

デプロイ

AWS クイックスタートから PLAID KARTE DynamoDB を選択し、STEP3Deploy the Integrationのリンクを押下し、スタックの作成画面に遷移した後に、次へボタンを押下してください。

null

下記に従って入力し、次へボタンを押下してください。

名前 入力内容
EventSourceName パートナーイベントソースの確認 でメモした、aws.partner/karte.io/{AWSAccountID}/{KARTEProjectId}/{名前}という形式のDynamoDB用のパートナーイベントソースのパスを入力してください。
DyanamoDBTableName DynamoDBのテーブル名になるので、任意の値を入力してください。

「スタックオプションの設定」は全てデフォルトの入力値のまま変更せず次へボタンを押下し、「機能と変換」のチェックボックスにチェックを入れて、スタックの作成を押下してください。
null

リソースの作成には2~3分程度かかります。

CloudFormationのイベントタブから、リソースの作成が完了していることを確認してください。
null

DynamoDBにデータが送信されているか動作確認

デモサイト(ハンズオン冒頭で確認したhttps://{文字列}.demo-karte.ioがURLのページ)の任意のページにアクセスした後に、先程作成されたDynamoDBのテーブルにデータが作成されていることを確認します。

QuickStartを利用したS3インテグレーションのデプロイ

デプロイ

AWS クイックスタートからPLAID KARTE S3を選択し、STEP3Deploy the Integrationのリンクを押下し、スタックの作成画面に遷移した後に、次へボタンを押下してください。
null

下記に従って入力し、次へボタンを押下してください。
null

名前 入力内容
Event Source Name パートナーイベントソースの確認 でメモした、aws.partner/karte.io/{AWSAccountID}/{KARTEProjectId}/{名前}という形式のS3用のパートナーイベントソースのパスを入力してください。
S3 Bucket Name 作成されるS3バケットの名前になるため、任意の値を入力してください。
Kinesis Stream Name 作成されるKinesis Streamの名前になるため、任意の値を入力してください。

「スタックオプションの設定」は全てデフォルトの入力値のまま変更せず次へボタンを押下し、「機能と変換」のチェックボックスにチェックを入れて、スタックの作成を押下してください。
null

リソースの作成には2~3分程度かかります。

CloudFormationのイベントタブから、リソースの作成が完了していることを確認してください。
null

S3にデータが送信されているか動作確認

デモサイト(ハンズオン冒頭で確認したhttps://{文字列}.demo-karte.ioがURLのページ)の任意のページにアクセスした後に、先程作成されたS3のバケットにデータが作成されていることを確認します。
S3インテグレーションではAmazon Kinesis Data Firehoseの設定で、5分間バッファリングしてまとめてS3にデータを書き込むため、ページにアクセスしてから5分程度待機した後にデータが作成されているかご確認ください。

カスタマイズ例:KARTEでバナーが表示されたユーザー情報をEventBridge経由で送信する(optional)

ここまでで基本的なKARTEとEventBridgeの連携は完了しましたが、この章ではユーザーのページ訪問以外の条件でのEventBridgeへのデータ送信を実現する設定を実施します。今回は、KARTEの基本的な機能を利用してKARTEでバナーを表示させ、バナーでWEB接客を実施したユーザーのみを、EventBridgeに送信する設定 を試してみます。

KARTEからバナーを出す接客を設定

KARTE画面内のグローバルメニューから、アクション>接客サービスを押下して接客サービス画面に遷移し、接客サービス画面から作成ボタンを押下します。
null

任意の接客サービス名を入力し、アクションを追加ボタンを押下します。
null
ユーザーに「見せる」>バナー>クーポンの順番にクリックし、アクションを追加します。
null
接客の設定画面にて、下記を参考に設定を変更してください。作成した接客は公開する必要がありますので、設定後に右上の公開ボタンを押下して、接客を公開してください。
null

名前 設定内容
配信率 バナーのアクションを100%に変更
配信頻度 アクセス毎に変更
配信トリガー 閲覧イベントで設定>閲覧ページのURIアンカー>次に等しいを選択し、値を入力のテキストボックスにtestと入力します。
同時配信 OKに変更

バナーの動作確認

配信トリガーで条件としてURIアンカーを付与したデモサイトのURL、https://{文字列}.demo-karte.io#testにアクセスして、下記のようなクーポンが表示されることを確認してください。
null

バナーを表示したユーザーの情報を送信する設定に変更する

KARTE画面内のグローバルメニューから、アクション>接客サービスを押下して接客サービス画面に遷移し、 第9章もしくは第10章で設定したEventBridge用の接客 の三点リーダーを選択し、接客の編集を押下します。
null

配信トリガーから、条件を追加 > その他のイベントで設定 > 接客サービスを表示 > 接客サービス名 > 次に等しいを選択して適用を押し、値を入力と記載されているテキストボックスを選択して、先程作成したクーポンを表示する接客のドロップダウンリストから選択します。設定が終わったら、画面右上の保存ボタンを押下し、公開中のまま保存を押下します。
null

接客の動作確認

前述の設定の変更により、EventBridge連携の動作は下記のように変わりました。

  • Before(変更前)
    • デモサイトの任意のページを訪問した際に(viewイベント発生時)、EventBridgeにユーザーデータを送信する。
  • After(変更後)
    • デモサイト上でクーポン用のバナーが表示された際に(message_openイベント発生時)、EventBridgeにユーザーデータを送信する。
      このように連携の設定をカスタマイズすることで、自由自在にKARTEからEventBridgeへとデータを連携することができます。

ハンズオン終了後のAWSリソースの削除

ハンズオン終了後に不要になったAWSリソースは、CloudFormationのホーム画面 から一括削除することができます。CloudFormationのホーム画面からスタックを選択して、削除を実行してください。
null

S3バケットは、事前にバケットを空にする必要があります。CloudFormationで自動的に作成されたBucketを空にした上で、CloudFormationのスタックの削除を実行してください。

KARTEとEventBridgeを活用したアプリケーション実装例とユースケース

AWSとKARTEの組み合わせで作成できるアプリケーションの可能性は無限大です。以下に、AWS・KARTEの連携を前提としたアプリケーションの実装例とユースケースをご紹介致します。

例1:カスタマーデータ取得API構築

DynamoDBに格納されたカスタマーデータを、Lambda・API Gatewayを利用して取得できるAPIを作成します。

下記のようなユースケースが想定されます。

  • KARTE上で特定の行動をとったユーザーの一覧をDynamoDBのテーブルに格納。APIを作成することで、社内の他の業務システムでユーザーの一覧情報として活用する。

例2:S3のデータをAthenaで検索する

S3に格納されたカスタマーデータを、Amazon Athenaを利用して検索できるようにします。

下記のようなユースケースが想定されます。

  • S3をデータレイクとして、KARTEを利用して収集されるユーザーの行動データを収集。Athena等を利用して行動データの分析を実施する。

例3:KARTE Signalsを用いた広告出稿最適化

KARTE Signals は、KARTEによって収集される1st Party Dataを用いて、Facebookなどの各広告媒体とのデータの連携を実現します。このKARTE Signals とAWSの各種サービスで加工されたデータを組み合わせることで、広告出稿の最適化を実現できます。

例えば、下記のようなシステム構成が想定されます。この例では、KARTEや外部のシステムから収集したデータを元に、Amazon SageMakerを用いて機械学習モデルを作成します。機械学習モデルに基づいて作成されたデータをKARTE Datahubに送信し、広告出稿のシグナルとして利用します。
null

例4:KARTE Datahubのクエリ実行結果をEventBridgeを通じて連携(開発中)

KARTE Datahub に蓄積される様々なデータに対しSQLクエリを実行し、その結果をリアルタイムかつシームレスにAWSに送ることができます。

KARTE Datahub ではKARTEでリアルタイムに蓄積されるカスタマーデータに加え、AWS上に保存されているお客様の環境のデータも取り込むことができ、それらのデータに対し横断的にクエリを投げることができます。また、そのクエリ結果はAmazon EventBridgeを利用することで、AWSに簡単に送信することができ、さまざまなサービスでの活用が可能となります。

null

下記のようなユースケースが想定されます。

  • ECサイトで取り扱っている商品でどのようなカテゴリーの商品がよく見られていて購入されているかを集計し、その集計結果をお客様の管理画面で閲覧する
    • Amazon S3に商品に関する詳細情報を保存しておき、カスタマーデータの閲覧・購買イベントデータとジョインすることで集計が可能
    • お客様が管理画面を開いたタイミングでクエリ実行APIを実行し、その結果をAmazon EventBridgeを通してお客様のサーバーに送信する

リファレンス