フェリーハッカソン行ってきたよ

[Code for Osaka](https://www.facebook.com/groups/code4osaka) 主催で「[フェリーハッカソン](http://code4.osaka/ferry-hack/)」が開催され、参加してきたのでレポートしたいと思います。まずすごいところは、[株式会社フェリーさんふらわあ](http://www.ferry-sunflower.co.jp/)全面協力で実施されています。フェリーでハッカソンというと一瞬意味が分かりませんが、文字通りフェリー船上でフェリーについてのハッカソンをするイベントです。

```
船旅を楽しくするツール・サービスを考えよ！

今までにない新しい船旅を創造する

船旅が新幹線・飛行機の移動よりも楽しくなるサービス
フェリーに乗りたくなるモノやサービス
一人旅をもっと楽しく、旅先の不安を解消できるモノやサービス
ひと味違う素敵な船旅・思い出を体験できる斬新なサービスを考えましょう!
```
もう少し丁寧に説明すると、フェリーさんふらわあのツアーパック「[弾丸フェリー](http://www.ferry-sunflower.co.jp/lp/dangan/walk/index.html)」を題材にハッカソンを行うというものです。1. ハッカソンを夜通しやって 2. 別府温泉でリフレッシュしつつ 3. 再びハッカソンを夜通し行う、という[過酷な](https://togetter.com/li/1178296)イベントです。

「大阪港開港150年記念イベント」として立派な感じになってます。[協賛](http://code4.osaka/ferry-hack/#partner)を見ると、大変な調整をしたのであろうことがうかがえます。

Cloud funding も実施されていて、[Polca](https://polca.jp/projects/JdrQkigcnw5) という立ち上げ間もないプラットフォームが使われたりもしていました。

## シビックテック

フェリーハッカソンが何でシビックテックなの？という疑問に素直に答えるとするなら、企画した当人に語ってもらわないと分からないのですが、きっと「面白そうだったから」と答えるような気がします。それはそれとして。

「シビックテック」という言葉の解釈が今は沢山あるように思えます。文字通り「市民（シビック）」＋「テック」なのですが、私の理解では「市民」は「一般市民」で、「普通の人が普通に生活するのに、テックを使って豊かになること」です。「みんなのテック」ぐらいの意味。もっと言うと Quality of Life 向上をテックで目指す活動だと思っています。市民というと、生活と切り離せない行政を持ち出してしまいがちですが、別に行政を持ち出さなくったって、市民は市民なのですし、生活にかかわるものは他にも沢山あります。

シビックハックで行政の話を持ち出すと、どうしても仕事の仕方に光が当たりがちです。「市民ユーザ目線でのサービス設計」が重要で、今現在行政ではそれができていないから、仕組みを変えたりしないとダメだ、という話の展開です。理屈はわかるのですけれど、それは行政の仕事を変える話であって、軸足が市民側には無い話にも思えるのです。もっと単純に、市民それぞれが自分のやりたいことを追求すればいいと思います。

行政関連のシビックテックが多い中、そういう意味においても、今回のフェリーハッカソンは異色です。とっても素敵だと思います。フェリーでテック、いいじゃないですか。

今回はファミリー同行可だったのも良かったです。家族の時間を持とうと思うと、どうしても土日になってしまいますが、ハッカソンで土日を持っていかれるプランだと参加しづらいです。久しぶりにハッカソン参加しました。

## イベントの流れ

最初は大阪 ATC にある iMedio（第三セクター）の会議室で参加登録を行なって集合します。開催の挨拶などがあった後に、フェリーに搭乗。

![IMG_4279.png](https://qiita-image-store.s3.amazonaws.com/0/41883/c6be7d27-a02f-d336-6f3c-d3537685dff4.png)

部屋割りはチーム毎に割り付ける予定だったようで、最初大部屋に全ての荷物がごった返しに入ってえらいことに…。船内レストラン営業終了後のスペースがイベント会場になるので、しばらく自由時間。

その間、ライトアップされた明石海峡大橋の下をくぐったり、ご飯を食べたりお風呂に入ったりしながら過ごします。

![IMG_4289.png](https://qiita-image-store.s3.amazonaws.com/0/41883/43d04460-de34-ac42-fee6-fefb63f3d19e.png)


レストラン営業終了後、イベント開始。まずは「フェリーさんふらわあ」の現状の課題認識、大阪港の課題などのインプットがありました。その後課題やアイディアなどを書き出す作業をして、簡単な投票をします。上位残ったものを中心にして組わけを行います。

今回は私は最後まで、どこに参加するか放浪することになりましたが、船の電波状況をモニタリングするテーマの組に入りました。

## 設備

フェリーは世代によっても印象が全く異なるんだそうです。昔は雑魚寝で山小屋風のイメージが強い感じですが、今は大部屋もある一方で個室もあるし、ずいぶん綺麗です。さんふらわあは大きな船なので揺れも思ったほど大きくありません。推測ですが、フェリー一般的に航路によっても違うのかもしれません。さんふらわあは快適でした。

今回乗船したのは [SUNFLOWER IVORY](https://www.marinetraffic.com/jp/ais/details/ships/shipid:663007/mmsi:431300686/imo:9162162/vessel:SUN_FLOWER_IVORY) です。

昨今はインターネット接続が常識として完備されることも多いですが、さんふらわあでも Wi-Fi が提供されていました。上位は NTT docomo だそうです。事前情報では、航路上で何度か途切れるところがあるそうでした。

今回のフェリーハッカソンでは既存敷設の Wi-Fi だけでなく、追加で [NSC](https://www.facebook.com/nscsec/) の方々がインフラ構築をされていて、利用させてもらえました。上位は NTT docomo と au KDDI を人力ロードバランス（！）されていたそうです。アンテナ設置位置もさんふらわあ既存の上位とは別になっていて、甲板まで船内から線を引き出して設置されていました。結構いい部屋だったところが、一変して戦場になっていました。

![IMG_4306.jpg](https://qiita-image-store.s3.amazonaws.com/0/41883/56b59dcb-d78c-038a-cdea-5228106211c6.jpeg)

![IMG_4308.jpg](https://qiita-image-store.s3.amazonaws.com/0/41883/6e35cf14-c896-d903-3de4-0a686a4e37d2.jpeg)

うん。どうみてもこれは設営大変だわ。

船内 LAN が構築され、さらに LAN 内サービスとして次のものが構築されていました。

- portal web site
- [owncloud](https://owncloud.org/)
- [rocketchat](https://rocket.chat/)
- [gitlab](https://about.gitlab.com/)
- GPS NMEA websocket server
- MR04 LTE CALL LOG websocket server (ハッカソン中に追加)
- 仮想マシン

## 電波の話

一口に電波と言っても、Wi-Fi と携帯電話の電波は全く別物です。インターネット接続という意味では、両方が揃わないとダメです。

まず Wi-Fi は船内では高密度環境を作らないといけないので、基本的には小さな出力でたくさん設置する方向で整備すべきです。電波が弱いと思って出力を強くしても大抵解決しません。専門的な話になりますが、例えば[このあたり](http://community.arubanetworks.com/t5/Validated-Reference-Design/Very-High-Density-802-11ac-Networks-Validated-Reference-Design/ta-p/230891) を出発点にするとよいです。

次に携帯ですが、陸地との接続が貧弱なので、携帯電話会社は一社ではなく、マルチキャリアで利用できる事業者に依頼したほうが良いかと思いました。体感的にもそう思います。それぞれの事業者の電波状況がどうなっているか～ですが、実は既にデータは沢山あります。おすすめは [opencellid.org](https://opencellid.org/) や [MLS](https://location.services.mozilla.com/) です。携帯電話は基地局を核としたセル（細胞）の集まりでシステムが出来上がっていますが、opencellid はその名の通り携帯電話基地局のIDを収集して、GPS 情報と電波強度をセットにしたデータを集めています。MLS は FirefoxOS が出てきて以来 mozilla が運用しているサービスで、平たく言うと google location api と同じことができるように作られました。

基地局の位置推定結果を見ると、海上にも基地局設置されているようにみえます。注意点としては、電波強度それ自体は通信速度と関係がないことです。電波強度と距離は関係あります。

これらのサービスを使うと既存のデータベースにアクセスできますが、一方で、自分で自分のデータを集めることにも意味があります。それはデータの由来についての保証だったりします。

## Hackathon

ああだこうだと議論しながら、チームメンバーの努力によりデータの可視化がされていきました。表示方法としては大きく次の二つが作成されました。

- 地図上に携帯電話網のサービスレベルを表示しつつ、現在位置を表示するウェブアプリ
- 現在の携帯電話網のサービスレベルを信号機で表示するもの

NSC インフラもフル活用する方向で実装しています。システムコンポーネント単位でいくとこんな感じです。

- web サーバ / Rails on NSC ubuntu 仮想マシン（高山さん）
- NMEA stream to simple geolocation REST API converter (python で書いた)
  - GPS web socket
- 信号機 (山村さん作 ESP8266 / Arduino + 自作基板)
  - LTE Call log websocket
  - websocket から call log 情報を取得して信号機の ESP8266 に push する
 cron job (python で書いた)
- 過去ログ（GPS, call log）を分析して json にまとめる（pythonで書いた）
- web アプリ（小野塚さん作）
  + leaflet で地図表示
  + 過去ログを参考値として表示するためのプログラム
  + 現在の位置を表示するためのプログラム

<blockquote class="twitter-tweet" data-lang="ja"><p lang="ja" dir="ltr">leaflet。航路の線出せた！<a href="https://twitter.com/hashtag/ferry_hack?src=hash&amp;ref_src=twsrc%5Etfw">#ferry_hack</a> <a href="https://t.co/EAnHXZ53Ly">pic.twitter.com/EAnHXZ53Ly</a></p>&mdash; BlueTone (@bluetoneinfo) <a href="https://twitter.com/bluetoneinfo/status/937018154240262144?ref_src=twsrc%5Etfw">2017年12月2日</a></blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

そして塚本さんの渾身のプレゼンにより

<blockquote class="twitter-tweet" data-lang="ja"><p lang="ja" dir="ltr">チーム &quot;でんぱ組&quot;による「Dampa VIEWER」。フェリー内のネットワーク状況を可視化し、混雑予報を出します。ログをもとに、様々なサービス改善も可能になります。いろいろな課題は、ITをつかわず運営で改善できるという指摘も、現実的な課題解決につながる、納得の提案！<a href="https://twitter.com/hashtag/ferry_hack?src=hash&amp;ref_src=twsrc%5Etfw">#ferry_hack</a> <a href="https://twitter.com/hashtag/code4osaka?src=hash&amp;ref_src=twsrc%5Etfw">#code4osaka</a> <a href="https://t.co/kDTXL3mmnU">pic.twitter.com/kDTXL3mmnU</a></p>&mdash; フェリーハッカソン (@ferry_hack) <a href="https://twitter.com/ferry_hack/status/937141806537482240?ref_src=twsrc%5Etfw">2017年12月3日</a></blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

なんと結果は：

<blockquote class="twitter-tweet" data-lang="ja"><p lang="ja" dir="ltr">チーム電波組み。<br>イメディオ賞いただきました！！！<br>チームメンバーに恵まれました！<br>皆さんありがとう(๑&gt;◡&lt;๑)<a href="https://twitter.com/hashtag/ferry_hack?src=hash&amp;ref_src=twsrc%5Etfw">#ferry_hack</a> <a href="https://t.co/1vUW4HmuRF">pic.twitter.com/1vUW4HmuRF</a></p>&mdash; BlueTone (@bluetoneinfo) <a href="https://twitter.com/bluetoneinfo/status/937171144049700864?ref_src=twsrc%5Etfw">2017年12月3日</a></blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

ありがとうございます！

あとおまけですが、これとは別に、よりユーザの体感に近い数値として、RTT (Round Trip Time) も計測していました。生データは[配布](https://gist.github.com/hkwi/f7592ff448cff0e47484771d2bbef7f6) しています。分析してみると、仮想マシン環境をどれほど素早く船から別府会場に移設したかなどが読み解けて、なかなか味わい深いものがありますが、それはまた別の機会にでも記事にできればと思います。

## リンク集

- twitter hashtag [ferry_hack](https://twitter.com/hashtag/ferry_hack)
- [フェリーハッカソン1日目(前半)](https://craadennaj.wordpress.com/2017/12/02/フェリーハッカソン1日目前半/)
- [超過酷！大阪港開港記念イベントフェリーハッカソンに行ってきた！！](http://036-yakudachi-info.com/blog/hackathon/ferry-hackathon)
- [フェリーハッカソン参加してきた。](http://kaba87.hatenadiary.jp/)
- [イベント会場(海上)でネットワーク構築してきた](https://blog.prog24.com/2017/12/%E3%82%A4%E3%83%99%E3%83%B3%E3%83%88%E4%BC%9A%E5%A0%B4%E6%B5%B7%E4%B8%8A%E3%81%A7%E3%83%8D%E3%83%83%E3%83%88%E3%83%AF%E3%83%BC%E3%82%AF%E6%A7%8B%E7%AF%89%E3%81%97%E3%81%A6%E3%81%8D%E3%81%9F/)
- [船中2泊3日の弾丸トラベルで課題を解決！「フェリーハッカソン」がすごかった](https://dime.jp/genre/488758/)

## 別府温泉

別府温泉も楽しかった！

青かったり

![IMG_4343.jpg](https://qiita-image-store.s3.amazonaws.com/0/41883/25b07c74-7411-15ee-8621-3d9682fe8c76.jpeg)

赤かったり

![IMG_4346.jpg](https://qiita-image-store.s3.amazonaws.com/0/41883/0074e566-b80f-5bbc-d923-0aa3182cce4d.jpeg)

使ったお湯が下水を流れ続けるせいで、地面から湯気が出続けていたり

![IMG_4403.jpg](https://qiita-image-store.s3.amazonaws.com/0/41883/92d8c685-2446-6b05-4c4f-2458493d95e0.jpeg)

これが最強の温泉の町か…と感嘆してしまいました。

ではまた来年！