アイデアを形にできるIoTブロックMESHと、HTMLハイブリッドモバイルアプリ制作ができるMonacaを繋ぐブリッジ機能Me-Moを開発しました。サイバー・フィジカルモバイルアプリを作ることができるようになり、より創造の幅を広げることができました。

1. サイバー・フィジカルモバイルアプリ
構築環境 Me-Mo の開発
東京工科大学 メディア学部 メディア学科
本間圭祐 岡崎博樹 上林憲行
IoT開発環境（MESH）とHTMLハイブリット
アプリ開発環境（Monaca）を繋いだ
2018/3/15情報処理学会第80回全国大会
早稲田大学 西早稲田キャンパス

2. サイバー・フィジカルモバイルアプリ
構築環境 Me-Mo の開発
東京工科大学 メディア学部 メディア学科
本間圭祐 岡崎博樹 上林憲行
IoT開発環境（MESH）とHTMLハイブリット
アプリ開発環境（Monaca）を繋いだ
2018/3/15情報処理学会第80回全国大会
早稲田大学 西早稲田キャンパスもくじ
1. はじめに
2. 研究目的
3. Me-Mo デザイン
• 設計方針
• MESH, Monacaの
メリット
4. 開発
• システム構成
• 実現方法
5. 制作した連携アプリ例
• 実演
6. おわりに
謝辞
参考文献

3. • アイデアを形にできる IoT ブロック
• HTMLハイブリッドアプリ開発環境
を組み合わせた
サイバー・フィジカルモバイルアプリを作る
ブリッジ機能 Me-Mo の開発を行った。
1. はじめに
サイバー・フィジカル
サイバー空間とフィジカル空間が
相互につながっていること
2

4. • アイデアを形にできる IoT ブロック
• HTMLハイブリッドアプリ開発環境
を組み合わせた
サイバー・フィジカルモバイルアプリを作る
ブリッジ機能 Me-Mo の開発を行った。
1. はじめに
2. 研究目的
3

5. とは何か
• センサーやボタンを備えた７つのIoTブロック
• ビジュアルプログラミング環境
• サイバー・フィジカル
4
ハードウェアタグ
• ボタン タグ
• LED タグ
• 動き タグ
• 明るさ タグ
• 人感 タグ
• 温度湿度タグ
• GPIO タグ
ソフトウェアタグ
• カメラ タグ
• マイク タグ
• スピーカー タグ
• 通知 タグ
• ミュージックタグ
• IFTTT タグ
• Gmail タグ
• 自作ソフトウェア
タグ(SDK)

6. とは何か
• HTMLハイブリッドアプリ専用開発環境
• IOS, Android等にビルドすることができる
5

7. 6

8. 3. Me-Mo デザイン

9. 特徴
サイバー・フィジカルモバイルアプリの実現
Me-Moの主な特徴
8

10. それぞれの得意なこと・苦手なこと
9
MESH Monaca
得意
• サイバー・フィジカル
• 電子工作
• ハイブリッドアプリ制作
苦手
• 画面出力
• GPSなど、端末の機能を
使った作品制作
• サイバー・フィジカル

11. それぞれの得意なこと・苦手なこと
10
MESH Monaca
得意
• サイバー・フィジカル
• 電子工作
• ハイブリッドアプリ制作
苦手
• 画面出力
• GPSなど、端末の機能を
使った作品制作
• サイバー・フィジカル
l 画面出力
l GPS
Monacaモバイルアプリの
機能を用いた表現が可能に
l MESHレシピ
l IoTセンサー
• サイバー・フィジカル
MESHの機能を活用できる
それぞれの得意なことを取り入れたアプリを作ることができる

12. 設計方針および特徴
物理的な距離の影響を受けない
MESH, Monacaの独立性保持
1
2
設計する上で気をつけたこと
11

13. 設計方針
物理的な距離の影響を受けない
MESH, Monacaの独立性保持
1
2
設計する上で気をつけたこと
12

14. 接続方法
で接続
MESHタグ
MESHレシピ
1
13

15. 接続方法
で接続
MESHタグ
MESHレシピ
?
Monacaアプリ
1
14

16. 接続方法
で接続
MESHタグ
MESHレシピ
Monacaアプリ
1
15

17. 接続方法
で接続
MESHタグ
MESHレシピ
Monacaアプリ
遠隔にあると接続できない
1
16

18. 接続方法
で接続
MESHタグ
MESHレシピ
Monacaアプリ
インターネット
1
17

19. 接続方法
で接続
MESHタグ
MESHレシピ
Monacaアプリ
インターネット
1
18

20. 接続方法
で接続
MESHタグ
MESHレシピ
Monacaアプリ
インターネット
物理的な距離の制約を受けない設計
• リアルタイム性も重視
1
19

21. 設計方針
物理的な距離の影響を受けない
MESH, Monacaの独立性保持
1
2
設計する上で気をつけたこと
20

22. Me-Moの対象
MESHタグ
MESHで
制作した作品
MESHの各タグ
作成したMESH
レシピ全体
21
独立性を考えるにあたり、
MESHを基軸とする場合と
Monacaを基軸とする場合を
分けて考える

23. MESHタグ
MESHで
制作した作品
MESHの各タグ
作成したMESH
レシピ全体
Monacaを基軸とした場合のMe-Moを対象とする
基軸
22

24. ❷独立性について
MESHレシピを制作 Monacaアプリを制作
Aさん Bさん
「君のと自分のを組み合わせ
たらいいものが作れそう！」
お互いが作ったものを組み合わせる
相手に合わせて作り変える
• プログラムを相手に合わせて
作り変える必要がある
• 連携した後も相手の設計に依存
23

25. ❷独立性について
Monacaアプリを制作
Aさん Bさん
「君のと自分のを組み合わせ
たらいいものが作れそう！」
お互いが作ったものを組み合わせる
相手に合わせて作り変える 独立性を保持して連携する
• プログラムを相手に合わせて
作り変える必要がある
• 連携した後も相手の設計に依存
• 相手の設計を意識する必要はない
• 決められたインタフェースに
従うだけで連携できる
• 連携した後も拡張しやすい
24
MESHレシピを制作

26. ❷ 3つの選択肢
• データ連携
• お互いのデータを共有して使用する
• APIコール
• MESH, MonacaのAPIをそれぞれが呼び出して使用する
• 両者のAPIは公開されていないが、実現の可能性はある
• イベント連携
• それぞれのイベントを仲介する
• イベントドリブン方式の連携
26

27. ❷ 3つの選択肢
• データ連携
• お互いのデータを共有して使用する
• APIコール
• MESH, MonacaのAPIをそれぞれが呼び出して使用する
• 両者のAPIは公開されていないが、実現の可能性はある
• イベント連携
• それぞれのイベントを仲介する
• イベントドリブン方式の連携
27
MESHタグがイベントメインのため

28. ❷独立性を保持した連携の実現
• それぞれの従属性をなくす
• MESH, Monacaどちらの一部でもない、外部のシステム
• 疎結合性・拡張性の重視
• それぞれのプログラム改変に影響されない
• インタフェースの統一
• 使用方法を統一し、誰でも使用可能に
28

29. 4. 開発

30. MESH Monacaアプリ
設定した値を書込み
Database Write
3/s
更新を取得
Database Read
Firebase
更新を取得
Database Update
設定した値を書込み
Database Write
任意の値(下表)を送受信
するMe-Moカスタムタグ
Me-Moタグ
MESH
SDK
MESHレシピ
MESHタグ
MESHで制作
した作品
MESHの各タグ
作成したMESH
レシピ全体
Key 説明 Value(例1) Value(例2)
name 名前 button quiz
trigger アクション push correct
value 値 1 1
id 固有番号 1 1
Monacaアプリに送信する際に設定するデータと例
システム構成と機能
Key 説明 Value(例)
Output
Index
タグ出力
番号
2
任意の値を設定
MESHに送信する際に
設定するデータと例
Key Value(例)
name button
trigger push
value 1
id 1
MESHから送られて来たデータ
Key 説明 Value(例)
Output
Index
タグ出力
番号
2
Monacaアプリから送られて来たデータ
必要であれば
任意の値を設定
Me-Moユーザー
MESHタグの値設定、レシピ作成、
Monacaアプリ作成等をする
1. 物理的な距離の影響を受けない
2. MESH, Monacaの独立性保持設計
30

31. MESH Monacaアプリ
設定した値を書込み
Database Write
3/s
更新を取得
Database Read
Firebase
更新を取得
Database Update
設定した値を書込み
Database Write
任意の値(下表)を送受信
するMe-Moカスタムタグ
Me-Moタグ
MESH
SDK
MESHレシピ
MESHタグ
MESHで制作
した作品
MESHの各タグ
作成したMESH
レシピ全体
Key 説明 Value(例1) Value(例2)
name 名前 button quiz
trigger アクション push correct
value 値 1 1
id 固有番号 1 1
Monacaアプリに送信する際に設定するデータと例
システム構成と機能
Key 説明 Value(例)
Output
Index
タグ出力
番号
2
任意の値を設定
MESHに送信する際に
設定するデータと例
Key Value(例)
name button
trigger push
value 1
id 1
MESHから送られて来たデータ
Key 説明 Value(例)
Output
Index
タグ出力
番号
2
Monacaアプリから送られて来たデータ
必要であれば
任意の値を設定
Me-Moユーザー
MESHタグの値設定、レシピ作成、
Monacaアプリ作成等をする
1. 物理的な距離の影響を受けない
2. MESH, Monacaの独立性保持設計
31

32. MESH Monacaアプリ
設定した値を書込み
Database Write
3/s
更新を取得
Database Read
Firebase
更新を取得
Database Update
設定した値を書込み
Database Write
任意の値(下表)を送受信
するMe-Moカスタムタグ
Me-Moタグ
MESH
SDK
MESHレシピ
MESHタグ
MESHで制作
した作品
MESHの各タグ
作成したMESH
レシピ全体
Key 説明 Value(例1) Value(例2)
name 名前 button quiz
trigger アクション push correct
value 値 1 1
id 固有番号 1 1
Monacaアプリに送信する際に設定するデータと例
システム構成と機能
Key 説明 Value(例)
Output
Index
タグ出力
番号
2
任意の値を設定
MESHに送信する際に
設定するデータと例
Key Value(例)
name button
trigger push
value 1
id 1
MESHから送られて来たデータ
Key 説明 Value(例)
Output
Index
タグ出力
番号
2
Monacaアプリから送られて来たデータ
必要であれば
任意の値を設定
Me-Moユーザー
MESHタグの値設定、レシピ作成、
Monacaアプリ作成等をする
1. 物理的な距離の影響を受けない
2. MESH, Monacaの独立性保持設計
32
• MESH SDKで制作したカスタムタグ
• Monacaアプリに任意の値を送信
• MESHレシピやタグの状態など
• Monacaアプリからの値も受け取れる
Me-Moタグ
MESH SDK

33. MESH Monacaアプリ
設定した値を書込み
Database Write
3/s
更新を取得
Database Read
Firebase
更新を取得
Database Update
設定した値を書込み
Database Write
任意の値(下表)を送受信
するMe-Moカスタムタグ
Me-Moタグ
MESH
SDK
MESHレシピ
MESHタグ
MESHで制作
した作品
MESHの各タグ
作成したMESH
レシピ全体
Key 説明 Value(例1) Value(例2)
name 名前 button quiz
trigger アクション push correct
value 値 1 1
id 固有番号 1 1
Monacaアプリに送信する際に設定するデータと例
システム構成と機能
Key 説明 Value(例)
Output
Index
名前 2
任意の値を設定
MESHに送信する際に
設定するデータと例
Key Value(例)
name button
trigger push
value 1
id 1
MESHから送られて来たデータ
Key 説明 Value(例)
Output
Index
タグ出力
番号
2
Monacaアプリから送られて来たデータ
必要であれば
任意の値を設定
Me-Moユーザー
MESHタグの値設定、レシピ作成、
Monacaアプリ作成等をする
1. 物理的な距離の影響を受けない
2. MESH, Monacaの独立性保持設計
Me-Moタグを用いてMonacaアプリに
データを送ることでMESHを
機能として使えるようにしている
33

34. MESH Monacaアプリ
設定した値を書込み
Database Write
3/s
更新を取得
Database Read
Firebase
更新を取得
Database Update
設定した値を書込み
Database Write
任意の値(下表)を送受信
するMe-Moカスタムタグ
Me-Moタグ
MESH
SDK
MESHレシピ
MESHタグ
MESHで制作
した作品
MESHの各タグ
作成したMESH
レシピ全体
Key 説明 Value(例1) Value(例2)
name 名前 button quiz
trigger アクション push correct
value 値 1 1
id 固有番号 1 1
Monacaアプリに送信する際に設定するデータと例
システム構成と機能
Key 説明 Value(例)
Output
Index
名前 2
任意の値を設定
MESHに送信する際に
設定するデータと例
Key Value(例)
name button
trigger push
value 1
id 1
MESHから送られて来たデータ
Key 説明 Value(例)
Output
Index
タグ出力
番号
2
Monacaアプリから送られて来たデータ
必要であれば
任意の値を設定
Me-Moユーザー
MESHタグの値設定、レシピ作成、
Monacaアプリ作成等をする
1. 物理的な距離の影響を受けない
2. MESH, Monacaの独立性保持設計
Me-Moタグを用いてMonacaアプリに
データを送ることでMESHを
機能として使えるようにしている
MESHレシピ・Monacaアプリ
に付け加えるだけなので、
既存のプログラムの変更がいらない 34

35. MESH Monacaアプリ
設定した値を書込み
Database Write
3/s
更新を取得
Database Read
Firebase
更新を取得
Database Update
設定した値を書込み
Database Write
任意の値(下表)を送受信
するMe-Moカスタムタグ
Me-Moタグ
MESH
SDK
MESHレシピ
MESHタグ
MESHで制作
した作品
MESHの各タグ
作成したMESH
レシピ全体
Key 説明 Value(例1) Value(例2)
name 名前 button quiz
trigger アクション push correct
value 値 1 1
id 固有番号 1 1
Monacaアプリに送信する際に設定するデータと例
システム構成と機能
Key 説明 Value(例)
Output
Index
名前 2
任意の値を設定
MESHに送信する際に
設定するデータと例
Key Value(例)
name button
trigger push
value 1
id 1
MESHから送られて来たデータ
Key 説明 Value(例)
Output
Index
タグ出力
番号
2
Monacaアプリから送られて来たデータ
必要であれば
任意の値を設定
Me-Moユーザー
MESHタグの値設定、レシピ作成、
Monacaアプリ作成等をする
1. 物理的な距離の影響を受けない
2. MESH, Monacaの独立性保持設計
35

36. MESH Monacaアプリ
設定した値を書込み
Database Write
3/s
更新を取得
Database Read
Firebase
更新を取得
Database Update
設定した値を書込み
Database Write
任意の値(下表)を送受信
するMe-Moカスタムタグ
Me-Moタグ
MESH
SDK
MESHレシピ
MESHタグ
MESHで制作
した作品
MESHの各タグ
作成したMESH
レシピ全体
Key 説明 Value(例1) Value(例2)
name 名前 button quiz
trigger アクション push correct
value 値 1 1
id 固有番号 1 1
Monacaアプリに送信する際に設定するデータと例
システム構成と機能
Key 説明 Value(例)
Output
Index
名前 2
任意の値を設定
MESHに送信する際に
設定するデータと例
Key Value(例)
name button
trigger push
value 1
id 1
MESHから送られて来たデータ
Key 説明 Value(例)
Output
Index
タグ出力
番号
2
Monacaアプリから送られて来たデータ
必要であれば
任意の値を設定
Me-Moユーザー
MESHタグの値設定、レシピ作成、
Monacaアプリ作成等をする
1. 物理的な距離の影響を受けない
2. MESH, Monacaの独立性保持設計
36
Firebase
• モバイルアプリのバックエンド機能
を提供するプラットフォーム(mBaaS)
• クライアントにリアルタイム同期
• MESHのデータをFirebaseに送り
Monacaアプリにリアルタイム同期

37. MESH Monacaアプリ
設定した値を書込み
Database Write
3/s
更新を取得
Database Read
Firebase
更新を取得
Database Update
設定した値を書込み
Database Write
任意の値(下表)を送受信
するMe-Moカスタムタグ
Me-Moタグ
MESH
SDK
MESHレシピ
MESHタグ
MESHで制作
した作品
MESHの各タグ
作成したMESH
レシピ全体
Key 説明 Value(例1) Value(例2)
name 名前 button quiz
trigger アクション push correct
value 値 1 1
id 固有番号 1 1
Monacaアプリに送信する際に設定するデータと例
システム構成と機能
Key 説明 Value(例)
Output
Index
名前 2
任意の値を設定
MESHに送信する際に
設定するデータと例
Key Value(例)
name button
trigger push
value 1
id 1
MESHから送られて来たデータ
Key 説明 Value(例)
Output
Index
タグ出力
番号
2
Monacaアプリから送られて来たデータ
必要であれば
任意の値を設定
Me-Moユーザー
MESHタグの値設定、レシピ作成、
Monacaアプリ作成等をする
1. 物理的な距離の影響を受けない
2. MESH, Monacaの独立性保持設計
37
• リアルタイム同期
• 遠隔での連携が可能
• イベントドリブン方式の実現
• mBaaSでモバイルアプリ最適化

38. 5. 制作した連携アプリ例
38

39. 6. おわりに
サイバー・フィジカルモバイルアプリ制作のための
ブリッジ機能 を開発した
MESH・Monacaにとってメリットのある機能を実現
39
❶ 物理的な距離の影響を受けない
❷ MESH, Monacaの独立性保持
設計方針

40. 謝辞
本研究を進めるにあたり、研究にご協力いただいた
ソニー株式会社 沼田洋平様、
アシアル株式会社 取締役 塚田亮一様、
デモ映像撮影にご協力いただいた
田中雄大様、市川俊樹様、高橋穣次様
に厚く御礼申し上げます。
40

41. 参考文献 1/2
1. 吉田顕一：MESHBOOK 世界にひとつのメッシュブック MESHで始める 子どもと一緒に
電子工作, IoT, ロボット作りのレシピ集, デザインエッグ社 (2016).
2. アシアル株式会社・生形可奈子・岡本雄樹：Monacaで学ぶはじめてのプログラミング
∼モバイルアプリ入門∼, 学術研究出版 (2016).
3. Google, 自動運転車の正式プロトタイプを初公開. 顔つきがやや真面目に - Engadget
http://japanese.engadget.com/2014/12/22/google-self/
(2018年1月29日最終アクセス)
4. 『Pokémon GO』公式サイト
http://www.pokemongo.jp/ (2018年1月29日最終アクセス)
5. ポケモンGO, 売上1千億円突破でも, 先行きは暗い？ - Forbes
https://forbesjapan.com/articles/detail/14946 (2018年1月29日最終アクセス)
6. ポケモンを現実世界でプレイできるアプリ「ポケモンGO(Pokémon GO)」でポケモンを
ゲットする方法＆歩きまくるとタマゴがふ化して進化する新要素などが判明 - Gigazine
http://gigazine.net/news/20160325-pokemon-go-system/
(2018年1月29日最終アクセス)
7. MESH SDK
https://meshprj.com/sdk-jp/ (2018年1月29日最終アクセス)
8. MESHレシピ ‒ ソニー
https://recipe.meshprj.com/jp/ (2018年1月29日最終アクセス)
41

42. 参考文献 2/2
9. 遊びながら学ぶプログラミング教室『SWIMMY（スイミー）』
http://www.sai.co.jp/swimmy/ws/ (2018年1月29日最終アクセス)
10. 株式会社エス・エー・アイ
https://www.sai.co.jp/ (2018年1月29日最終アクセス)
11. Apache Cordova
https://cordova.apache.org/ (2018年1月29日最終アクセス)
12. Onsen UI 2
https://ja.onsen.io/ (2018年1月29日最終アクセス)
13. Firebase ‒ Google
https://firebase.google.com/?hl=ja (2018年1月29日最終アクセス)
14. さくらサーバー ‒ さくらインターネット
https://www.sakura.ne.jp/ (2018年1月29日最終アクセス)
15. Nifty Cloud Mobile Backend
https://console.mb.cloud.nifty.com (2018年1月29日最終アクセス)
16. Static website hosting who is fastest
https://www.savjee.be/2017/10/Static-website-hosting-who-is-fastest/
(2018年1月29日最終アクセス)
42

43. 質疑応答

44. とは何か
• センサーやボタンを備えた７つのIoTブロック
• アプリとBluetoothでブロック関連系をコントロール
• ビジュアルプログラミング環境
• IFTTTやGmail等との連携, SDK
44
ハードウェアタグ
• ボタン タグ
• LED タグ
• 動き タグ
• 明るさ タグ
• 人感 タグ
• 温度湿度タグ
• GPIO タグ
ソフトウェアタグ
• カメラ タグ
• マイク タグ
• スピーカー タグ
• 通知 タグ
• ミュージックタグ
• IFTTT タグ
• Gmail タグ
• 自作ソフトウェア
タグ(SDK)

45. とは何か
• HTMLハイブリッドアプリ専用開発環境
• OSバージョンの違いを吸収
• アプリ開発の効率化
• 開発スタイルに合わせてクラウド・ローカルを選べる
45

46. Me-Moはどうしたら使えるの？
1. Firebaseに登録する
2. サーバーのPHPプログラムをダウンロード
3. Firebase情報をPHPプログラムに書き込む
MESHからMonacaにデータを送る
4. Me-Mo送信タグをインポートする
5. MESH SDKでMe-Moタグを設定
6. MESHレシピをMe-Moタグと繋ぐ
7. MonacaでFirebase SDKを読み込み
リアルタイムで更新を読み取る
イベントを使用
8. Me-Moタグごとに任意の値
(送りたいデータ)を設定する
9. Monacaでデータを受け取った時の
処理を記述
10.MESHレシピでMe-Moタグを起動
11.Monacaアプリ, MESHで動作確認
MonacaからMESHにデータを送る
4. Me-Mo受信タグをインポートする
5. MESH SDKでMe-Moタグを設定
6. MESHレシピをMe-Moタグと繋ぐ
7. MonacaでFirebaseにデータを送る
処理を記述
8. MESHレシピでデータを
送った時の処理を作成
9. Monacaアプリ, MESHで動作確認
共通
46

47. MESH Monacaアプリ
設定した値を書込み
Database Write
3/s
更新を取得
Database Read
Firebase
更新を取得
Database Update
設定した値を書込み
Database Write
任意の値(下表)を送受信
するMe-Moカスタムタグ
Me-Moタグ
MESH
SDK
MESHレシピ
MESHタグ
MESHで制作
した作品
MESHの各タグ
作成したMESH
レシピ全体
Key 説明 Value(例1) Value(例2)
name 名前 button quiz
trigger アクション push correct
value 値 1 1
id 固有番号 1 1
Monacaアプリに送信する際に設定するデータと例
システム構成と機能
Key 説明 Value(例)
Output
Index
タグ出力
番号
2
任意の値を設定
MESHに送信する際に
設定するデータと例
Key Value(例)
name button
trigger push
value 1
id 1
MESHから送られて来たデータ
Key 説明 Value(例)
Output
Index
タグ出力
番号
2
Monacaアプリから送られて来たデータ
必要であれば
任意の値を設定
Me-Moユーザー
MESHタグの値設定、レシピ作成、
Monacaアプリ作成等をする
1. 物理的な距離の影響を受けない
2. MESH, Monacaの独立性保持設計
47

48. MESH Monacaアプリ
設定した値を書込み
Database Write
3/s
更新を取得
Database Read
Firebase
更新を取得
Database Update
設定した値を書込み
Database Write
任意の値(下表)を送受信
するMe-Moカスタムタグ
Me-Moタグ
MESH
SDK
MESHレシピ
MESHタグ
MESHで制作
した作品
MESHの各タグ
作成したMESH
レシピ全体
Key 説明 Value(例1) Value(例2)
name 名前 button quiz
trigger アクション push correct
value 値 1 1
id 固有番号 1 1
Monacaアプリに送信する際に設定するデータと例
システム構成と機能
Key 説明 Value(例)
Output
Index
タグ出力
番号
2
任意の値を設定
MESHに送信する際に
設定するデータと例
Key Value(例)
name button
trigger push
value 1
id 1
MESHから送られて来たデータ
Key 説明 Value(例)
Output
Index
タグ出力
番号
2
Monacaアプリから送られて来たデータ
必要であれば
任意の値を設定
Me-Moユーザー
MESHタグの値設定、レシピ作成、
Monacaアプリ作成等をする
1. 物理的な距離の影響を受けない
2. MESH, Monacaの独立性保持設計
48

49. スマートフォン(or iPad)は基本2台必要
スマートフォンはモバイルアプリ用と、
MESHレシピ起動用に一台ずつ使う
49
MESH Monacaアプリ

50. Raspberry pi向けMESHハブアプリケーション
50

51. Raspberry piでMESHレシピを代用可能
スマートフォンはモバイルアプリ用と、
MESHレシピ用に一台ずつ使う
51
Raspberry pi Monacaアプリ

52. 例外として、1台でも可能
１台のスマートフォンのバックグラウンドで
MESHアプリを起動すれば１台で動かすことができる
52
１
MESHアプリ
Monacaアプリ
バックグラウンド起動

53. なぜMESHとMonacaに着目したのですか？
• 大学の授業でどちらも使っており、
身近で連携してみたいという需要があった
• サイバー・フィジカルモバイルアプリ制作ができる
• アプリとセンサー等を連携, 発展的な制作ができる
• サイバー・フィジカルモバイルアプリは
あまり普及していない
53

54. MESHのメリットを潰していないか？
• MESHのレシピに
Me-Moタグを付け加えるだけで使える
• MESHのメリットはそのままに、Monacaアプリと
連携できる
54

55. Firebaseが本当に1番いいのか？
• mBaaS(mobile backend as a Service)なので
モバイルアプリに特化
（Monacaモバイルアプリを基軸として設計している）
• クライアントにデータをリアルタイム同期することができる
問題点
• MESHレシピから送ったデータをMonacaアプリにリアルタ
イム同期させることはできるが、Monacaアプリのデータを
MESHレシピにリアルタイム同期することはできない
• 現状では1秒∼3秒ほどかかる
• 本研究ではMonacaアプリを基軸とした場合のMe-Moを
対象としているため、MESHタグのセンサーをMonacaアプリに反
映させることを優先した
55

56. Firebaseが本当に1番いいのか？
56
出展：
https://www.savjee.be/2017/10/Static-website-hosting-who-is-fastest/

57. 老人がボタンを押し忘れたら？
• 老人に「薬を飲みましたか？」という通知をして
ボタンを押してもらう
57
薬を飲んだら
MESHタグを押す
薬を服用したか
アプリで確認,
飲んでいない場合通知
遠隔でも使うことができる
薬を飲み
ました！
「薬を飲みました！」
という音声
ボタンを押したら
LEDライトが光る
ボタンタグ
LEDタグ

58. MESH, Monacaのリソース
58
MESH
• MESHタグ
• IoTセンサー
• サイバー・フィジカル
• 電子工作
• ビジュアルプログラミング
• プログラミングを必要としない
• 様々な連携タグ
• MESHレシピ
Monaca
• HTMLハイブリッドアプリ
• 生産性が高い
• 開発環境の提供
• インターネット上で開発で
きる
• 端末に依存しない

59. • アイデアを形にできる IoT ブロック
• HTMLハイブリッドアプリ開発環境
に注目し、これらを組み合わせた
サイバー・フィジカルモバイルアプリを作る
ブリッジ機能 Me-Mo の開発を行った。
結局何がしたいの？
2. 研究目的
59
サイバー・フィジカルモバイルアプリの
実現と普及に繋がる研究

60. ターゲットは？
• MESHとMonacaを使っており、これらを連携させた
発展的なサイバー・フィジカルモバイルアプリを
作りたいと思っている人
• 他人のMESHレシピ(Monacaアプリ)と
自分のMonacaアプリ(MESHレシピ)を
組み合わせた作品を作りたい人
60

61. 先行事例はないのか？
MESHとMonacaを繋げるという試み自体が
初めてとなる
61