LINE Things Mini Award ハッカソン東京に参加してきました

少し前の話になってしまいますが、[LINE Things Mini Award ハッカソン東京](https://linedev.connpass.com/event/140088/)に参加してきました。ハッカソンというものに初めて参加しました。

Line thingsとは、LINEを介してチャネルとBluetooth対応デバイスを連携し、操作を可能にするIoTプラットフォームで、Line payなどの様々なapiからbluetoothを経由して色々なデバイスと接続してサービスを提供することを目指しているそうです。
今のところはLineさえインストールしておけば、Line PayなどLineに付随する様々なサービスと連携できるようです。

作成は大まかに以下のようなスケジュールで行われました。各工程でどんなことが行われてきたか簡単に紹介していきます。

## タイムスケジュール🗓
####1日目
|**time**|  **contents**  |
|:-----:|:------------------:|	
|10:00|	オープニング<br>テーマ賞インプット<br>テクニカルサポートインプット|
|11:00|アイデアソン・チームビルディング|
|12:30|	ランチ
|14:00|	アイデア発表
|14:30|	ハッキングスタート
|20:00|１日目終了
####2日目
|**time**|  **contents**  |
|:-----:|:------------------:|	
|10:00|	作品情報入力、ハッキングタイム
|12:00|	ランチ
|14:30|	作業終了
|15:00|	各作品プレゼン
|16:30|タッチ＆トライ
|17:00	|懇親会
|18:00	|終了|


## 1日目 11:00 アイデアソン・チームビルディング🌇

最初はブレインストーミングということで、みんなでLine thingsを用いてやってみたいことを一斉にgoogleスプレッドシートにアイデア出しし、その中で自分でやってみたいなと思ったアイデアを見つける作業でした。
私はこういうアイデアを出したのですが、二日間内にやりきる見込みができずに自ら却下しました。

```
・自販機などで商品を購入すると一時的なトークンを発行して、その間は購入者に対して特別な宣伝やメッセージを発行する
・購入者もそのタイアップした芸能人などに一時的にメッセージを送ることができる
・購入した人だけが特別なスタンプを受け取れる
・個人販売の商品でも地下アイドルなどと提携することで、販売を伸ばすことができそう
・etc...
```

アイデア出しのあとはチームビルディングということで、実現したいアイデアを一枚ペラにまとめて、一人一人にアピールして廻るということをしました。自分のアイデア、もしくは自分以外の誰かのアイデアでやってみたいアイデアがあった場合、合意を得てチームとしてハッキング(アプリ開発)を開始します。


## 1日目 12:00 ランチ🍱

ハッカソンではお弁当も支給されました。ロハで出てくるとは思わなかった。Lineさんは太っ腹です。それでもみんなお弁当を食べながらこの先作るものを決めていく作業に入っていきます。

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/244490/11fccb29-9fce-037b-fb49-9f6347fba166.jpeg" width=50%>

食べるのもそこそこにプロットを書き出していく様子。
<img width="400" alt="IMG_1675_JPG.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/244490/5bc01eb0-004b-77a0-c8d1-77ca6923708d.png">

## 1日目 14:00 ~ 2日目 14:30 ハッキングスタート🛠

LineとBluetooth接続するデバイスにはm5-stickというこちらをお借りしました。界隈では結構な人気のデバイスだそうで、親指ほどの大きさしかないですができることは様々です。

**m5-stick**
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/244490/3075c3db-0585-b9e7-aca3-e2f027d99aa7.jpeg" width=40%>

他にもM5Stack Grayというものや、LINE Things development boardというものなどを
ご自身で準備されている方もいらしてました。私のようにあまり詳しくない方には[M5Stackでできること10選!! ](https://goworkship.com/magazine/what_can_m5stack_do/)
というサイトでどんなことができるのか簡単にご紹介されていますのでご参考まで。

**M5Stack Gray**
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/244490/056a480d-388c-c60d-c83f-125ef0c4c0f9.jpeg" width=40%>

組み込みの流れとしては大体以下のような感じです。参考で紹介しているサイト様に詳細な設定方法が掲載されているので、ここではつまずきやすいポイントを挙げていきます。

- [arduino](https://www.arduino.cc/en/main/software)インストール
- デバイス書き込み用の [コード](https://github.com/line/line-things-starter) ダウンロード
 
- ここでm5-stack用のを特に使用する
 <img width="912" alt="スクリーンショット 2019-08-29 6.07.27.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/244490/c5954fa0-9dfa-965c-b0ba-47384fe07ec8.png">
- UUIDを書き直す
- 焼き込む
m5-stickに書き出す際 準備されていたUSBケーブルがUSB typeAとCの口のものだったので、さらに変換アダプタが別途必要でした。これが後述する接続不良の不安を助長しました。

m5-stickを書き換える場合は、サンプルコードの`line-things-starter/m5stick-c/arduino/sample/sample.ino` の以下UUID部分を編集すればいいです。

```javascript:sample.ino

// User service UUID: Change this to your generated service UUID
#define USER_SERVICE_UUID "91E4E176-D0B9-464D-9FE4-52EE3E9F1552"  ← ここを書き換える
// User service characteristics
#define WRITE_CHARACTERISTIC_UUID "E9062E71-9E62-4BC6-B0D3-35CDCD9B027B"
#define NOTIFY_CHARACTERISTIC_UUID "62FBD229-6EDD-4D1A-B554-5C4E1BB29169"

// PSDI Service UUID: Fixed value for Developer Trial
#define PSDI_SERVICE_UUID "E625601E-9E55-4597-A598-76018A0D293D"
#define PSDI_CHARACTERISTIC_UUID "26E2B12B-85F0-4F3F-9FDD-91D114270E6E"

```

普通のアプリは内部にステータスを保持する作りになっていますが、m5-stickのボタンを押した分だけカウントするみたいな単純な実装であればLIFF appだけで実装が完結します。便利ですね。

#### トラブル
私はバックエンド側の開発を担当したのですが、bluetoothとの連携がだんだんレスポンスを返さなくなってきました。USBの接続も不安でデバイスに書き込めたり書き込めなかったりしてUUID以外の部分も編集したりなど色々試しました。あとでわかったのですが、その当時連続してbotに対して通知を送ると一時的に送信を返さなくなる問題があって、それが自分の所為だと思ってだいぶ時間取られました。

という訳で、残念ですがバックエンドの実装が間に合わず、liff appだけの挙動で動かすこととなってしまいました。

## 2日目 15:00 各作品プレゼン🎁

発表は、[protopedia](https://protopedia.net/)というサイトにアップして皆様に成果を評価して頂くという形をとりました。このサイトも初めて知りました。

**ProtoPedia**
<img width="1080" alt="スクリーンショット 2019-09-01 6.41.46.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/244490/1bcfc855-2a79-2946-3433-e53a37f96ce2.png">

概要をササッとgoogleスライドで作成し、作成したプロダクトの概要や動いている動画をアップし、発表の準備を整えるのに1時間。とりあえず動くものをすぐに見せるというスタイルが根付いてきたので、こういったサイトがあるのでしょう。

今回のハッカソンに事前に用意している人の中にはデバイスを用いてかなり意欲的なことに挑戦されている方も何人かいらして、私から紹介するのも何なのでぜひサイトをご覧になって頂ければと思います。


## 2日目 16:30 タッチ＆トライ　そして投票🗳️

最後にハッカソンで作成した作品に投票して最も得票の多かったアイデアをオーディエンス賞、そして審査員によるLINE特別賞を決めます。賞としてデバイスが進呈されました。私たちがどうなったのかは秘密です。
<img width="929" alt="linethingsハッカソンアイデアシート_-_Google_スプレッドシート.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/244490/c939c226-e7fa-652e-9dae-721f72d8eb09.png">


## 2日目 18:00 終了🎆

最後は記念撮影で締め。そのあとは折良く花火が上がり有終の美を締めくくりました。
というのはうそで、本当はこれは１日目の花火なのですがそういうことにしておいてください。
Lineさんのフロアから観た花火。~~きたねえ花火だ。~~私の撮り方が下手くそだったのでいまいち良く撮れていませんでした。お疲れ様でした。

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/244490/ae5bff2a-c151-1b0c-51ee-4e36468afbd8.jpeg" width=50%>

# 参考

大変お世話になりました。

[LINE Things Messageを使ってみよう](https://qiita.com/n0bisuke/items/7f3da133a2363b549e3e)
[LINE Things と LINE BOT をイイ感じで連携するには]
(https://qiita.com/hktechno/items/17dedb8eb2a9dc2a3055)
[LINE Things 自動通信機能 ハンズオン]
(https://qiita.com/hktechno/items/12781e38b09e10c20da2)
[LINE Things dev board使用ハンズオン]
(https://qiita.com/cpulabs/items/3a37a70cfa41129cb024)