MotionBoardとDEJIREN、2つの製品紹介
島澤甲氏（以下、島澤）：みなさん、こんにちは！ 本セッションではMotionBoardと新製品DEJIRENのセッションになります。私、島澤と。
大畠幸男氏（以下、大畠）：私、大畠で、このセッションをお送りします。どうぞよろしくお願いします。
島澤：よろしくお願いいたします。
（会場拍手）
今日、ご紹介する製品ですが、1つ目はMotionBoard。2つ目がDEJIRENですね。基調講演をお聞きいただいた方はご存知のとおり、DEJIRENについて少しだけ紹介させていただきました。ここではもう少し掘り下げて紹介できればと思っております。
最初はMotionBoardから紹介したいと思っております。MotionBoardのビジネス的なところについて、少し触れてもらえますか？
大畠：はい。おかげさまでMotionBoardの利用社数も1,500社を突破しました。さまざまなお客様のもとで、可視化のツールや実際の分析の環境として、お使いいただいております。
我々もそうですが、パートナーのみなさまと一緒にリリースさせていただいているというところもありますので、この場を借りて感謝申し上げたいと思います。本当にありがとうございます。
島澤：ありがとうございます。
MotionBoardで挑戦する農業IoT
大畠：ここ最近、テーマとしてよく使っていただいているテクノロジーが「IoT」。IoTは、だんだん当たり前のようになってきていると思います。
基調講演では株式会社ソラコムの玉川憲さんから「IoTは民主化していく」というお話がありました。我々も、民主化されたさまざまなデータを、いかにみなさまに届けていくかという中で、このようなIoTの可視化の環境の場面でMotionBoardを使っていただくシーンが非常に多くなっています。島澤さん、これについてはいかがでしょうか。
島澤：「IoTって、バズワードじゃないの？」みたいな話もありましたけれども、実際にお客様とお仕事をやらせていただいていると感じるのですが、IoTによってROI、投資対効果が得られているお客様がかなり増えてきました。現在では、バズっているというよりも、より具体的な領域になってきたなという肌感がものすごくありますね。
大畠：我々も、いろんなIoTを手がけて行っております。そのなかで1つ、農業に対するIoTに取り組んでいこうと考えています。これについて、島澤さんからお願いします。
島澤：私たちは「わくわくファーム」という農場を千葉県に借りまして、自身でIoTに取り組んでいます。私たちは、基本的にはソフトウェアを開発している会社ですが、私たちがお客様に対してなにかを提供するときに、自分たち自身で使ったことがないというのは、すごく嫌いなんです。
自分たちで使ったことがないけど「IoT、便利ですよ、取り組んでみましょう」というのは、すごく無責任な気がしてしませんか？ だから、できるだけ自分たちで使ってみようと。そういうところで今回、農業IoTに取り組む機会があり、MotionBoardで挑戦しています。
ウイングアークでも、この農業でのIoTの活用を考えています。これはオープン当初の農場の素の写真ですが、ここにいろんなセンサーを組み込んでいこうということを取り組んでいました。
異常が発生したらすぐに手を打てる。これがIoTの良さ
島澤：そして、実際にやってみようと。異常に気がつけば、人は動ける。IoTのいいところはいろいろありますが、1番のポイントは、ここだと思います。例えば、家が火事で、火事だって気がついたら、動けますよね。「今、ラーメン食べてるから、食べ終わってから行くわ」なんていう人、絶対にいないんですよ。
IoTも同じように、なんらかの異常が発生したら、では手を打とうと。これがパッとできるのが、IoTの良さなんです。まずはそれを自分たちで体現しようということで、1号機を開発しました。
これは、その当時の設計図をそのまま持ってきました。ソーラーパネルを設置して、コントロールボックスにいろんなマイコンを入れています。そして、LTE。ソラコムのSIMと連携して、クラウド上のMotionBoardにデータをどんどん上げて、MotionBoard上で可視化する。異常があったときに通知。そういったものを、まず実装してみたというところですね。
ソーラーパネルによってどこでもデータが取れるかたちです。今回、動力は太陽光エネルギーにしようと企画しました。
初号機の画面はシンプルな画面です。ただ、周辺の温度や湿度、土壌の水分量を取得できます。また、PH、気圧なども取得できるものを当時作りました。異常が起きたときには、MotionBoardのアラーム設定で、私のApple Watchと連携する。これが1号機ですね。
いろんなセンサーを付けて……サーモグラフィやカメラなど、いろいろとがんばってみたのがこの1号機です。
でもこれね、ボツ……というか、失敗だったんです。ここに、特別昇圧機というのがあるんですね。これはなにかというと、実はこれが、1号機のコンセプトだったんですよ。ボツになったアイデアを少しだけ紹介すると……。
大畠：デモですか？
島澤：デモです。（スライドを指して）これ、わかります？ 電圧を100万ボルトに昇圧する機械で、1号機に内蔵してあるんです。これを使って植物を活性化させようという、けっこう野心的な取り組みだったんです。少しだけやってみましょうか。なかなか怖いので……ちょっと音が大きいですよ。
（バチバチッと大きな音が鳴る）
大畠：おぉっ。びっくりした。
島澤：こんな感じですね。これを内蔵しました。植物はよく「いじめると甘くなる」って言いませんか？ トマトは、水をあげないと甘くなるんですよ。つまり、いじめると甘くなる。そこで、いろいろといじめる方法を考えたんです。「スピーカーで罵声を浴びせる」など、いろいろありました。
島澤：（罵声を浴びせるものは）コンプライアンス的によくなさそうなので、今回はこの100万ボルトの電流で、「100万ボルトのビリビリ野菜」というブランドで、甘いトマトでも作ろうかと。
大畠：売れないなぁ……。
島澤：うるさいよ（笑）。
（会場笑）
そう思ったんですけれども、無事にボツになりました。そして2号機です。
2号機はかなり真面目に作りました。きちんと3Dプリンターで出力して、エンクロージャーもしっかりと樹脂を使って、電源ケーブル系も実装しました。
MotionBoardでリアルな農場の状態を可視化する
島澤：それぞれのセグメントが、通信系、電源系、制御系と分かれていまして。
（スライドを指して）これは作っているときの画ですね。細かい話なのでパパッと進めます。ラジコンのハンドルのようなものでモーターを制御できるようにすることで、リモートで水やりまでサポートしているのが1つの特徴です。
（スライドを指して）実際に完成したのがこんなかたち。社員に見せたら、爆弾だなんだと、ひどい言われようでした。このユニットによって、いろんなデータが取れるようになっています。
小さな筐体の中に、20系統のデータを取れるようにしています。土壌に関しては6チャンネルをサポートしました。実際には、40を超えるデータが取れるようなユニットを作ってみました。それが（スライドの）左側ですね。
右側がサーボでバルブ制御するものです。実際に、MotionBoardでここからリモートで水をあげたりすることもできるようになっています。では、画面を出せますか。
大畠：そうですね、デモをやりたいと思います。
今の爆弾のようなものですが、すぐそこのミュージアムに小さな模型があるため、興味があったら後ほど見に行ってもらえればと思います。では、デモですね。リアルタイムのセンシングで、取れたデータをMotionBoardで可視化していく内容を見ていただこうかなと思います。
データは先ほど見ていただいた千葉にある農場のデータを、今、リアルタイムでセンシングしてみなさんに見ていただいています。気温が18.6度くらい。湿度が47パーセント。こんな感じですかね。
農園に6棟あるんですけれども、各プラントの土の中の温度や湿度の状態です。見ていただくとわかりますかね。ここは24.27パーセントですが、こちらの2棟目は7.85パーセント。ちょっと水分が足りないですよね。だとすると、このあたりから水を入れていけばいいかな、といったようなデータがわかります。
島澤：そうですね。課題として、センサーをそれほど深く埋められなかったので、作業しているときにセンサーに手が触れたり、そうしたノイズを拾ってしまって、温度が跳ね上がっているところもあります。作業していて、こうしたデータも取ってしまうのが、課題ではあります。
畑に水を撒くためだけに行かなくてもいいように
島澤：また、外の温度や湿度も出せますかね。
大畠：外の環境ですね。例えば、こういったかたちで、過去の推移がどうなっているかも、きちんと見られるようにしています。
島澤：こうしてデータが取れると、（何かが起きたときに）手を打てるようになります。それで、植物の生育状況とこのデータを突合させることによって、一番効くパラメータは何かといったことを検討できます。このあと、私がエンジンにかけて、この育成状況の分析や可視化をさらに進めていこうかなと考えています。
大畠：そうですね。（スライドを指して）こちらにカメラの画があるのですが、ここをクリックすると、ストリーミングで撮ることも当然できます。こちらは静止画像です。ある一定の間隔ですが、このようにクリックしていくと見えたりします。
島澤：これは1分に1回、スチールを撮っています。それをMotionBoardのDBに叩き込んでいくというかたちです。動画でもいいんですが、環境的にもプライバシーへの配慮といったところで、今回はこうした低解像度の画像にしています。
また、サーモグラフィも……今日はそこまでお見せできないんですけれど、サーモグラフィによる周辺温度の可視化にも挑戦しています。
先ほど「バルブ制御をやります」という話をしたのですが、水の制御はこんな感じのパネルです。これで「ALL:OPEN」とすると、一気に水がバシャッと出ます。
実際には、農園の管理者さんが土日などに回ってメンテナンスをしているんです。農園の管理者さんのなかには、埼玉県などから行っている方もいらっしゃいます。そうした方の労力軽減になればと思っています。
蛇口をひねるためだけに、電車で2時間揺られてというのは、働き方としてはあまりよくないかなと思って。私たちは、こういったデバイスを通じてそうしたことを改善していきます。まずは、自分たちでやってみたという話ですね。
FlashからHTML5へのアーキテクチャ変更
大畠：では、PowerPointに戻りましょうか。
島澤：ではここから、MotionBoardの製品の話に入っていきます。MotionBoardは、2011年8月にリリースしてから、もう8年目ぐらい。
長いようで短かった。バージョンは、だいたい1年に1回のペースで変更して、これまでに1,850を超える機能を導入してきました。私たちはMotionBoardという製品の開発の中で、お客様の声を7割取り込もうとしています。そして、ほかの会社（の製品）では味わえないようなエクスペリエンスを3割入れ込もうといったかたちで、お客様の声を中心に育ててきた製品です。
そして、近くメジャーバージョンアップを行います。それが、バージョン6.0です。
これはかなり特殊なバージョンです。今までみたいに、「1回のバージョンアップで何百機能も実装しました！」という話ではありません。
HTML5対応。これがまず、一番最初の大きなアーキテクチャの変更です。今のMotionBoardというのは、Flashで動いているんですね。それをHTML5に乗せ換えていくのが、もっとも大きな挑戦でした。
2020年末に、主要なベンダーはFlashのサポートを打ち切るというのは、すでに多くの方がご存知かと思います。
では私たちは、MotionBoardのFlashをどうするのか。ずっと言われ続けてきたのですが、私たちの答えは「きちっと互換性を持つかたちで対応します」でした。
Flashの上位互換がHTML5というわけではありません。若干テクニカルな話で恐縮ですけれども、FlashよりもHTML5が無条件に速いかというと、そんなことはありません。Flashにできて、HTML5にできないこともあるんです。
私たちは、お客様が今まで作ったさまざまなボードや画面は資産であると位置づけていまして、限界まで互換性を引き出そうということで、挑戦しています。そうは言っても、HTML5にしたら遅くなったというのでも、当然ダメです。開発の最中は、HTML5で速度を出すのに、かなり苦労しました。
HTML5でMotionBoardを動かすデモンストレーション
島澤：本当に、久しぶりに「これはヤバイぞ」と思った開発でした（笑）。今回、資産の継承とパフォーマンスの両方を表現できるようなかたちでメジャーバージョンアップできる見込みが立っていますので、そちらを紹介しましょう。
大畠：では、デモを動かしていきたいと思います。
わかりやすいように、みなさまから見て右側がFlash、左側がHTML5でMotionBoardが動いているということです。
（スライドを指して）こういったサムネイルのようなイメージで出ていると思います。それぞれ、まったく違うモードで動いているんですが、見た目はほぼ同じですよね。
島澤：見た目から差異を見破ろうとするのはなかなか大変だと思います。細かいところで角丸が付いていないなどはあるんですけれども。ほぼ同一のかたちです。
もう1つお話しすると、次のバージョン6.0は、引き続きFlashもサポートします。フォントサイズなどの細かいところが、ブラウザの実装の問題で、どうしても互換性を担保できない……そういう点がいくつかあります。次のバージョンは、Flashで作ったボードをHTML5でそのまま出す、またはその逆に対応できるようにしています。お客様の今の環境を、できるだけ安全にHTML5の環境に持っていけるようにというところに、今回はかなり注力しました。
では大畠さん、実際に画面比較といきましょうか。
大畠：そうですね。右側のFlashからスタートしていきます。こちらは、日本全国の病院プロトデモです。10万件を超えると思うのですが、それをFlashボードとHTML5ボードの両方で動かしてみたいと思います。
（デモ開始）
まず右側から、スタートしました。左側もいきます。実際はどうでしょうか。地図の上に情報を出そうとしていますが、左側が抜いてきましたね。もう終わりました。右側の現行バージョンは、まだ処理していますね。こんなところです。
さらに左側、HTML5のほうを少し操作してみましょう。このようにズームしても、サクサク動いています。こちら（Flash）を動かしてみましょう。ややパラパラ動いているのがわかりますかね。こうした描画UIの差というところで、新しいバージョンのHTML5でも、より速く動く画面を提供していく。そうしたことを、我々は考えています。
サーバー通信と描画の最適化による性能改善
島澤：サーバーの通信の最適化と描画の最適化、両方のアプローチから、今回の性能問題の改善に取り組みました。こうした比較的単純な描画でも、けっこう有意な差がでますね。FlashとHTML5で、Flashのほうを先にクリックしたとしても、HTML5のほうが表示までは速い。
大畠：では、もう1つ見てもらいましょう。今度はリアルタイムです。先ほど、IoTのお話をしました。MotionBoardは、リアルタイムで画面に表示するため、いろんなところでお使いいただいているんですが、これがHTML5になると、どのようなかたちに変わっていくのか。
こちらも、右側がFlash、左側がHTML5です。
島澤：裏側で何が起こっているかというと、（スライドを指して）上に青い波形がありますよね。これを学習データとして……下でずっと緑色の波形が流れてると思いますが、ずっと裏側でRを叩いて、各波形に差異がないということを計算し続けています。それをリアルタイムにやり続けています。
FlashとHTML5を、今、同じ定義で開いてます。この緑色の……少しHTML5のほうが間延びしちゃいましたね。FlashとHTML5で、まったく同じ定義なんですね。でも、画面のリフレッシュレートにけっこう差があると思います。HTML5のほうが明らかに速いというところで、同じ定義を持ってきても、基本的には（HTML5が）速く動きます。せっかくなので、何かノイズを発生させてもらうといいですかね。
大畠：わかりました。では、パルスいきます。
島澤：もう少しパルスがあっても……もう1回、押しましょうか。
大畠：もう少しですね。
島澤：こんな感じですね。これは、ランダムにノイズを入れているんですけど……リセットされちゃいましたね（笑）。今、ランダムにノイズを入れることによって……もう1回押せますか？
大畠：はい。
島澤：この波形は、学習データに対して差異があるということで、それを検出してアラートとして描画する。そういったことを、100ミリ秒ごとに行っています。HTML5は、だいたいFlashの2.5倍くらいの描画スピードを持っています。では、次（の話題）にいきましょうか。
（デモ終了）
