【個人開発】デスクワーカー向けのストレッチ休憩アプリを作った
はじめに
エンジニアの皆さん、毎日デスクワークお疲れ様です。エンジニアは職業柄、長時間椅子に座りっぱなしであることが多いため、肩こりや腰痛を抱えている方も多いと思います。
一般的に、座りすぎは身体に悪く、寿命を縮めるとも言われています。
私もつい作業に集中しすぎると、呼吸が浅く、猫背になり、肩がガチガチになります。
この予防には、作業の合間に休憩をはさみ、身体を動かすことが大切です。
この時、実際にストレッチをするためまでには、下記のような課題があると考えています。
・身体を動かすといっても何をしたら良いのか分からない
・作業に集中してしまって、休憩を取るタイミングが分からない
・ストレッチをするモチベーションが湧かない
これらの課題を解決するために、動画でストレッチのやり方を見ながらユーザーがストレッチができて、かつユーザーの動きに対してゲームのようにフィードバックがあるアプリがあれば便利だと考えました。
そこで開発したサービスは、「すきまフィット」です。
デザインについては、テーマ色がオレンジで、輪（リング）を使って体操（フィット）する某ゲームをかなり参考にしています。
まだまだ機能もコンテンツも足りていない状況ですが、とりあえずMVPは開発できたと思うので、公開しつつ、宣伝がてら内容を記事にまとめます。
アプリ概要
コンセプトは、「デスクワークの合間に、頭を使わずに体操の気持ちよさだけを味わうことができる」アプリです。
「頭を使わずに」なので、アプリの情報量をなるべく減らし、かつ操作も簡単にしています。
- カメラを起動する
- お手本通りに体操をする
※カメラで撮影した動画は、ユーザーの端末内でのみ処理されます。
基本は上記の2ステップで、完結します。特に体操の説明については、分かりやすいように3Dアニメーションの動画として表示して、ユーザーになるべく文章を読ませないようにしています。
このアプリを使った後は、脳と身体がリフレッシュして、集中力を取り戻し、さらに体のこりなどが和らいでいて欲しいです。
このアプリのターゲットは、デスクワークをしているすべての人です。特に以下の要素を持っている人には、魅力に感じてもらえると思います。
- 肩こりや腰痛で悩まされている
- 日頃から整体やマッサージなどに通っている
- 長時間椅子に座って、PC作業をしている
- 在宅勤務で人の目が気にならない
このアプリは、PCでの使用を想定しています。スマホでは、主にカメラによる運動検知が機能しません。
また、カメラを使い、身体を動かすので、職場で使うのは恥ずかしいと思う人がいると思います。仕事場で使って欲しいという気持ちもあるのですが、この辺りの心理的抵抗はかなりあると思います。そのような方でも、ぜひお昼休みや終業後などに使っていただきたいです。
使用技術
現状、バックエンドの機能はなく、フロントエンドをReactを用いて開発しています。
また、画像解析に、Tensorflow.jsを使っています。
デプロイには、Vercelを使用しました。
これから作りたいこと
体操のお手本動画（コンテンツ）の拡充
現状、まだ「腕回し」の1つしかコンテンツをあげられていません。こちらのコンテンツは、このアプリ用に私が3Dアニメーションで作成しています。とりあえず、10種類くらいはコンテンツを拡充していきたいです。今回初めて、3Dアニメーション作成をやってみました。慣れない作業で大変ですが、このコンテンツの品質がアプリ全体の品質に直結すると思っています。
ただ、個人開発だと良くあるのが、ユーザー投稿型のアプリです。ユーザーを集めるには多くのコンテンツが必要。ただ、ユーザーがいないのでコンテンツが集まらない。そんな状況になりがちです。
このアプリは、ユーザー投稿型ではないので、自分が頑張って良質なお手本動画を作れば、ユーザーに価値を届けられるので、そこをモチベーションに頑張ります。
ただ、どのような体操が効果的か、説明の仕方などは医師や整体師などの専門家の方に監修いただきたいと考えています。
機械学習を利用した画像認識の精度向上
現在は、ただ画面上の動きを認識してスコア化しています。動きであればなんでもいいので、お題のストレッチと全然関係ない動きをしても、スコア化されてしまいます。
これについて、もっとお題のストレッチに合わせた動きをしているかどうかを判定して、フィードバックを画面に表示していくことが考えられます。
ただ、ブラウザ上で動かすtensorflow.jsでは動作が重くなってしまうので、細かなスコア化・フィードバック処理を入れたとしても、逆にユーザー体験が悪くなってしまうことを心配しています。
あくまで休憩中のストレッチという位置付けなので、筋トレと違い、ユーザーが動きに対して細かい指摘をされて嬉しいかと言われると、少し違う気もします。
タイマー機能の追加
例えば、30分ごとにユーザーに通知を入れることができる機能です。作業に集中しているとき、適切なタイミングでユーザーに通知を表示して、本アプリへの遷移させ、ストレッチを促します。Googleが提供しているFCMを使えば、実装できそうです。ただ、タイマー機能は言い換えれば、FCM通知の予約投稿と言えます。予約投稿なので、何時何分にどのユーザーに対して通知を送るのかを管理するデータベース、また通知APIなどを実行するサーバーが必要です。クラウドサービスを使うことも考えられ、例えばAWSのLambdaやGoogleのCloudFunctionsなどは一定の範囲内であれば無料で使えることが魅力的です。ただ、データベースは多くのクラウドサービスでは有料で、しかもかなり高額です。
現状、VPSサーバーを借りて、APIサーバー、バッチサーバー、DBをDockerで一つのサーバーに立ててしまうのが、一番コスパが良いなと感じています。
デスクトップ版アプリの開発
現在、このアプリはWebアプリとして作成しています。もし使ってくれている方が一定数いて、ニーズが確認できたら、より利便性を高めたデスクトップ版を開発したいです。デスクトップ版について、開発アーキテクチャの選択肢は複数ありますが、Kotlinに興味があるので、Kotlin Multiplatformを使いたいと考えています。
スマホユーザーへのフォロー
このアプリは、スマホでの使用を想定していません。Tensorflow.jsでの画像解析の処理が重く、スマホではこの機能が使えないからです。ですがスマホでこのWebアプリを開いて下さった方に、少しでも興味を持っていただくために、スマホユーザーにはアプリの魅力を伝え、PCで使ってもらえるように促したいです。
ドメインの取得
現在はVercelが提供してくれているドメインを使わせてもらっている状況です。ユーザーに使ってもらえることがわかったら、きちんとドメインを取得しようと思います。
体操時の画面演出
ところどころデザインが崩れていたり、アニメーションの演出がいまいちなところがあります。この辺りの修正に加えて、ロゴの作成や適切なフォント設定なども行っていきたいです。
終わりに
手前味噌ですがは、このアプリは私は毎日使っています。自分をペルソナにして、自分が欲しいと思う機能を開発していきます。その基準だと、ログイン機能などは今のところ不要と考えています。当面は、体操のお手本動画の種類と増やすことと、タイマー機能の実装に力を入れます。
今後のアプリ開発の進捗について、連載しようと思います。
また、近いうちに友人にユーザーインタビューをしてみようと思うので、その結果を記事にします。
また、このアプリについての感想なども受け付けています。ぜひコメントで教えていただけると嬉しいです。
Discussion