ifLinkランタンで運ぶ「未来色のあかりパレット」裏側紹介編
皆さん、こんにちは! ifLinkオープンコミュニティ会員の濱@ISEです。
東芝未来科学館、一般公開終了してしまいましたね。
昨年の「ifLinkでリアル謎解き」、今年の「未来色のあかりパレット」と、ifLinkの企画イベントでお世話になってし、スタッフさんとも仲良くなれたのでとても残念です。
若干の喪失感を抱えつつ、今回はifLinkランタンで運ぶ「未来色のあかりパレット」の裏側紹介です。
「未来色のあかりパレット」は、2024年3月23日(土)~2024年6月22日(土)に東芝未来科学館で開催された10周年記念イベントの一部として実施されました。
イベントについては、僕のこの記事を見ていただけるとだいたいわかるかと思います。
今回は、裏側紹介ということで、イベント参加メンバーが試行錯誤して作り上げたifLinkランタンの中を一挙大公開といきましょう!
ランタンの仕組み
早速、ランタンの中身を紐解いていきましょう。
ペーパークラフト
イベントに参加する子どもたちは、最初にみんなで集まって説明を受けた後、ペーパークラフトの台紙にお絵描きします。
僕は絵心が欠片もないので、自分では描かなかったのですが、参加した子どもたちはお絵描きもしっかり楽しんでいました。
で、実はこのペーパークラフトの組み立てがなかなか厄介でして。。。
ツメを折り曲げてスリットにはめて組み立てるのですが、側面は四角で上部は三角、さらには最後に底を閉じないといけなくって小さい子や(僕を含む)不器用な子はちょっと苦戦していたようです。
お絵描きした台紙は、底を広げた状態で、ランタンの台座(僕らは「お盆」って呼んでた)にかぶせて、イベントキャラのシールを貼ったアクリル板で押さえます。
ランタン本体
さて、ここからは電子工作です。
ランタンの本体は、下の写真のように、基盤とLEDテープライトが入っているのですが、せっかくの裏側紹介なので、一つずつバラしていきましょう!
アクリル板を外して、箱(段ボール製)のふたを空けると、こんな感じ。
ランタン本体(アクリル板とLEDテープライト)に、光らせるためのマイコン(ESP32)がつながっています。
運用時は、箱の中にカードタイプのモバイルバッテリーを入れてESP32の電源を確保していました。
ランタン本体とクッション兼滑り止めを取り出すと、回路がよくわかります。
左下の抵抗は関係ない抵抗でして・・・いったいなぜ存在しているのか。(おそらく組み立て時に混入)
では、分解してみましょう。
ランタン骨組み
こちらはとくにいうことはない・・・こともないか。
2枚のアクリル板を直交するようにはめ込むためのスリットが入っています。
はめ込むだけだと安定しないので、直交を保持するための土台(スポンジシート@100均)に挿すようにしました。
足が長いことにも意味がありまして。
ランタンとしてはペーパークラフトの台紙と同じで四角いところから上でよいのですが、お盆の厚みがあるので底上げが必要となるのです。
・・・厚底ブーツかな? もしくはシークレットシューズ?
あとは細かいところで、万が一にでも子どもたちにケガがないように、ちゃんと角が丸くなっています。
注目!
2枚のアクリル板には、計3か所の口が空いていますが、これ、なんだと思います?
アクリル板を2枚組み合わせると、正方形を4分割する形になりますよね。
仕切られた4か所それぞれを異なる色で光らせるわけですが、LEDを4つにわけると電源、制御系も4つ必要になってしまいます。
そこで(僕が)考えたのは、LEDテープライトを蛇腹に折って1本で4か所を光らせる方法です。(ドヤァ)
アクリル板に開けた口を通したLEDテープライトは、1面あたり4+3+4=11個×4面の44個(両端に使わないLEDが1個あるので実際は46個)でした。
実は後で知ったのですが、ESP32はメモリサイズの問題で制御できるLEDの数は60~70個程度が限界のようです。
また、1本で通した結果として、上部でLEDが下向きになったので、台紙をかぶせたときに側面側の光が少しだけ強くなった気がします。
LEDテープライト
今回使ったLEDテープライトは、たしか 60/m のものだったかと思います。なので、だいたい 80cm くらいの長さになっているわけですね。
まぁ、長さはわりとどうでもよく、ここで話したいのは制御系のこと。
ifLinkランタンは、色カードにお盆を乗せると、色カードに設定された色がLEDに反映される仕組みです。
ここで僕たちは、ただLEDが光るだけだと面白くないと考えました。
せっかくだし、色カードを読み取ったらランタンが色を吸い上げるようなイメージでどうか、というアイデアが出たのですね。
議論と施策の結果、色カードを読み取ると、両サイドの下から中央に向かって点灯していく設計となりました。
動画は面倒なのでGIFアニメにしてみましたが、どうでしょう、いい感じに下から上へ向かって光っているかと思います。
で、マイコンとの配線ですが、ケーブルのコネクタ形状の都合でこんな感じ。
ちなみに、これはきれいなケースで、むき出しなのを力技でつないだりしている場合や、グルーガンで接着の場合もあり。
いや~、手作り感満載ですな。
RFIDリーダー
箱の中で、黒いテープに留められていた青い板は「RFID-RC522」と呼ばれるRFIDリーダー(以下、リーダー)です。
スマホのNFCでも読み取ることができるNFCタグをリーダーにかざすと、スマホと同じように読み取ることができます。
子どもたちにリーダーの存在を意識させずにうまく色カード(こっちも後で解説します)を読ませるためには、お盆の中で固定する必要がありました。
また、読み込みの方法が色カードにお盆を乗せるだったため、お盆というか段ボールの厚み+カードの厚みがあっても反応するようにしないといけません。
結果として、お盆の中に仕込んだクッション兼滑り止めにスリットを開けて、リーダーだけは段ボールに直接貼り付けることになりましたとさ。
なお、リーダーの存在を意識させなかった結果、お盆の前後がわからなくなって「読み取れない~」という問題が出たので、リーダー側に黄色いシールが貼られました。。。
赤いLED
構成部品の中に、赤いLEDが入っています。
これ、実はランタンとしては不要な部品なのですが、とても大切な役割を持っています。
このランタン、見てのとおりGUIなんか持っていないし、PCとつながっているわけでもないので、ちゃんと動いているかどうかがわかりません。
そのため、リーダーがちゃんと色カードに反応しているかを確認できるよう、赤いLEDが入っているのです。
色カード
何枚かは手元にあるのですが、これはほんとに手作り。
イベント紹介の記事でも書きましたが、ifLinkオープンコミュニティ内のコミュニティ拡大係がデザインから作成までやってくれました。
色カードのデザインは、モノ・感情・景色などの色をイメージする図柄(上部)と色自体(下部)になっています。
色カード自体は印刷物なので色の三原色、ランタンはLEDなので光の三原色、当然ですが完全に同じ色になるわけではありません。
この色カードを作ったとき、僕はNFCタグに色情報(RGBの値)を書き込むアプリを(コレ用ではなかったのですが)作っていたので書き込み作業をしていました。
4、5人で集まって作業していたのですが、まぁ認識の違いが出るわけですよ。
色カードのデザインと使う色が決まっていて、すべて印刷済のところで色カードづくりが始まったのですが、黒とかグレーが入っていて・・・。
黒:#000000 → すべてゼロだからそもそも光らない
グレー:#CCCCCCなど → すべて同じ値だから白の強弱にしかならない
まぁ、それはソレでありといえばありなので、一部はそのまま設定値の調整だけにしたりね。
はたして子どもたちは色と光の違いに反応していたのかどうか、ちょっと気になるところ。
NFCタグ
色カードの下部の色自体を示しているところにNFCタグが仕込んであり、これをリーダーで読み取っているわけですね。
最初は6桁のRGB値を簡易的に3桁(AABBCC→ABC)にしてお試し。
もちろん、最終的には6桁でフルカラー指定可能にしてますよ。
ランタンで色カードを読み取った後、次の回に回すために毎回ESP32をリセットするのは大変でして。
NFCタグの中に「CLR」とか「SND」(画像ではひっくり返って「ONS」って見えるw)、「DMY」の色以外のタグも用意しています。
「CLR」→リセット用
「SND」→スマホ送信(QRコード変換用)
「DMY」→テスト用
「CLR」:わかる、「SND」:わかる、でも「DMY」って?
実は、ランタンの読み取りシステムは、同じ色を連続して読み取りできないようにしてあります。
色カードの書き込みエラーとかでうまく読み取れないときなど、ちょっとチェックするために都合よく使えるカードとして「DMY」カードを用意したのでした。
まさか、のケースとしては、どうしても同じ色が2か所ほしいって子がいて、「DMY」で連続読み取りをごまかしたこともあったような。
僕の好きな「こんなこともあろうかと」がうまくはまったところですね。
ランタンからスマホへ
東芝未来科学館のフロアを回遊して色を集めてきた子どもたちは、企画展示室に戻ってきます。
企画展示室の一角に、こんな感じでランタン置き場が展開されています。
お盆のキャラと同じキャラの「ifLinkランタンをここにおいてね」用紙の上にランタンを置くわけです。
スマホには、ランタンのような何かが表示されているのですが、所定の位置にランタンが置かれるとこの表示がQRコードに変化します。
ここで、先述の「SND」が関わってくるのですね。
そして、ここにifLinkがねじ込まれているわけです (^_^;)
ランタンとifLink
さて、ランタンとifLinkの関係ですが、見てわかる通り物理的につながっていません。
ではどうやってランタンからスマホに送信しているかというと・・・BLE接続です。
「ifLinkランタンをここにおいてね」用紙には、「SND」が書き込まれたNFCタグが仕込まれています。
リーダーが「SND」タグを読み込むと、ESP32側のBLE(アドバタイジング)接続が実行され、スマホとつながると集めた色のデータが送信されます。
スマホ側では、ifLinkアプリが動作していて、IF:色データを受信すると、THEN:QRコードに変換する、というレシピが動作するわけですね。
・・・ifLinkいるか? と思った方、その通りかもしれませんが、このイベントはifLinkのイベントなのです、お察しくださいm(__)m
このレシピ用のIMSを開発したのは僕なのですが、何気に10台のスマホが一斉にBLE接続を試行する状況は初めてだったので、ちょっと苦戦しました。
最終的に、ESP32とスマホの組み合わせは1対1、ESP32側でのBLE接続は「SND」が読み込まれたときのみとして、BLEでの接続試行・通信は最小限にすることで安定化しました。
いやー、イベント通して動作不良がなくてよかった・・・。
なお、回路の接触不良などで不具合は出た模様。
休みの日に野生のエンジニアとして様子を見に行ったらトラブって、その場で対処したのはいい思い出。
未来のあかり精製装置
ここからは、ifLinkから離れて色塗りタイム。
装置の上に組み立てたランタンを乗せて、画面にタッチ!
画面の指示に従ってスマホに表示されたQRコードをQRコードリーダーにかざすと、装置にランタンで読み取った色が表示されます。
実はここ、本番わりとぎりぎりまで連携できてなくて、QRコードに変換しているJSONのフォーマットがあっていないことになかなか気づけなかったところ。
装置側で調整してもらってちゃんと読めるようになったのは準備の最終日だったような・・・。
謎解きイベントを彷彿とさせるギリギリ感がありました。
装置では、ランタンで持ってきた4色をベースに6色まで好きな色を作成できます。
装置の手前には赤、緑、青の3つの・・・これなんて言えばいいんだ? あ、ダイヤルか。
ダイヤルを回してそれぞれの値を0~255の範囲で好きなように調整するわけですね。
これ、ダイヤル回してる感がすごくて、科学実験っぽくて好きです。
で、6色作ったわけですが、ランタンで運んできた4色とは違う色にしてます。
というのも、この後の塗り絵では運んできた色+作った色の10色を使うことができるからですね。
10周年記念イベントかつifLinkイベントということで、てきとーにお絵描きしてみました。
うーん、わかっちゃいるけどセンスは迷子ですなぁ。
アクセスされても困るのでぼかしておきますが、お絵描きの後は作品を持ち帰る(でいいのか?)ためのQRコードが表示されます。
DropBoxに画像データがいったん送信され、アクセス用URLが発行されて、QRコードに変換されるとのこと。
・・・DropBoxというところにもちょっといろいろありまして。
最初はアカウントがないとダウンロードできないとか、プチトラブルが発生してました。
結局、表示されたQRコードをスマホで撮影してもらって持ち帰ってもらうような形に落ち着いたんだったかな?
で、これは後日気づいたんだけど、ブラウザ版で継続して表示された画像を長押しすると、ダウンロードできたんだよね。
イベント開始前にちゃんとリハーサルができていれば、最初からこの方法をお知らせできたのではないか、とちょっと後悔した僕でした。
装置の中身とか
ダイヤルで色を作っているところ、先の画像ではちょっと分かりづらいかもしれませんが、装置上部に乗せたランタンが作った色で光るようになっています。
ダイヤルをくるくる回すと、画面上の電球の色とランタンの光が連動するの、なかなか面白い仕掛け。
神奈川工科大学の鈴木先生(すいません、先生だけお名前出します)謹製のこの装置、内側はこんな感じになってました。
こうしてみると、なんてことはないWindows PCが1台とダイヤル、LEDにつながる回路だけなのです。
アルミフレームとMDFで作られた筐体がしっかりとしているので、実は中は結構スカスカということに驚き、というは置き方が結構雑なことに驚き。
塗り絵用のお絵描きソフトも、やはり神奈川工科大学の鈴木先生謹製で、Unityを使って実装されているそうです。
Unityかぁ・・・ちょっと3DというかVRだったかARだったかをやろうとして触っただけだなぁ。
あとは、よくゲームで使われていて、ブラウザゲームだと実は結構内部エラーが出てたりとか(ブラウザのデバッガでみるとよくわかる)。
塗り絵
塗り絵の線画は全部で16種類あって、ぱっと見ではわからないのですが、マンモス電球のキャラがちょっとずつ違うポーズをとっています。
で、これを1枚ずつ切り替えていくと、キャラが動いている動画になるわけですね。
子どもたちの作品を使うわけにもいかないので、もとの線画だけでアニメーションGIFにしてみました。
単に手足を交互に上げ下げしているわけですが、イベント中は子どもたちが色付けした塗り絵で彩られてなかなか見応えのあるアニメーションになっていました。
いやー、子どもたちの個性が光ってました!
QRコード
QRコードといえばデンソーウェーブさんの登録商標であり、特許技術なわけですが。
Wikiにもあるように、この特許はオープン化されているため、僕たちのイベントでも大いに活用させてもらいました。
ifLinkもいつかはこのレベルでオープンになるのかなぁ・・・。
メタバース
spatial.ioのメタバース空間に、イベントの作品展示室を作りました。
このメタバース空間、なんと無料で作れるんですよ!
まぁ当然、一つのエリアにおけるオブジェクトの数とかに制限はあるのですが。
で、ゲストとして入る分には、ブラウザもしくはスマホアプリがあればOKで、URLさえわかれば簡単にアクセスできちゃう。
これもイベント紹介記事で書いてますが、イベント開始前最後の作業日の夕方に、突貫で用意することになって2時間ちょっとで作ったわけです。
すると、こんなミスもするわけですね。
オブジェクトを配置していじくりまわしてたら操作できる領域外に出てしまって、二度と触れないオブジェクトになってしまいました。
これはたぶん5分くらいで作った案内パネル。
美術館とかにある順路案内をイメージしたんだけど、てきとーもいいところだね。
展示室からはポータルを通って、みんなの作品が展示してあるルームに移動するんだけど、ここがまた悩みどころだったんだよね。
オブジェクト数の制限で、ルーム内に1日分の全作品を置くことができなくて、午前と午後に分けたんだけど、そうすると絶対数が少なくて展示してる感が薄くなっちゃう。
というわけで、急遽パワーポイントで動画を作って展示することに。
こんな感じで、動画とイラストをアップロードしてみるといい感じ!
ちなみに、ルームが青いのは仕様で、無料枠で使えるルームはたしか6色の基本色になっていたはず。
学会発表
2024年5月29日に愛知工業大学本山キャンパスで実施された、情報処理学会デジタルコンテンツクリエーション研究会(DCC研究会)の第37回デジタルコンテンツクリエーション研究発表会で、
神奈川工科大学の鈴木先生が「ifLinkランタンで運ぶ未来色のあかりパレット: あかりをテーマとしたIoTコンテンツの開発と実践」というタイトルで学会発表しました。
そして、なんとDCC研究会の優秀賞を受賞しました!ありがたいことに、僕の名前も入れていただいています。
さいごに
ほんとにたまたまではあるものの、東芝未来科学館の最後を飾るイベントに参加できたのは光栄なこと。
急に呼び出しくらって、企画のアイデア出しから参加したので、無事に終わってほっとしました。
さて、イベントの裏側どうだったでしょうか。
ほんとは準備期間にもっといろいろとあんなことやこんなこともあったし、試作と本番で違うものもあったし、ではあるのですが、さすがに書ききれません。
そうそう、ランタンの仕組みなんですが、早い時期に参加された子ども(たぶん小学校低学年)がひとりだけ中の仕組みに興味を持ってくれました。
君は未来のエンジニアかな? と思いながらお盆の中を見せてあげたことを覚えています。
今後も、ifLinkをきっかけに電子工作とかIoTの仕組みに興味を持ってもらえることが増えるといいですね。
ifLinkオープンコミュニティについて
ISEのifLinkオープンコミュニティでの活動についてはこちらから
<本イベントの協力コミュニティ会員>(順不同、敬称略)
学校法人岩崎学園
神奈川工科大学 情報学部 情報メディア学科
株式会社Cosmoway
株式会社 情報システムエンジニアリング
株式会社ダーツライブ
株式会社デンソーウェーブ
東芝ITコントロールシステム株式会社
東芝エレベータ株式会社
株式会社プライムアシスタンス
NEUSOFT Japan株式会社
和歌山県工業技術センター ものづくり支援部
ワゴジャパン株式会社
おまけ
イベント最終日(2024/06/22)にせっかくだからと東芝未来科学館まで行ってきました。
入ってすぐのところに置かれていたパネルに、どこかで見たことのあるキャラが。
そう、謎解きイベントのときに頑張ってくれた2人ですね。
その謎解きイベントですが、しっかりと東芝未来科学館の歴史に刻まれていました。
もちろん、今回のifLinkランタンも、刻まれていましたよ。
というわけで、近隣の住民(もちろん、それ以外の方々も)にとってはとても惜しい東芝未来科学館の一般公開終了でした。
#ifLinkオープンコミュニティ #未来色のあかりパレット #東芝未来科学館 #マンモス電球 #ランタン #塗り絵 #ペーパークラフト #メタバース #Spatial