11
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

IoTLTAdvent Calendar 2018

Day 5

メガネをオンライン化して光らせる

Last updated at Posted at 2018-12-04

IoTLT Advent Calendar 2018の5日目の記事です

IoTLTで何度か身につけて喋ってる光るメガネの詳細の話をしたいと思います。

どんなものか

View this post on Instagram

登壇者メガネを全部これにしたいな笑 #iotlt

n0bisukeさん(@n0bisuke)がシェアした投稿 - 2018年10月月22日午前4時05分PDT

上のリンク先の動画を見てもらえればと思いますが、メガネが光ります。光り方をweb上から操作することができます

最大輝度にすると目からビーム!って感じになります

もうちょっとおとなしい説明動画はこちら
hqdefault.jpg
※クリックでyoutubeに飛びます

ソースコードはこちらで公開しています

なぜ作ったのか

IoTLTでは登壇した人にメガネを掛けてもらって、懇親会のときに誰が登壇したかわかるようになってます。

それの説明で毎回こんな会話を聞くんですね

「IoTLTでは登壇者にメガネをかけてもらいます」
「この眼鏡はLEDが入ってIoTっぽい」

あれ、IoTのIってなんだったっけ?? となったので、Iの入った光るメガネを作りました。

システム構成

インターネット要素をどう入れようかなと思ったのですが、どうせならユーザー参加型のコンテンツを作りたいなと思ってたこともあり、ぽちぽちとボタンを押したら色が変わるようにしようと思いました。

となると、インターフェースをwebでつくって、サーバー立てて、そこでユーザーのコマンド受信して、それをマイコンに送って、マイコンが色を変えて・・・とたくさんあってめんどくさかったので、検索して3秒で見つけたnode.jsチャットシステムobnizをつかって楽をしてます。

スクリーンショット 2018-11-29 15.33.20.png

右側がチャットシステムで、ほぼそのまま使ってます。
そのチャットシステムのnode.js内で、特定のキーワードが出てきたらobnizに色を変えてねコマンドを送って、色を変えてます。

工夫点

此処から先は登壇時に話せてない部分です。
メガネを作るにあたって、いくつか工夫しています

  • node.jsでglassesとchatのコードを分けてます
  • ただのチャットだと反応があったかわからないので、サーバー側でレスポンスを追加してます
  • チャット上のコマンドもポチッとワンクリックで押せるようにボタンを追加してます
  • 見た目も重要なので、配線がぐちゃぐちゃにならないようにLEDの系統を2系統に分けてます

ひとつひとつ話したいと思います

それぞれの工夫点詳細

  • node.jsでglassesとchatのコードを分けてます

公開しているソースコードを読んでもらえばわかりますが、glassesクラスを作ってます。つまり何が言いたいかと言うと、再利用ができるんです。

チャットから動く光るメガネ以外にも、もうすぐ登壇だよ!ってお知らせするメガネとか、#iotltのツイートに反応するメガネとか、そんなのも作れます(やるかどうかは未定)

  • ただのチャットだと反応があったかわからないので、サーバー側でレスポンスを追加してます
  • チャット上のコマンドもポチッとワンクリックで押せるようにボタンを追加してます

この2つはweb上のUIの工夫ですね.

IMG_1137.PNG

色変えるボタンを押しても変えたどうかってよくわからないじゃないですか。
こんな感じで、サーバーからのレスポンスを赤色にするようにしてます。

中身はとっても簡単で、 「###obniz###」がメッセージの中に入ってたらそれはサーバーのメッセージと言う決めをして行ってます。

また、ワンクリックボタンですが、フロントのjsでボタンを押したら特定の内容をpostするコードを書いています。
なのでこのボタン以外でもふつーにチャットとして使ってもらって、その中でキーワードが出てきたら反応する ということもできます。

  • 見た目も重要なので、配線がぐちゃぐちゃにならないようにLEDの系統を2系統に分けてます
    今回使ったのはWS2812というLEDモジュールで、これは複数個あれば延長できるんですね。

なので頑張ればこの図のように4ピンしか使わずに全部つなぐことができます。

名称未設定.png

でもちょっとこれだと配線が汚くなるので、見た目重視でピンを贅沢に使って2系統でやってます
名称未設定2.png

## 課題点・今後

何度か登壇してわかったのですが、何よりもの問題はかけてる本人は色が変わってるかどうかわからないですね。
ちゃんと動作してるか毎回ヒヤヒヤしながら登壇してます笑

あとは大人数が同時にアクセスすると、それでも動作するのはすごいんですが、誰が操作したのか良くわからない問題もあります。

みんなに"obniz使ってる人ー?"って聞く代わりに、web上のアンケートにして、眼鏡でアンケート結果を表示みないなこととかすると楽しいかも?と企んでます

11
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
11
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?