ベースキャンプ名古屋のiBeacon対応を考えてみる

iBeacon という新しいテクノロジーをご存知でしょうか？ Appleのサイトのサポート情報「iOS：iBeacon について」に以下のように書かれています。

iBeacon は iOS の位置情報サービスを拡張する新しいテクノロジーです。iBeacon の設置場所に近づいたり離れたりすると、iOS デバイスから App に通知させることができます。位置のモニタリングのほか、App によって iBeacon (たとえば、Apple Store 直営店のディスプレイやレジカウンター) との距離を測定することもできます。iBeacon では、位置情報を明らかにするために緯度と経度ではなく、BLE (Bluetooth Low Energy) 信号を利用します。この信号を iOS デバイスが検出します。

これを利用して、店舗（ベースキャンプ名古屋）でどのような事ができるのかを考えてみたいと思います。私の普段やっているWeb制作やCMS開発とは少し違いますが、ちょっと面白そうな技術なのでやってみる事にします。

チェックイン / チェックアウト

まずは、以下の動画でも見て下さい。

現在は、受付にある iPad にアイコンを表示させて、自分のアイコンをタップする事でチェックインやチェックアウト処理を行っています。それに連動して、Webサイトやサイネージが連動して来ている事を表示させたり、サーバ上でログを取ったりする事ができるようになっています。

NFCとは違い機器との距離があっても大丈夫です。Bluetooth が使える範囲である10mくらいの距離から認識してくれます。テストしてみたところベースキャンプ名古屋の受付に置いてある Beacon は、エレベーターを出たあたりで認識される事が確認できました。

端末をかざす事なく、ベースキャンプ名古屋のアプリをインストールした iPhone を持ってさえいれば、会員の人は何もしないでもチェックインが可能になります。上記の動画を見る前に作ったのですが、同じように近づける事でチェックアウトする事ができるように作ってあります。一番上の写真が iPad を仮の Beacon 端末として、iPhone を近づけてチェックアウトしているところの写真です。

このチェックイン時に、iOS上で持っている SNS のアカウント情報をサーバに POST し、a-blog cms のユーザーに SNS の情報があれば、会員の方がチェックインした事とし、そうでなければビジターの方のチェックインとして、Webサイト上にアイコンが表示されるようになります。

これまで、iPad の操作に向う人が会員であるという事で、誰が会員なのかを認識しやすい状況でしたが、今後は受付で止まる事なく席まで行ってしまう事になります。ビジターさんの受付についてをどうするのか考えないといけません。

iOS 7.1 になって、アプリをバックグラウンドで起動してない状態でもプッシュ通知を受ける事ができるようになったので、より使いやすい進化をしているようです。

エリアの紹介

出入りのプッシュ通知以外に、アプリを立ち上げている時に何かできないかを考えた時に、図書スペースに Beacon を置き、近くに来た時には新刊の案内をしてみるというのもいいかもしれないと思っています。リブライズから最近登録した情報を取得できるかな？

その他には集中スペースや、会議室、飲み物の案内とかもできるかもしれません。

Beacon端末を買う

exfrontier.co.jp

estimote.com

どちらも3個で1万円くらいですが、電池の必要なUSBポートにさすものと、電池で動くものを試しに買ってみました。また、Beaconモジュール「BM1」というのであれば、1/10 のコストで手にいれる事も可能なようです。

Bluetooth という一般的な規格のものなので、iOS 端末自身を Beacon にしたり、Mac を Beacon にしたりする事も可能です。

参考の記事

参考動画

本

iBeacon ハンドブック [Kindle版] については、amazonプライム会員であるとKindle端末上で無料で読む事ができるようです。手元に Kindle が無いので、なんとかせねば！

最後に

近日中に、弊社の運営するコワーキングスペース「ベースキャンプ名古屋」で iBeacon 体験ができるようになります。 iBeacon を導入を検討したいというお店や、そういうクライアントがいる業者の方からの相談をお待ちしております。

iBeacon 以外にも、Web連動のデジタルサイネージという提案も可能です。

CMSで管理するデジタルサイネージでWeb屋さんが活躍できる場を増やす事を考えてみよう | kazumich.log

LG Smart TV をサイネージに利用するのはどうだろう？

a-blog cms で作ったサイトと連動のデジタルサイネージの導入クライアントも決まり、テスト段階から実際の利用を考える事になった。そこで気になっていた LG Smart TV というものを調べてきた。ベースキャンプ名古屋から駅裏のビックカメラを2往復するくらい真面目にチェックしてきました。表側にあるヤマダ電機 LABI名古屋には、LG の展示が少なく一番見たかった製品がありませんでした。スマートTV 先日、ソニー、2015年よりテレビに「Android TV」を全面採用へ - AV Watch というようなニュースも流れていたが、来年くらいからは TV に Android が搭載されたものが出てくるんだろうと思っている。では、今現在はどうするのがいいんだろうと考えたところ、タイトルにもあるように webOS を搭載した LG のテレビが選択肢にあがりました。上記のサイトのキャプチャを見ると、まだ分かってない事がある。2014年モデルの webOS搭載SmartTV と昨年モデルの SmartTV との違いがどんなだろう？ってところ。 webOS とは？ Wikipedia で調べてみると以下のような事が書かれている。 http://ja.wikipedia.org/wiki/HP_webOS HP webOSは、旧Palm（現在HPの一部門）が開発したスマートフォンやタブレットなど携帯機器向けのオペレーティングシステムおよび Linux と WebKit を中核としたソフトウエアプラットホームである。昔、好きだった Palm との再会ですよ。って事であれば、何も考えずに 2014年モデルじゃないですか！まずは、「LG webOS」で Google で検索してニュースをピックアップしてみる。 LGエレクトロニクス、CES2014でWebOSを搭載したスマートテレビを発表? – すまほん!! 【CES 2014】Firefox OS、webOSなどスマートテレビの新プラットフォームが続々登場 - LGエレはPalm由来のwebOSを薄型テレビに実装日経トレンディネット LG、webOS搭載スマートTVを発表 - ITmedia ニュース LGのWebOS搭載TVをハンズオン：過去最高のスマートTVインターフェース : ギズモード・ジャパン “LINEで話す”家電とwebOS搭載スマートテレビを触ってきた（LG編）：CES2014 2014 CES：よみがえる「webOS」、LGが新型スマートテレビに搭載へ (1/2) - EE Times Japan LG、「webOS」新バージョンを2015年登場の全スマートテレビに搭載か - CNET Japan いろいろ読んでみたが、アプリを自由にインストールして利用は無理っぽい。欲しいのはブラウザなので、標準でインストールされているブラウザの性能が一番興味のあるところだ。という事だと webOS でなかったとしてもいいのではないかと思ったりもする。来年になったら Android TV がいろいろ出てくるかもしれないので、webOS TV を頑張るところではない気もするが、webOS TV for Developer を見てると触ってみたくなりますね。ブラウザは何？新しいブラウザに会った時には User-Agent をチェックする習慣をお持ちですか？ Mozilla/5.0 (Linux; NetCast; U) AppleWebKit/537.31 (KHTML, like Gecko) Chrome/26.0.1410.33 Safari/537.31 SmartTV/5.0 OS は Linux で、ブラウザは Chrome 26 って事なので、2013年3月くらいのバージョンのようです。「Google Chrome 26」安定版リリース、スペルチェック機能を大幅強化 - GIGAZINE 買うのなら、どれ？実際に利用するためのものであれば、希望のサイズという事になるが一応 webOS 搭載モデルの 6700 か 6500 がいいかと思う。 55LB6700 の実機でベースキャンプ名古屋のサイネージと同じデータを表示させてみたが問題なく動いていた。 55LB6700 60LB6500 テスト機という事であれば、小さい方がいいだろうから 32LB6500 がいいのかもしれない。しかし、アップルップルの入り口の壁には 55LB6700 が欲しい！

2014年 7月 15日

名古屋で iBeacon が体験できるように

3月末に企画し、2週間ほどで第一弾のアプリ「basecamp NAGOYA」をリリースする事ができました。その状況を少し報告しておきます。リリースして24時間くらいの感想としては、思っていたほどうまく動作していないという事でした。インストールしてもチェックインできないという人が多く、できる人と、できない人の違いが分からない状況で、こんな状況ではお客様に提供できる状況ではないという判断でした。その後、48時間くらい経つと状況がいろいろ分かってくるのですが... iOSのバグという話もあり、7.1.1 がリリースされたら治るかと思っていたが、その部分については解決せず、弊社で制作しているアプリ側の問題も見つかったようで、もう少し改善したバージョンを用意する事になりました。数日前に株式会社アプリックス BM1 試作開発キット 10個 10,000円というものが届きました。これをベースキャンプ名古屋のイロイロなところに配置する予定です。同社のUSBタイプが10個15,000円、1個1,800円で発売開催されたようです。 MyBeacon™シリーズ USB給電型Beacon-StarterKit | 株式会社アプリックスいろいろ分かってきた事アプリが起動していない状態で、エリアに入った時に通知を出す事はできるが、アプリからサーバへのPOSTはできない。アプリがバックグラウンドで起動している状態であれば、アプリからサーバへのPOSTは可能なようだ。 USBから電気を取るタイプは、省電力すぎてUSB充電器ではオフになってしまうようでコンセントが必須な事がわかった。 iBeacon の向きとか表裏とかによって随分状況が違ってくる。 UUID , major , minor のIDは簡単に調べられるので、iBeacon を買えば簡単に同じ動作をさせる事が可能なんだと思う。（この部分はどうしたらいいんだろ？）最近の iBeacon 関連情報 iBeaconを使う「座布団」スマートデバイス--「Glassニュース」のキーバリューが開発 - CNET Japan 1800円でiBeaconを導入できる！アプリックスが一般向けビーコン販売開始【追記あり】課外活動でiBeaconアプリを開発したよ！ところでiBeaconって何だっけ？ | 株式会社KUFU

2014年 4月 30日

basecamp NAGOYA の iOSアプリがリリースされました

iBeacon を利用したコワーキングスペース「ベースキャンプ名古屋」の施設紹介やチェックイン・チェックアウトを快適に行うためのアプリケーションがリリースされました。 basecamp NAGOYA - App Store 3月27日に「ベースキャンプ名古屋のiBeacon対応を考えてみる」を書いていましたが、20日ほどでアプリを公開する事ができました。 iBeaconを利用したチェックイン・チェックアウト機能受付用のBeaconのBluetoothの電波のエリアに入った時点でチェックインする事ができます。アプリ上に設定しているソーシャルアカウントをベースキャンプ名古屋のサーバに送信します。エリアから外れた時にチェックアウトするようにも作れるところですが、店内に電波の届かないところもあるのでチェックアウトは受付のBeaconにタッチするとできるようにしました。ベースキャンプ名古屋のどこかのBeaconさえ見えていれば、チェックアウトしないようにすればいいのかもしれませんので、全てのBeaconから外れた時に、チェックアウトするような機能も用意するのもありかもしれません。 iBeaconを利用した施設案内現在、ベースキャンプ名古屋には3つのBeaconが稼働しています。受付以外のBeaconについては、施設案内用という事になります。例えば、図書コーナーに行くとアプリ上の画面が自動的に新刊案内を表示させる事ができるようにしたり、他のエリアに行っても説明の画面が表示可能です。 Beaconの機器を増やした際にも、管理用のCMSで UUID , major , minor の3つのIDを設定し、表示させたいURL等を設定する事で簡単に管理ができるようにしています。名古屋で最初に iBeacon を体験できる場所を提供できるようになったかな？栄のアップルストアは、どうなんだろ？イベント情報一覧ベースキャンプ名古屋では、多くのイベントを開催しておりますので、参加登録が簡単にできるようにしています。これは iBeacon 関係無いですね。イベント情報 | ベースキャンプ名古屋今後の予定現在、ブログのコンテンツも表示できるようになっていますが、せっかくなのでランチ情報が出せるようにしたいって思っていたり、オートチェックアウト機能を用意したり、何回チェックインしたかをカウントできるような機能を用意したりしてみたいと思います。 Beaconの機器をもう少し増やして、ベースキャンプ名古屋に来て店内をウロウロすると、もっといろいろな案内が出てくるようにしたいですね。名古屋で iBeacon を体験したい人はベースキャンプ名古屋に来てみて下さい。（ビジター利用は2時間600円〜です）

2014年 4月 17日

Chromecast をサイネージに検討してみる

運営堂の森野さんのブログに「Google Analytics Solutions Galleryにセグメントをたくさん追加したらchromecastがもらえた」というのがあったので、これは体験したい！って事で、お願いして持ってきてもらいました。 Chromecast というのは、名前の通り？ Google の開発・販売するデバイスで、TVにHDMI接続し、Wi-Fiでネットワークに接続して、ネット上のコンテンツを見たりする事ができるものです。Apple の Apple TV の安いヤツってところでしょうか。まだ日本国内ではリリースされていないものになります。気になっている点としては、サイネージとしての利用という部分です。それが可能かどうかを調べてみたところ、現状では YouTube を見るくらいにしか使えないなぁってのが感想です。試してみたところでは、iPhone で YouTube を見る事と、MacBook で Chrome の画面を表示させる事でした。もしかすると Android を利用するともう少しアプリでイロイロできるのかもしれません。 $35 の製品であるので Apple TV と比べちゃダメかもしれませんが、今のところは Apple TV の方が便利にイロイロ使えそうです。（ブラウザ以外の画面も共有できますからね） Chromebox も発表されましたこのエントリーを書いてる途中で、Chromeboxでデジタル・サイネージも―Google、Chromebookの成功でChromeboxに力を入れる | TechCrunch Japan という記事が公開されていました。これがあれば、起動時に任意のアプリを起動させる事もできるっぽいので、サイネージ用の本体に活用できそうだ。Chromecast ほど小さくなくてもいいので、こちらが本命かもしれない。手に入れる事ができるようになったら、すぐに購入して試してみるつもりだ。 Apple TV も今年モデルチェンジするらしいこの春に Apple TV もモデルチェンジする事になるらしい。私としては Apple TV に Safari を搭載してくれてブラウザが使えるようになってくれるだけでいい。可能であれば、起動時に任意のアプリを起動しておけると、もっといい！ゲーム機に進化するとか、噂はイロイロあるがブラウザが載るとか、iOSのようにアプリをインストールできるようにするとかして欲しい。 Apple TV を買う時に注意する必要があるのは、HDMIケーブルが入ってない事です。通販で買って届いても使えないで困った事があります。

2014年 2月 15日

そろそろベースキャンプ名古屋にサイネージのデモが出来るようにします

5月頃に「CMSで管理するデジタルサイネージでWeb屋さんが活躍できる場を増やす事を考えてみよう」というエントリーを書いていましたが、予定の場所にTVの設置が済みました。壁に工事してつけるかなぁーって思ってましたが、まずはスタンドを買ってみました。予定していたものを買ったのですが、ちょっと思ってたよりも低くなってしまう事から無理矢理に上の方につけてあります。なので、下の方が少しかっこ悪い感じになってます。その場所に Apple TV と iPad mini を置く場所でも作ろうかなって思ったりもしています。ソフトウェア的に、専用アプリを利用してベースキャンプ名古屋にアクセスするとサイネージ用のテーマが表示されるようになっています。今は a-blog cms で、ロゴが出るだけの top.html を用意してるだけな感じですが、この後は動画を表示させるとどうなるかとか、各コンテンツ毎に表示時間を可変にできるスライダーのJavaScriptの準備とかをする事でカタチになっていくのではないかと思っております。ハードウェア（143,319円）シャープフリースタイルAQUOS 40インチ（59,800円） Apple TV（10,400円）デジタルサイネージ壁寄せスタンド『DSK-46』（40,319円） iPad mini（32,800円）ソフトウェア（52,500円）サーバ側 a-blog cms（52,500円） + サイネージ用テーマクライアント側 a-blog cms for iOS 1.3b（無料）※一般公開前のバージョンです

2013年 9月 7日

CMSで管理するデジタルサイネージでWeb屋さんが活躍できる場を増やす事を考えてみよう

昨日、Facebook に写真をアップして紹介したが、ブログ用に書き直してみたいと思います。弊社（アップルップル）では、自社開発のCMS「a-blog cms」というものを2009年6月にリリースし、そろそろ4年が経とうとしています。何年も前からデジタルサイネージをWeb連動させたいと考えていたのですが、なかなか実現する事ができなかったのですが、そろそろなんとかなりそうな感じです。そろそろ実現できそうな気がしてきた理由は？なぜ、そろそろ実現するのかというと、まずは液晶ディスプレイが随分安くなってきています。価格.comで値段をチェックすると、大きなものを使いたいという事であれば60インチTVが13万円台、23インチの液晶ディスプレイなら軽量で1/10の1.3万円くらいで買う事ができます。 TVは大丈夫ですが、液晶ディスプレイは後で出てきますが、HDMI端子の付いてるヤツを買うようにしましょう。今時なら大丈夫だとは思いますが... 次に自分自身が店舗を持った事で、そういうモノが自分で使いたい！って思った事が大きいんでしょう。昨年秋より「ベースキャンプ名古屋」というコワーキングスペースを運営していて、そこのイベント情報等を店内にいる人に向けて伝えたいという事を考えるようになりました。誰かが使うかもしれないというモノよりも、自分で使うモノを作る方が動機としては強くなるようです。このタイミングでやろうと思ったきっかけは何か？先日、下北沢オープンソースカフェに伺った際に撮った写真が横に掲載しておきましたが、メインの大きな液晶テレビの横にオレンジ色で数枚の液晶が天井から吊るされています。ここでの例をあげると20-22インチくらいの液晶ディスプレイにMac mini等のパソコンが繋がっていて店舗のロゴが出ていたり、料金表が表示されていたりしていました。これいいなぁーって思って帰ってきた事。次に Panic の Status Board という iPad 用のアプリ。 iPad と Apple TV（もしくは Lightning - Digital AVアダプタ）をお持ちであれば、850円で買って体験してみる事をオススメします。繋ぐと、もう1,700円払って16:9の表示がしてみたい！って気になるハズです。2,550円払ってしまいました。ゲームとかで、iPhone や iPad の画面とTVに違う画面を表示させるものがある事は知っていたのですが、実際の iPad で表示させるデジタルサイネージを体験した事は大きかったと思います。キレイなフォントでデジタルサイネージを作りたい！以前からキレイなフォントでデジタルサイネージを作りたいと思っていて、Windows ベースではなく、Mac OS X でヒラギノフォントで表示させる事ができたらいいのに！と思っていました。なので、Mac mini + キーボード + マウス + TV で実現させるという事になります。実際の運用を考えるとワイヤレスにする事もできますが、キーボードとマウスが邪魔だったり、小さいといっても Mac mini 本体もTVの裏に隠せるサイズではありません。この部分が Status Board のおかげで、Mac mini じゃなく iPad でいいんだ！って事に変わりました。この変化は大きかったと思います。この時は、iPad mini + Lightning - Digital AVアダプタ + TV でのテストをしており、このケーブルどうする？ってところを問題にしていましたが、後で AirPlay で大丈夫という事が分かりケーブル問題もクリアする事ができました。 iPad mini の上で Status Board で Webを貼りサイネージとして利用する事を考えてみましたが、残念ながらスライダー等のJavaScriptがあると重くて難しかったが、自社で簡単なテスト用の単機能なWeb Viewを表示させるだけのアプリを作ってみると iPod touch でも大丈夫なところまで確認できました。（今後、コンテンツが重くなっても大丈夫かのテストが必要と考えていますが） iPod touch 24,800円 + Apple TV 8,800円で、デジタルサイネージのリモコンっぽく使う iPod touch が実際にはネットに繋がった配信端末になる事になり、Mac mini にキーボードやマウスのような場所を取る機器を置く必要が無くなりました。今後、動画を出るようにするとか、コンテンツ量が増えた時に、iPod touch で大丈夫かと不安もありますが、まずはこのハードウェアをベースにコンテンツを準備してみようと思っています。 Web とのコンテンツの共用を考える Web制作の仕事としては、パソコン向けのサイトを作り、数年前までは携帯電話を作り、最近ではスマートフォン向けも考えるという事で、ブラウザが表示できるところはWeb制作者の働くスペースになります。最近多いスマホ対策に加え、デジタルサイネージを加える事になります。 CMS でサイネージ専用にコンテンツを作り、そのページを表示させるというのが簡単にできるかもしれませんが、可能であれば1回登録したデータを複数のデバイスに対応した作りになります。1920x1080のディスプレイの時にはサイネージを表示させるとか、デバイスの画面サイズを見てCSSを変更するような手法も可能かもしれませんがPC環境でも同様な事はあり現実的な手法ではありません。弊社の a-blog cms では、UserAgent で簡単にテーマを切り替える事が可能です。今回、iPod touch で利用するサイネージアプリの UserAgent を特殊なものとしておく事でテーマを切り替える事が可能になります。 private/config.system.yaml の ua_label , ua_value , ua_regex , ua_parent の項目を調整する必要があります。きっと次のバージョンでは、ルールで簡単に設定ができるようになっている事でしょう。 iOS用のアプリケーションについて一番簡単に作ると Web View を貼っただけのアプリを作り、できれば User Agent を特殊なものに変更します。これで専用アプリからアクセスがあった事が分かり見せるコンテンツを変更できます。iPhone や iPad だとTVとミラーリングだと残念な感じになってしまいますので、HDMIで接続したり、AirPlayで接続した際に出す画面に別の Web View を用意するようなプログラムを用意する事になります。アップルのサイトに「iOSマルチディスプレイプログラミングガイド」というのがあるので、そちらをご覧下さい。 a-blog cms for iOS に機能を拡張する事で皆さんのところに近日中にアプリを届ける事ができそうなところまで出来てきています。新しいバージョンのリリースをお楽しみに！最後に工事をどうするか悩む一番上の写真のように壁につけたいのですが、石膏ボードに10KgのTVをつけるのは難しいだろうし、壁に穴をあけてコンクリートまで頑丈に工事するか、スタンドを利用する事になるんだろうと思う。カッコイイのは壁に穴をあける（もっといいのはTVを中に入れちゃう）んだろうけど、スタンドかなぁ... しかし、スタンドで4万円とか出すなら、40インチを50インチに出来そうだし、ちょっと悩むところです。デジタルサイネージ壁寄せスタンド『DSK-46』現在のベースキャンプ名古屋の電気工事をお願いしている業者の方に相談して、どれくらいの費用で壁にTVつけられるかも聞いてみようと思います。

2013年 5月 14日

kazumich.log