【Flutter】1週間で個人開発アプリをリリースした話
はじめに
今回の記事が初めてのZennへの投稿になります。
ご覧いただきありがとうございます。Gonです！
普段はフリーランスとして、Kotlinを使用しAndoridアプリの開発をしています。
ここ数年、Kotlinをメインで使用してきましたが、今後はFlutterを使用したプロジェクトにも挑戦していきたいと考え学習を始めました。
今回の記事では、Flutterを学び始めて約1ヶ月が経過し、アウトプットの形として1週間で個人アプリの開発からリリースまで持っていくことができた経験についてシェアしていきます。
アプリ紹介
今回開発したアプリは「人間の奇声や叫び声、動物の鳴き声などを集めたアプリ」です。
(※2024年11月18日追記：リリースから1年が経過しこのアプリは配信を停止しています🙇)
App Store ：
Google Play Store：
ソースコード： ※リファクタしておらず汚い部分多いのでご参考までに🙌
学習開始1ヶ月 → 個人開発に至る経緯
アプリの内容に触れる前に、まずは、学習開始から個人開発に至る経緯について話していきます。
学習開始1ヶ月
以下の教材を利用し、Flutter&Dartの基礎から開発全体の大枠を掴んでいきました。
- Flutter & Dart基礎
- とにかく公式ドキュメント
- UI設計 (ライブコーディング形式で丁寧に解説されているYouTubeチャンネル)
- GitHubリポジトリ
これらの教材等を利用し実際に手を動かしながら学習を進めることで、小規模なアプリであればFlutterを利用し簡単に作れるようになりました。公式のドキュメントは必要な時に都度調べる方法で利用していましたが、全体的な理解を深めるために、一度時間をとって隅から隅まで読んでみようと思います。
個人開発に至る経緯
正直、UdemyやYouTubeでの学習は手を動かしていたとはいえ、ほぼインプットに近い学習でした。そのため、とにかくくだらないものでもいいから、早い段階で自分の考えを形にしてアウトプットするという、0→1のプロセスの重要性を強く感じたため、個人開発を始めることにしました。
ただ、現状のFlutterのレベル感で本格的なアプリに拘っても良いものを作れない(作れたとしても多くの時間が必要となる)と感じたため、現時点では、とりあえずシンプルな機能で形にして、Flutterで0からリリースまでの経験を積むことを目標に設定しました。
アプリの構想からリリースまで
アプリの構想
アプリのコンセプトを考えていた際、YouTubeでヤギの奇声集が流れてきました。それをきっかけに、動物や人間の奇声や叫び声を集めたアプリがあったら面白いのではと思いました。
AppStoreで類似アプリの調査を行ったところ、動物の鳴き声を集めたアプリはいくつか存在しましたが、その多くが使いにくいUIで、音声再生時に頻繁に広告が表示され、使い勝手が悪い印象でした。
そこで、今回作るアプリは、シンプルで使いやすいUI/UXを持つアプリの開発を目指すことにしました。機能的には音声ファイルの再生が主となるシンプルなアプリですが、状態管理などの基本的な技術周りはカバーできますし、FirebaseStorageに音声ファイルを保存しストリーミング再生を行うなど、基礎学習後の良いアウトプットになると考えました。
実際にかかった時間の内訳
- 実装：2~3日
- 画像・音声素材集め：1日
- リリース：3~4日
実装
平日の業務外の時間を利用しての実装になりましたが、実装自体は2~3日で完了し、残りの時間でUIの調整やリファクタを進めるような流れでした。
アーキテクチャについては、業務でMVVM with CleanArchitectureに慣れていますが、今回のプロジェクトではAPI通信等もない小規模のアプリで、将来的にスケールする可能性も低いと考えているため、以下のようなシンプルな構成にしました。
├── data：データを管理するディレクトリ
├── models：データモデルを定義するディレクトリ
├── screens：各画面を定義するディレクトリ
├── widgets：再利用するカスタムウィジェットを格納するディレクトリ
└── main.dart
利用したパッケージ
- in_app_review : レビュー機能を実装するため
- share_plus : シェア機能を実装するため
- just_audio : 音声再生機能を実装するため
- google_fonts : fonts.google.com フォントを使用するため
- flutter_localizations : アプリの多言語対応のため
- flutter_launcher_icons : iOS/Androidアプリアイコンを生成するため
- ダークモード対応
※状態管理の方法としては、Riverpodを採用せず、setState()のみで実装。理由としては、小規模なアプリであり複雑な状態管理は不要のため。
※音声ファイルの保存場所として、当初はFirebaseStorageを考えていましたが、オフライン状態で再生可能にするためアプリ内に直接音声ファイルを配置して参照する形に変更しました。
素材集め
素材集めは楽しかったのですが地味に苦労しました。。
というのも、当初はヤギの奇声や叫び声を集めようと思っていたのですが、著作権的に利用して良い素材があまり見つからず、ヤギの奇声集は残念ながら諦めることにしました。(素材が集まればいずれは出したい。。。)
今回アプリ内で使用している音声や画像素材は、クリエイティブ・コモンズ・ライセンスで、クレジット表記なしで無料利用できる素材を選んで利用しています。
動物の音声と画像に関しては「google animal sounds」を利用し、アプリ内にGoogleのクレジットとサイトのURLを記載しています。
リリース
これが結構大変だった。。
特にiOSのリリース作業では何度もエラーにぶち当たり、MacやXcodeのアップデートの作業も発生し想定以上に時間がかかりました。。
ただ、アプリ申請後はあっさり承認され、申請から12時間後にはリリースされてました！
フリーランスで参画しているプロジェクトでは、基本的にプロパーの方がリリース作業を担当しているため、今回リリース作業を経験できて良かったなと思います。
また、AppStoreやGooglePlayStoreに掲載するスクリーンショットのデザインは、下記の記事を参考にFigmaを利用して作成しました。
まとめ
以上、1週間で個人開発アプリをリリースした話でした！
個人開発でアウトプットすると学びが圧倒的に多いですし、なにより、個人でアプリをリリースしてみて、 個人開発は純粋に楽しい！ ということを知れました。
今回のような 「インプット → 個人開発でアウトプット」 というサイクルを回し続けることで成長できると思ってるので、今後もガンガンこのサイクルを回していこうと思います。
最後まで読んでいただきありがとうございました！
ダウンロードはこちら：
▼ オススメのFlutterコミュニティ
少し前に、Flutter大学というkboyさんが運営するコミュニティに参加したのですが、優秀なFlutterエンジニアさんが多く、Slackで流れてくる人たちの活動を見るだけでもすごく刺激もらえています。興味ある方はぜひ👋
Discussion