【Shopify Flow活用】抽選アプリ不使用！LINEのID連携時に抽選を行い、LINEで結果を通知する方法

本ブログでは、LINEのID連携を促進するための施策として「あいさつメッセージでの訴求」や「LINEのID連携ユーザー限定シークレットセール」など、様々な施策事例とその実施方法を解説してきました。

今回は遊び心も入れつつ、「Shopify Flowを使って抽選・宝くじ施策を行い、LINEで結果を通知する方法」について解説します。

本記事で紹介する工夫をすれば、抽選用のShopifyアプリを使わずとも、Shopify Flowの標準機能だけで抽選の処理を実装できます。

年末年始のプローモーションとしてもオススメですので、少々長編の記事ではありますがぜひ参考にしてみてください！

抽選・宝くじ施策の要件
アクションの概要と制限
使用するアプリ
ワークフロー1（当選者をカウントするための設定）の全体図
ワークフロー2（ID連携時の抽選・ポイント付与・メッセージ配信など）の全体図
ワークフローのファイル
1. インポート・修正箇所
その他の活用アイデア
まとめ

抽選・宝くじ施策の要件

本記事では、以下の要件で抽選の仕組みを構築していきます。

ユーザーがLINEのID連携を行ったタイミングで抽選を実施
抽選で当選した場合、ID連携時に付与しているポイントを2倍にする
抽選結果はLINE公式アカウントで通知
当選確率は3分の1に設定
当選者の上限数は100人

アクションの概要と制限

抽選機能の実装には、Shopify Flowの「Run code」アクションを使用します。

「Run code」アクションとは、Shopify Flow内でJavaScriptを実行する機能で、2024年1月31日に公開された機能です。
Shopify flow – New Run code action – Shopify Changelog

JavaScriptやGraphQLのコードを書くアクションですので、普段Shopify Flowを活用している方でもなかなか使う機会がないアクションかもしれませんが、複雑な条件分岐や計算などを実現できます。

ただし、使用するうえで、下記などいくつか制限もあります。

ランダムな機能（乱数を発生させる）は使用できない
クロックベースの機能（現在日付を使った計算など）は使用できない

詳しくは、公式のヘルプセンターをご確認ください。
Shopifyヘルプセンター｜Run code

使用するアプリ

ワークフローの自動化：「Shopify Flow」

「Shopify Flow」は、ワークフローの自動化ができる無料のShopifyアプリです。Shopify内の会員登録・購入・発送などのイベントやShopifyアプリ側のイベントをトリガー(発動条件)にして、タグ付与・削除やメタフィールドへのデータ追加などのShopify上のアクションや、Shopifyアプリ側でのアクションをノーコードで実現できます。

▷アプリストアはこちら

ポイントの付与：「VIP ‑ 会員プログラム」

VIPはShopifyでオンラインストアを運用しているマーチャントに、会員プログラムを構築する仕組みを提供しているアプリです。VIPを使うことで、ブランドごとのポイントプログラムや会員ランクプログラムを実現できます。

▷アプリストアはこちら

※本記事ではVIPを参考に紹介していますが、Flowでポイント付与関連のコネクターを提供しているアプリであれば、他のアプリでも代用可能です。

LINE連携・メッセージ配信：「CRM PLUS on LINE」

LINEのID連携を軸に、LINEを活用した顧客コミュニケーションの最適化を実現するShopifyアプリです。顧客・購買データを基にしたセグメント配信やLINE公式アカウント上での顧客対応、リッチメニューの出し分け、購入・発送完了通知等、多様なLINE活用を行えます。

▷アプリストアはこちら

ワークフロー1（当選者をカウントするための設定）の全体図

まずは1つ目のワークフローです。

Shop のメタフィールドに当選者をカウントするための定義を追加し、初期値として0を設定していきます。

手順1：トリガーの設定

Schedule time トリガーで、指定した時間にワークフローが動くようにします。

開始時間は、必ず現在時刻より「後」になるように指定してください。

手順２：アクションの設定（メタフィールドの定義を作成）

Create metafield difinitionのアクションで、メタフィールドの定義を作成します。

今回は、Shopのメタフィールドに、lottery.total_winnersというカラムを作成します。下記それぞれの項目を入力していきます。

手順3：アクションの設定（メタフィールドの値を更新）

Update shop metafieldのアクションを設定して、初期値（0）を入力します。

1つめのワークフローはここまでです。

ワークフローをオンにして、指定時間に実行しておきましょう。

ワークフロー2（ID連携時の抽選・ポイント付与・メッセージ配信など）の全体図

2つ目のワークフローです。

このワークフローで、ID連携時に抽選を行った後、ポイントの付与やメッセージの配信などを行います。

以下、各手順を詳しく解説していきます。

手順1：トリガーの設定

LINEのID連携をトリガーとして設定するため、「Add – 顧客にソーシャルログインの連携が追加されました」を選択してください。

手順2：条件の設定（すでに当選している方の除外）

すでに当選している人（lottery-winner のタグが付与されている人）を除外するために、Customer > tags を確認します。

次のアクションには、Otherwise（条件に一致しない場合のアクション設定）で接続してください。

手順3：条件の設定（当選上限数の確認）

次に、当選人数を確認するための条件設定です。

Shop > metafieldを選択して、ワークフロー1で作成したメタフィールドを引数として設定します。

「引数の値が100以下である」という条件を設定し、条件を満たす場合は抽選を行うというフローに進みます。

※今回は当選者数の上限を100人に設定しているため、100を入力しています。当選者数の上限数を変更する場合は、こちらの値を変更してください。

手順4：Run codeの設定

これからGraphQLとJavaScriptのコードについて詳しく解説していきます。
※もしコードの内容で分からない点がありましたら、お気軽にお問い合わせください。

最初に、アクションから「Run code」を選択します。

「Run code」アクションをクリックすると、以下のような画面が表示されます。

それぞれの項目は以下のように設定してください。

入力を定義する

ここでは、JavaScriptの処理で使用する値を定義していきます。

デフォルトでは「ストア名(shop.name)」を取得する以下のコードが設定されていますが、どの値を使用するかによって入力値を変えてください。

query{
  shop{
    name
  }
}

抽選に「顧客ID(customer.id)」の一部を使用しますので、以下のコードを入力してください。

query{
  customer{
    id
  }
}

出力を定義する

処理されたデータを「どのような形式で出力するか」を設定する箇所です。対応している出力形式は以下のとおりです。

String（文字列）
Int（小数点を含まない数値）
Float（小数点を含む数値）
Boolean（true / false の真偽値）
ID（一意の値を表すデータ型）

今回は、当選であれば true 、落選であれば false を出力してほしいので、Booleanを使用します。

type Output {
  message: Boolean!
}

コードを書く

JavaScriptのコードを書いて、処理を行っていきます。

本記事冒頭で紹介した要件（抽選・宝くじ施策の要件）を満たすために、JavaScriptで以下の処理を行います。

inputからShopifyの顧客IDを取得
(1)の値（顧客ID）の下2桁を取得
(2)の値（顧客IDの下2桁）が、33以下であれば当選として true を出力、そうでなければ false を出力
※今回は3分の1（約33%）を当選確率として設定するため、 33 を基準にしています。当選確率を調整する場合は、10行目の数値33を変えてください。

実際のコードは以下です。

export default function main(input) {
    // 顧客ID取得
    const customerId = input.customer.id;
  　console.log(input.customer.id);
	  // 顧客IDの下2桁を抽選番号として取得
    const lotteryNumber = parseInt(customerId.slice(-2), 10);
    console.log(lotteryNumber);

    // 下2桁が33以下であれば当選（true）、それ以外は落選（false）
    const isWinner = lotteryNumber <= 33;

    // 結果を返す（ブール値）
    return {
        message: isWinner
    };
}