女子チームでハッカソン参戦! Yahoo! JAPAN さんのHACK DAY2016に参加してきた

女子チームでハッカソン参戦! Yahoo! JAPAN さんのHACK DAY2016に参加してきた

ヤフーさんのHACKDAY2016に参加してきた!

いつもポケットがなくっちゃはじまらないっ!でポケットまわりのハックをしている私達(いけざわとやじま)ですが、今回はヤフーさんのHACKDAYというハッカソンに参加することとなり、ヤフーのmyThingsエバンジェリストの水田千惠さん、とってもわかりやすいラズパイ入門ブログを書かれているアスラテック株式会社の加藤恵美(かとえみ)さんと「ポケはじ+」という4人チームを結成して24時間の開発に挑みました!

左からかとえみさん、やじま、池澤、水田さん

左からかとえみさん、やじま、池澤、水田さん

当日の様子はすでに池澤が週間アスキー池澤あやかの自由研究:バレンタインデーの24時間ハッカソンにチャレンジ!で書いていますので、こちらではやじまが技術てきな観点で苦労したことなどを書いていきたいと思います…!

インスタバッジをつくる!

今回24時間以内で開発に挑戦したのは、『Instagramの写真を表示するバッジ』です。事前に4人でお茶を飲みながらアイディア出しをしたのですが、「インスタの写真ておしゃれなものが多いし、身につけられたらいいよね!」と盛り上がったのでした。

ということで、HACKDAY当日までになんとなーく使いそうなものを買い物しておいたのですが、開発は24時間以内ということで、本当に出来あがるかどうか未知数のまま、いろいろな部品を持って集まりました。

はじめに、システムの設計を整理します。当初はこんな風に、myThingsとIDCFクラウドを使ってこんな風に画像を変えられないかな〜?と考えていました。

そこで、arduinoからOLEDで画像を表示させるところ・クラウドに画像を持たせるところ・パスをarduinoに送るところなど、別々に実現可能性があるのかどうか検証していく必要があります。

OLEDディスプレイを触ってみる

まずarduinoからOLED(有機ELディスプレイ)で画像を表示させるのですが、これが意外と苦戦する部分だったのです。
今回試したのはこちらのディスプレイ2種です。
小型OLEDモジュール1.5インチ(μOLED-128-G2)
1.5インチ 16ビット色のOLEDディスプレイ(microSDスロット付き)

①は「ファームウェアの書き換えで、シリアル接続したArduinoなどのマイコンからコマンドを与えてグラフィックを描画させる事も可能です。」という表記があったのと、正方形ディスプレイということで選定しました。
②も正方形ディスプレイであるのと、Adafruit社製でチュートリアルが丁寧に書かれているので選びました。

ですが、結果から言うと①では画像を表示することができませんでした…ファームは書き換えられたのですが、なぜか画面は黒いまま。ここで1時間以上はロスしました。(時間が限られたハッカソンはこういう下準備が大事だということを痛烈に思い知りました。)

②のディスプレイではAdafruitのLearnページに沿って進めると無事にピクセル操作をして画像を表示できました。

Arduinoボードの選定

ディスプレイの検証とは別にArduinoボードも何を使うかという検証を同時に行っていました。今回第一候補にあがっていたのはESP-WROOM-02開発ボードです。Arduinoの開発環境で使えること・無線で書込ができること、myThingsとの連携実績があることなどが選定理由でした。

これをArduino IDEで使えるようにする設定や、無線で書込みをする環境なども整えました。(これも事前にやっておけばよかった気がする…)

ですが、いざこのボードとAdafruitのOLEDを接続してみたら、まっっっったく光らない!OLEDディスプレイのほうがこのボードには対応していなかったようです…(ここでも1時間以上つかってしまった。)
Adafruitさんが配布しているライブラリの中身をよーく見てボードに関する部分を変更すればできるのかもしれませんが…なんせ私達には時間がない。。

ということで、無線で画像を送るということはここですっぱり諦めました!

ArduinoボードはUNOではバッジには大きいのでpro miniにしました。

無線問題はSDカードで解決!

画像を送ることができないので、あらかじめ画像が読み込まれていないといけません。
そこで、ちょっと方向転換をして、画像はSDカードに入れることに。AdafruitのOLEDボードは裏にSDカードポートがついており、128*128のBitmap画像を表示することができます。そして、SDカードに自動でインスタから画像を取ってこれるようにしよう!ということになりました。

毎朝洋服を着るついでに、その日の洋服や気分にあったキーワード(ハッシュタグ)を検索して、SDカードに今日持ち運ぶインスタ画像を入れよう!という感じです。

ここはrubyが得意な池澤の腕の見せどころ!

こんな感じのプログラムを夜食のおにぎりを片手にせっせとつくっていました。

深夜のはんだづけ

やじまはやっと選定の終わったハードウェアをユニバーサル基板上に実装していく作業。
以下がはんだづけの際に実際に参考にしていた写真。(お見苦しいですが、深夜の臨場感です。)

左がArduinoのピン番号、右がOLEDのピン番号でつなげて配線していきます。

配線できたところ。写真によると時刻は0時35分。よい子はあまり真似しないほうがいい深夜のはんだづけですね。


しかし、、、ユニバーサル基板上でSDカード再生用のプログラムをArduinoに書き込んでみたところ、なぜかディスプレイに表示されない!!!泣

ここでうんうん考えあぐねたり調べたりした結果、SDカードからBitmap画像を表示させるための配線は上記のものと違うことが判明…初歩的なミスといえばそうだけど、なぜ同じ配線じゃないのか…(再度現場感漂う画像をお届けします↓)

はんだづけをし直します。せっかくなのでフルカラーLEDも追加。なぜLEDを追加したかと言うと、そこにあったから。深夜の気分です。LEDは表示している画像から抽出した色に光ります。

配線できあがり。写真によると5時40分。もう夜明けですね。

この後LED部分につけるリボンをつけたり、ブローチ金具をつけたり、ブローチとしてつけられるように手芸とデコレーションをしていきました。


そして、、、、、ついに完成!!!!!!!!!!!
できあがったものがこちらです。

https://youtu.be/h3uknsEIxsQ

発表会でのプレゼンの様子はこちら。

https://youtu.be/LJK7B1iAP6U

ここでは紹介しきれない詰まったポイントもたくさんありましたが、なんとか初の24時間開発で完成までこぎつけることができてよかったです。

ハッカソンに参加したことのある人もない人も、開発中の空気を少しでも感じていただければ幸いです。今回は女性4人チームだったので、「紅茶を飲みながら〜」とか、「夜はスパにいってリフレッシュしよう!」などと言っていたのですが、ご覧の通りの結果になってしまいました。いつかそんなハッカソンがしたい!ということで、ここまで読んでいただきありがとうございました。

参考にしてくれた記事

記事が登録されていません。
この記事を参考にして、新しく記事を投稿しよう!

違反について