今注目のFlutterで開発「StretchSox」アプリ開発レポート

こんにちは、インターン生の小川翔生です。

クランチタイマーにインターン生として入社してからは、主にFlutterを使用して開発を行ってきました。

Flutterは、iOSとAndroidのアプリを1つのコードで作成することができるフレームワークの一種で、その開発の利便性から注目度が高まっています。

今回は、そのFlutterを使用して新しくモバイルアプリを開発したので、実績紹介とともにご紹介させていただきます。

作成したアプリは、「ストレッチソックス」というソックスを使用して、手軽にストレッチができるアイテム専用のモバイルアプリケーション”StretchSox”です。

ストレッチソックスのサイト

アプリの概要について

こちらのアプリは、 ストレッチの習慣が無い方に向けて、ストレッチを手軽に習慣化できるようなアプリを目指して作成しました。

主な機能としては、4つのカテゴリーから、今の自分の気分や体の調子にあうものを選択し、行うストレッチを選択できます。

一日ストレッチを行うとスタンプが押され、継続してストレッチが行えていることがわかりやすいです。

さらに合計21日ストレッチを行うと、ストレッチソックス購入の際に使用することができる割引クーポンをプレゼントという特典もついています。

また、リマインダー機能もついており、ストレッチの行う時間を知らせてくれます。

このように、StretchSoxはストレッチの習慣化ができていない方でも、習慣化のサポートになるように工夫して作成しました。

Flutterでのモバイルアプリ開発の特徴

今回使用したFlutterのようなマルチプラットフォームで開発する際に、考えないといけない部分が、これから実装しようとしている機能が本当に実装できるかどうかです。

Flutterのようなマルチプラットフォームでは、「デバイスに関連した機能の実装」、「比較的新しい技術の導入」などの実装が難しくなります。

今回のStretchSoxでいえば、ストレッチ動画をダウンロードをし、デバイスの内部ストレージに保存するというようにデバイスに関する部分が1つありました。

その点については、チームメンバーが技術調査をしてくれた際に実装可能ということがわかり、Flutterでの作成に踏み込みました。

Flutterならではの難しかった部分

1. 情報のキャッチアップ

Flutterは比較的新しいフレームワークなので、ネットに日本語の情報があまり載っておらず、チーム全体でも情報のキャッチアップが比較的難しかった印象でした。

今回のアプリ開発も同様に、基本的には英語のドキュメントや動画などを参考に情報のキャッチアップをし、開発を進めていきました。

FlutterはGoogle製ということもあり、英語のドキュメントは比較的しっかりとしているんですが、日本語のドキュメントや情報は検索してもあまりヒットしないというのが現状です…。

Qiitaでは、今回の開発でキャッチアップした情報を日本語で発信しているので、ぜひご覧になってみてください。

2. UI作成

また、UIが崩れないかどうかも非常に神経を使った印象です。

デバイスの大きさはもちろん、iOSとAndroidのプラットフォームの違いに関しても考慮に入れなければ、UIが崩れ、ユーザーにとって見辛いものになってしまったということが多々ありました。

なので、デバック時にはいろんなサイズのデバイスで確認する、iOSだけでなくAndroid の端末を使用して確認するという作業が必要になったため、その部分に関しては非常にタフな作業だったと感じています。

最後に

クランチタイマーでは、モダンな技術を積極的に使用して開発を行える環境が整っています。

記述したように、情報のキャッチアップが難しく、スムーズに開発が進まないこともありましたが、それを乗り越えて、うまく実装できた時の感覚は最高です。

また、今回作成したStretchSoxは、iOS、Androidでインストール可能です。

ぜひ、StretchSoxを使用し、ストレッチを習慣化してみてください。

App Store

https://apps.apple.com/app/id1589734828

Google Play

https://play.google.com/store/apps/details?id=com.stretchsox.stretch_sox