OpenHackday3で「イルミなふだ」をつくりました

なにそれ?


光る名札です。

解決したい問題

  • 勉強会、懇親会などで
  • 自分と興味が近い人がどのひとか、わからない！
  • SNS上のあの人は、リアルではどんなひとなのかわからない！

解決方法

  • スマートフォンでカテゴリをタップすると、そのカテゴリに属する人の「名札が光る」！





メンバーと分担

エンジニア2人とデザイナー2人 計4人

  • エンジニア1
    • @ina_ani (自分）
    • ハードウェア全般
      • mbed HRM1017をkonashiっぽく使えるようにする
      • 回路設計・実装
    • 全体管理
      • 役割分担とか、プロダクトの方向の調整
  • エンジニア2
    • @kuidaoring (チーム内では「しか」の愛称で呼ばれています ※アイコンはトナカイとのこと）
    • 開発環境整備
      • git環境整備（github<->C4SA)
    • フロントエンド全般
      • C4SA上にページを作成
      • UI結合
      • polymer.js導入
    • 工作補助
      • アクリルを切る（with アクリルカッター）
    • 発表の流れを作成
  • デザイナー1
    • なにげにいいだしっぺ
    • コンセプトからビジュアルデザインまで
    • プレゼン資料のテンプレートを作成
    • 工作の品質チェック
  • デザイナー2
    • @Yeshi_main
    • ウェブデザイン
    • ビジュアルデザインを受け取ってHTML、CSSでコーディング
    • 工作補助
      • アクリルを切る（with アクリルカッター）

わりと4人ともフル稼働でした

使用技術

  • ハードウェア
    • Bluetooth Low Energy
    • mbed (HRM1017)
    • konashi（の仕様）
  • フロント
    • polymer.js
    • mikcocoka.js(WebSocket)
    • konashi.js
  • 物理
    • アクリル板

アーキテクチャ



内部の写真





アプリのスクリーンショット






開発の流れ

  • 事前
    • ちょいちょい集まって何をやろうか話す
    • BLEがやりたかったので HRM1017を買う
    • 書き込み器を買い忘れたのでTSUBOLinkIIを買う
    • 技術検証がてらすこしHRM1017で遊ぶ（UUIDを変えたりしただけｗ）
    • 100均を物色する
  • HackDay開発
    • 1日目
      • 3時間くらいブレスト
      • 買い出し
      • iPhoneとHRM1017を上手く制御できるか調整
      • konashi.jsを使ってみる（アプリ作るの得意な人が居なかったので、これにかなり救われました）
      • Milkcocoaを使ってみる（今回初めて使った 便利！）
      • C4SAを使ってみる（割といつも使っている）
      • 画面遷移、簡単な画面
      • アクリルを切ってみる
  • 深夜
    • 帰宅してハンダ付け、仮眠（僕）
    • 会場に残って、画面の遷移などを実装（エンジニア2,デザイナー1）
      • polymer.jsに手を付ける
      • プレゼン資料叩き作成
      • プレゼン用背景画像などを作成
    • 一旦帰宅（デザイナー2）
    • 2日目
      • 結合
      • 残りのアクリルを切る
      • プレゼン資料最終確認
      • プレゼンの流れ確認
      • 画面をいい感じにしていく
    • 発表
      • 発表する
    • 打ち上げ
      • ぼんやりした頭で打ち上げ
  • 開発秘話
    • プロダクト名を決めようとした時に「tofu on fire」という案が出て、しばらくその名前で呼んでいた。リポジトリ名もtofu-on-fireだった
  • 開発中の疑問
    • BLEでデバイス名をちょこちょこ変えていたのですが、 一度iphone6で読み込むと、どんなに後からデバイス名を変えても、一度覚えたもので表示されてしまいました。なんで？

感想

今回自分がやりたかったBLEが使えたのがまずは良かった。
プロダクト的には無難なところ過ぎたので、インパクトが弱かったかなぁ、、 なんて思ったりもしましたが、、 個人的には作りたかったものが出来て満足です。
あと、流れで、全体の進捗管理みたいなことをやってたので、滞りなく最後まで作りきれたということも良かったと思いました。

Milkcocoaやpolymerを使うことで、サーバサイドの実装を作る必要がなくなり、フロントのコードはとても単純なものとなりました。 またハードウェア部分もkonashiを利用することで、とても単純な記述で作ることが出来ました。 いやー どんどん簡単になっていくなぁ

一方で、LEDを8個光らせるために、トランジスタを使ったり、ブレッドボードでは流石に大きすぎるので、基板にハンダ付けしよう みたいなところは電子工作の基本の「キ」ではあるものの、まだまだ敷居が高いんだろうなぁと感じました。

他のチームの発表を見た感想としては、IoTってきてるなー と思いました。
まぁ今回の協賛企業の選定などから明らかに「おまえらIoTでなにかやれよ！」みたいな運営側からのメッセージみたいなものは感じたものの、Web業界の人がさっと電子工作的なものづくりが出来るようになっている現状は、やはりなにかが起きようとしているのではないか？と思わざるを得ませんでした。

でも、やっぱりまだキラーなアプリというか、そういうものは見つからず、今回出てきたアイデアの育っていった先として、何かができるのかなー それともIoTってのは騒がれてるだけで、言うほど何も変わらないのかなー とおもったり、、 などなどと考える良い機会となりました。