こんにちは!
個人開発にアホみたいにハマってしまった大学生です。
Comma(コンマ) という📅日程調整サービスを運営しています。
最近、Webに加えて、iOSにもサービスを展開したので、
これまでの紆余曲折を記事にしていこうと思います!
サービスの概要
大学生を経験した方なら、こう思ったことがあるのではないでしょうか??
Commaはそんなときに役立ちます。
・自分の空きコマを入力して、友達と共有できる。
・みんなの空きコマが一目でわかる。
そんな日程調整サービスです!
https://apps.apple.com/jp/app/comma-%E7%A9%BA%E3%81%8D%E3%82%B3%E3%83%9E%E3%81%A7%E6%97%A5%E7%A8%8B%E8%AA%BF%E6%95%B4/id6504521309
https://com-ma.app
作ったきっかけ
自分は音楽サークルに所属していて、空きコマで練習をしていました。
練習の日程調整は、tappyというサイトでやっていたのですが、
入力がめんどくさくて、UI/UXに改善の余地があると思ったのがきっかけです。
機能
Commaには空きコマの入力をラクにする機能があります。
週間スケジュール機能
1週間の空きコマってだいたい同じですよね??
(月は2限が空きコマ、火は3限と4限が空きコマのような感じ)
Commaには1週間の空きコマを登録する機能があり、
入力画面で、各曜日の空きコマをワンタップで反映できます!
ペースト機能
文化祭などの時期は、いろんな用事の日程調整が必要ですよね??
そんなときはペースト機能を使って、二度手間を省きましょう!
サービス展開の流れ
2022年11月 Web版の開発をスタート
2023年04月 Web版をリリース
2024年03月 iOS版の開発をスタート
2024年07月 iOS版をリリース
約1年半、サービスを運営しています!
Webの技術スタック
フロントエンド
Laravel Blade + Vue.js + Vuetify
Vue.jsとLaravelを連携させて構築しました。
セットアップはかんたんで全然困らなかったです。
UIフレームワークはデザインの好みでVuetifyにしました。
アニメーション付きのコンポーネントが多数用意されていて、
classでスタイリングもできるので良かったです👍
セッションの値などをVue.jsで扱うには、
Laravel Bladeから渡す必要があるので、そこは面倒くさかったです、、
バックエンド
Laravel
プライベートでもインターン先でも使っていたLaravelにしました。
認証周りなどが最初から用意されていて、使いやすかったです!
ライブラリも充実していて、やりたいことがすぐ実現できました。
Webのメリット・デメリット
メリット
・修正をすぐに反映できる。
・維持コストが安い。
・審査がない。自由。
・インターネットがあればどんな端末でもアクセスできる。
デメリット
・検索流入が見込めない。(個人でSEO対策は限界がある。CSRだとSEO不利すぎる。)
・Adsenseの審査が厳しく、広告掲載のハードルが高い。
・ネイティブアプリと比べて、サービスへのアクセスがめんどくさい。
iOSアプリを作るモチベーション
Webの方をがんばっていたのですが、段々ネイティブアプリを開発したいと思うようになりました。
その理由は3つありました↓
・AppStoreの検索流入の方が期待できそうだから。
・Admobは広告単価が高く、審査も厳しくないから。
・利用ハードルを下げれるから。
そんな理由で気づいたら、iOSアプリ開発のやる気が出ていました。
iOSアプリの技術スタック
クライアント
React Native + Expo + Tamagui
iOS、Androidの両方で出したかったので、クロスプラットフォーム対応フレームワークにしました。
(AndroidはGoogle Playの審査が厳しくて出せてません😭)
Flutter / React Native論争があると思うのですが、自分は
・Reactに慣れていた
・Dart学ぶのめんどくさい、ネスト深くなりそう(偏見)
・ネイティブUIへの憧れ
といった理由でReact Nativeを選びました。
UIライブラリは、話題になっていたTamaguiにしました。
デザインが好みだったので選びました。
コンポーネントには、スタイリング用のpropsがあったので、
スタイリングしやすかったです👍
アニメーション用のpropsもあって、簡単にアニメーションを実装できました。
イマイチな点は、Betaのコンポーネントがあるところですね、、
Expoは素晴らしいフレームワークだと感じました。
ローカルストレージ、生体認証、ストアレビューなど
必要なプラグインが用意されていて、とても開発しやすかったです。
Next.jsのようなファイルベースルーティングもよかったですね〜
React Nativeエコシステムの懸念点は保守性ですね。
Commaも多くのサードパーティライブラリを使用しているので、メンテナンスが
大変になりそうだなと思いました。
バックエンド
Laravel + Firebase
バックエンドはWebと同じです。
やったことは、APIエンドポイントの用意とトークン認証の導入くらいです。
WebがOAuthに対応していたので、iOSでも対応させるために
Firebase Authenticationを使用しています。
WebではFirebase Authenticationを使っていないので、
認証データの整合性を取るのが大変でした、、
ですが、色んなOAuthプロバイダーでの認証をFirebase SDKでできるのは便利でした👍
運営を続けるモチベーション
ありがたいことに、平均DAUは10~15となっていて、使ってくれている方がいます。
「いいアプリですね!」
「〇〇の機能をつけて欲しい!」
そんなユーザーさんの声がモチベーションになっています。
このサービスでは大した収益はないのですが、(なんなら赤字😭)
自分が作ったものを評価してもらえるのは、何事にも変えられない財産だと思っています!
また、個人開発では技術面でも色んなメリットがあります↓
・色んな分野の知識が身につく
・新しい技術を試せる
・職場で学んだことを活かせる
・保守性を意識してコードを書くようになる
これから
現状、Commaのユーザー規模はとても小さいです。
これからは、ZennやSNSなどで色んなことについて発信し、Commaを成長させたいと思っています!
ここまで読んでいただきありがとうございました🙏
https://apps.apple.com/jp/app/comma-%E7%A9%BA%E3%81%8D%E3%82%B3%E3%83%9E%E3%81%A7%E6%97%A5%E7%A8%8B%E8%AA%BF%E6%95%B4/id6504521309
https://com-ma.app