麻雀支援アプリ「JongHelper」をReact Nativeで開発・リリースしました!

JongHelper

麻雀初心者を支援するスマホアプリ「JongHelper」をリリースしました!

iOS / Androidで配信中です。

JongHelperは、日本最大級の学生ハッカソンである「JPHACKS 2017」にて生まれました。そのときのインタビュー記事はこちらです。

初心者に朗報!iPhoneをかざすだけでアガリ牌、点数を表示するアプリ「JongHelper」 – 麻雀ウォッチ

ハッカソンでは、企業賞4つと審査員特別賞を頂きました。まさか麻雀でこんなに賞をもらえるとは思っておらず、リリース等は全然考えていませんでした。

しかし、思ったよりも麻雀ウォッチのインタビュー記事がバズったことや、せっかく作ったからちゃんとリリースしようという開発メンバーの思いから、一から作り直すことにしました。

具体的には、

  • Android版もリリースするため、React Nativeを採用(ハッカソンのときは、SwiftでiOS版のみ開発)
  • 画像認識の精度を上げる(SSD → YOLOv3)

ということをしました。

JongHelperの構成

アプリ

  • React Native
  • TypeScript

iOSとAndroidでリリースしたかったのと、シャンテンや点数計算のロジックを共通化したいという思いから、クロスプラットフォーム開発ができるReact Nativeを採用しました。

リロードするだけで変更が反映されるため、サクサク開発できた気がします。開発はiOSシミュレータをメインに使っていました。

しかし、ある程度完成してからAndroidで動かしてみたら、UIの見た目とか挙動が若干違う・・・!みたいなことが起きて少し大変でした。

あと最初はJavaScriptで開発をしていましたが、型がほしい・・・と思ってきたため、途中でTypeScriptに書き直しました。React Native 0.57からちゃんとTypeScriptに対応したので良かったです。

サーバー

画像認識API

アプリでは手牌の画像を撮影・リサイズするだけで、麻雀牌の認識はサーバー上で行っています。

麻雀牌はメーカーによって絵柄のデザインが少し異なるため、様々なメーカーの麻雀牌を集めて学習データに含める必要があります。

が、現在は1種類の麻雀牌でしか学習させていません。(麻雀牌高いし・・・笑)

それでも、学習に用いた麻雀牌ならとても高い精度で牌を認識してくれます。また、違う種類の麻雀牌でも結構認識してくれることを確認しています。

今後は様々な麻雀牌で学習を行っていく予定です。

役推薦API

今の手牌からどんな役が狙えるかを計算してくれるAPIです。

スマホで計算させても良いのですが、アプリをアップデートしなくても役推薦のロジックを変更できるという利点があります。今は単純な探索で狙える役を列挙しているだけなので、これは改善していきたいです。

Kotlinを使ってみたかったので、SinatraやFlask的な立ち位置のKtorを採用しました。Kotlinは書きやすくていいですね。Kotlin/Nativeにも期待。

両APIはConoHa VPSで稼働しています。
料金が安く、メモリ1GBプラン以上ならスケールアップも容易にできそうなのでいい感じです。

まとめ

今回作ったものはカメラ機能があるくらいだったので、わりと順調にReact Nativeで開発を進めることができましたが、ネイティブの機能をガッツリ使うようなアプリだったら大変そうだな〜と思いました。

ハッカソンで作ったものをリリースまでもっていけてよかったです!

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です