さまざまなイベントで製品を紹介する際、Cybozuブースにはたくさんのお客様がお立ち寄りくださいます。
そんな中、次のことが気になります。
- いったいどのくらいの人がブースに立ち寄ってくれているのだろう？
- 1時間に何人？スタッフの対応が忙しいのはいつごろ？
ブースに立ち寄ってくれた方の数をただカウントするだけではわかりません。
せっかくだから、データを残したい！分析したい！
そこで、MESHのボタンタグで数をカウントし、kintoneへデータ登録することで、簡単に集計やデータ分析ができるようなしくみを作ってみました。
MESHの詳細は
MESH
を確認してください。
MESHボタンを押したら、kintoneのアプリにレコードを登録します。
- ボタンを1回押す：カウントを +1する。
- ボタンを長押しする：カウントを -1する。
カウントのマイナスもできるので、間違って押したときも安心！
アプリのレコードには、人数カウント用のフィールドのほかにイベント名、日付、時刻フィールドを用意しておきます。
これで、「どのイベント」で「いつ」に「何人」きたのかがわかりますね。
このカスタマイズの運用イメージ
固定リンクがコピーされました
MESHボタンを押して、ブースに立ち寄ってくれた方の人数をカウント。
そしてkintoneに蓄積されたデータを利用して、簡単にさまざまな集計が可能になりました！
これらのサンプルは架空のデータです。
イベントの日ごとの来場者推移
イベントごとの来場者数
イベントの来場者割合
来場者数の集計表
kintone の設定
固定リンクがコピーされました
kintone アプリの作成
固定リンクがコピーされました
次のフィールドをフォームに設置します。
| フィールド名 |
フィールドタイプ |
フィールドコード |
初期値 |
| イベント名 |
文字列（1 行） |
EventName |
|
| 来場日 |
日付 |
CountDate |
レコード登録時の日付を初期値にする |
| 来場時間 |
時刻 |
CountTime |
レコード登録時の時刻を初期値にする |
| 人数カウント |
数値 |
Count |
|
APIトークンの生成
固定リンクがコピーされました
レコード追加権限のあるAPIトークンを生成します。
アプリIDとAPIトークンはMESHの設定で利用するのでメモしましょう。
アプリIDはURLから確認できます。
投稿したいアプリを開きます。
そのURLがhttps://sample.cybozu.com/k/674/の場合、「674」がアプリIDになります。
SDK のアカウント登録
固定リンクがコピーされました
MESH SDK
からアカウントを登録します。
SDK にインポート
固定リンクがコピーされました
SDKにログインし、「Create New Tag」をクリックします。
「Import」をクリックします。
次のcountUp.jsonを貼り付けて、「Load JSON」をクリックします。
countUp.json
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
|
{
"formatVersion": "1.0",
"tagData": {
"name": "来場者カウント",
"icon": "data:image/jpeg;base64,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",
"description": "kintoneの来場者カウントアプリにレコードを登録する",
"functions": [
{
"id": "function_0",
"name": "postToApp",
"connector": {
"inputs": [
{
"label": "Plus"
},
{
"label": "Minus"
}
],
"outputs": []
},
"properties": [
{
"name": "ドメイン名",
"referenceName": "domain",
"type": "string",
"defaultValue": "{subdomain}.cybozu.com"
},
{
"name": "アプリケーションID",
"referenceName": "appId",
"type": "number",
"defaultValue": "0"
},
{
"name": "APIトークン",
"referenceName": "apiToken",
"type": "string",
"defaultValue": "your api token"
},
{
"name": "イベント名",
"referenceName": "EventName",
"type": "string",
"defaultValue": "your event name"
}
],
"extension": {
"initialize": "",
"receive": "runtimeValues.receive = index;\nreturn {\n\tresultType : \"continue\",\n\truntimeValues : runtimeValues\n};",
"execute": "/*\n * MESH sample program\n * Copyright (c) 2017 Cybozu\n *\n * Licensed under the MIT License\n*/\nvar url = \"https://\" + properties.domain + \"/k/v1/record.json\";\nvar appId = properties.appId;\nvar apiToken = properties.apiToken;\nvar eventName = properties.EventName;\nvar receiveValue = runtimeValues.receive;\n\n// どのInput Connectorから受け取ったか\nif (receiveValue == 0 ) {\n\tvar cntValue = 1;\n} else {\n\tvar cntValue = -1;\n}\n\n// レコードに設定する値\nvar data = {\n\t\"app\": appId,\n\t\"record\": {\n\t\t\"EventName\": {\n\t\t\t\"value\": eventName\n\t\t},\n\t\t\"Count\": {\n\t\t\t\"value\": cntValue\n\t\t}\n\t}\n};\n\najax ({\n url : url,\n data : JSON.stringify(data),\n\ttype : \"POST\",\n contentType : \"application/json\",\n dataType : \"json\",\n timeout : 5000,\n\theaders: {\n\t\t\"X-Cybozu-API-Token\": apiToken\n\t},\n\tsuccess : function ( contents ) {\n log(\"success\");\n },\n error : function ( request, errorMessage ) {\n log(\"error\");\n\t\tlog(request.responseText);\n\t\tlog(errorMessage);\n }\n});\n\nreturn {\n resultType : \"pause\"\n};",
"result": ""
}
}
]
}
}
|
インポート後、kintoneの設定でメモした内容を参考に以下のPropertyのDefault Valueを書き換えます。
PropertyのDefault Value値は、レシピにタグを登録する際、初期値として設定されるものです。
Propertyの値は、MESHモバイルアプリのレシピ上でも変更できます。
本Tipsの場合、イベント名はイベントの都度変更する必要があるため、レシピ上で変更します。
この設定は、後述の
アプリケーションの設定で行います。
アプリケーションの設定
固定リンクがコピーされました
モバイルにMESHアプリをインストールして新しいレシピを作成し、MESHのタグと接続します。
SDKにログインします。
右下のカスタムの追加をタップし、先ほどインポートしたカスタムタグを追加します。
MESHのボタンタグ2つと追加したカスタムタグをドラッグ＆ドロップで配置し、以下のとおりコネクタで接続します。
レシピ上に配置したカスタムタグをタップして、イベント名を変更します。
イベント名は、kintoneに登録されるレコードの「イベント名」フィールドに設定する値です。
ここでは、
SDK でタグを作成したときのDefault Valueが初期設定として表示されています。
頻繁に設定を変える必要のある項目は、この画面で変更してください。
変更の少ない項目（ドメイン名やAPIトークン等）は、タグ作成時にDefault Valueで設定しておくと便利です。
レシピ上に配置したボタンタグをタップして、ボタンの押し方をそれぞれ設定します。
ボタンタグは、3つの押し方を検知できます。
- 1回押されたとき
- 長押しされたとき
- 2連続で押されたとき
今回は、以下のとおり設定します。
- コネクタ1つめ（Plus）に接続するボタン：1回押されたとき
- コネクタ2つめ（Minus）に接続するボタン：長押しされたとき
ボタンの押し方による処理の分岐について
固定リンクがコピーされました
今回はボタンのアクションによって処理を変える必要があるため、Input Connectorを2つ用意しました。
どの入力コネクタを利用した処理なのかは、Receiveメソッド内で参照可能です。
Receiveメソッドで参照した値を、メソッド間で共有できる変数（runtimeValues）に格納して利用しています。
詳細は
MESH SDK Reference Manual
を参考にしてください。
ぽちぽちとボタンを押していくだけで、来場者の人数データを登録できました。
kintoneならグラフ機能が充実しているので、データの確認や集計も簡単ですね♪
ぜひいろいろなグラフや表を作成して、データを活用してみてください！
