Sleep
個人開発

Sleep

赤ちゃんを何時頃に寝かせたら良いか、基本的な活動時間や発達、前回の睡眠時間等の活動時間等を元に自動的に計算するアプリです。

はじめての個人開発ですが、実際に知人以外でもユーザー登録して使ってくださっている方もいらっしゃり、公式Instagramアカウントへお問い合わせを何度も頂いております。

新生児から1歳半くらいまでのお子さんが対象です。

昼寝の回数が2~1回になってくるとだいたい昼寝の時間が固定になってきて不要になるかと思いますが、睡眠回数の多い月齢のお子さんをお持ちの親御さんには「絶対便利だから使いたいと思った」等のコメントをDMでいただくことも何度もあり、便利に使っていただいているようです。

SleepSleepSleepSleep

このアプリについてはQiitaに詳しく書いていますので、その内容を転載します。

開発しようと思ったきっかけ

第一子で寝ない、泣く、抱っこ時間長すぎ等の過酷が過ぎる育児を経験して、もうこんなの御免だと思ったのですが、赤ちゃんはタイミングよく整った環境で寝かせたらスムーズに寝ると知ったことや、第一子が年中になりだいぶ楽になってきたこともあり寝る子なら産めると思い、絶対に1人でたくさん寝かせると心に決めて5歳半差の第二子を出産しました。

実際に産み育てると、寝かせる方法を知った私の知識の量と質の違いによって育児の大変さに天と地ほどの違いがあり、最初から布団で寝かせることができる→自分の時間が確保できる→我が子かわいいの好循環。
産後うつ、育児ノイローゼとは程遠い、楽しい育児が出来ました。
これは何人産んだとかではなく、単純に知っているか知らないかの違いによる差だと思っています。

「赤ちゃん育児中の全家庭が赤ちゃんを自分で寝かす術を知れば世界が変わるのでは?」
「寝ないから自由な時間がないなんてもったいない!」
「夜泣きなんて親子共にいいこと一つもない!させたくない!」

そんな風に考えました。
もちろん知識があって抱っこで寝かせたい人はそうしたらいいと思いますが、知らないならこんなにもったいないことないです。

置けば寝る赤ちゃんが出来上がると誰でも寝かしつけできるのでほんとーーーに楽です!
預けやすくて母親が楽なのはもちろんですが、代わりに寝かせることになる人も、赤ちゃん自身も楽になるんです。

実際、次回のねんね時刻を通知してくれるようなアプリもありますが、恐らく月齢で一律の活動時間で計算されているもので、月齢のわりに活動時間が短めだった第二子には使えませんでした。
人によって活動時間って全然違うので、個別に対応させたい、運動面の発達が著しい時期は活動時間が短くなるのもありますし、直近の睡眠時間が短いと活動時間が短めになることもわかっているので、そのあたりも反映させたい、、、となり、個人開発の題材は育児しながら決まりました!
これ全部叶えたらめっちゃいいアプリ出来るんやない?とかなり自信がありました!!

アプリで解決したかった課題

先述の内容と重複する点もありますが、列挙します。

・寝かしつけ開始から入眠までの登録をしたい
→睡眠時間の記録はできても、入眠までの所要時間の計算ができるアプリは知る限りないので、欲しかったです。毎回その他のカスタム項目のようなものを使って「寝かしつけ 活動時間2時間」みたいにメモしていたので、ここは自動化したかったです。

・活動時間がある程度わかっているなら次何時に寝かせるのか自動で算出したい
→計算自体は簡単ですが、いちいち計算するのが面倒臭かったんです。

・発達の記録をつけたい
→いつ何ができるようになったか、データで残したいという思いがありました。
かつ、活動時間に影響を与える項目なので重要です。

・今どれくらい起きているのか、もしくは寝ているのか一目でわかるようにしたい
→現在の睡眠時間もしくは活動時間が分単位で更新されてわかりやすくなるようにしたかったです。

・夫に子を任せて外出した時に次いつ寝かす?といちいち聞かれるのがすごく嫌で、自分で確認して欲しい
→これは結構ストレスで、アプリを開けば私に聞かずともわかるようにしたかったです。なので赤ちゃん情報の共有機能は絶対必要でした!

・体重の日当りの増加量を自動計算したい
→機能自体は超シンプルで簡単なものですが、特に低月齢の赤ちゃんを育てている方には地味に役に立つ機能だと思っています!
どれくらい増えてるかな?母乳出てるかな?ミルク足りているかな?の判断になる重要な項目なのに、小児科でも保健センターでもカレンダーみて電卓叩いているんですよね。自動で計算したかったです。

体重に関してはおまけです。
睡眠には直接関係ないですが、体重軽めの赤ちゃんは活動時間短めの傾向はあるように思います。

機能

  • 活動時間の登録を元に次回のお勧めねんね時刻計算(活動時間・睡眠時間・発達・月齢等を元に算出)

  • サブアカウントの発行(赤ちゃん情報の共有)

  • 睡眠記録の登録(寝かしつけ・寝た・起きた)

  • 睡眠時間、活動時間、入眠所要時間の計算と表示

  • 睡眠ログ棒グラフで描画(単日、1週間単位)

  • 合計睡眠時間の表示

  • 体重の登録と表示

  • 体重の前計測日からの日割り増加量の計算

  • 体重と月齢の折れ線グラフ描画

  • 発達記録(練習開始日・習得日)

  • 現在の睡眠時間と活動時間を表示

専門家監修

安心して使えるアプリにするため、IPHI乳幼児睡眠コンサルタントの坪根理恵さんに監修していただきました。
私自身の経験である程度は作れると思いますが、やはり専門家に監修していただいた方がより良いアプリを作れると考えました。
数多くの赤ちゃんの睡眠改善(夜泣き改善・セルフねんね習得等)をされてきたご経験から具体的な計算式についてや、活動時間の月齢別目安や見極め方のアドバイスについて監修していただき、アプリ内で確認できるようにしました。
おかげ様で価値あるアプリが開発できました。
監修の依頼を快諾してくださり、色んな細かい質問にもいつも丁寧に回答して下さり、理恵さんには心から感謝しています。

今現在、赤ちゃんの寝かしつけや夜泣きに悩んでいる方がいらっしゃれば、理恵さんに相談されるといいと思います。
活動時間も正しく把握できるので、睡眠を整えてからアプリ使う方がお勧めではあります。

アプリを使用する上での注意点

このアプリを利用する上で大切なのが「活動時間の登録」です。
登録を元に計算しますので、ある程度我が子の活動時間を知っていないとただの記録アプリになります。
監修の理恵さん曰く、活動時間を長く見てしまっている保育者は多いとのことでしたので、本当はどれくらいなのかしっかり観察して眠たいサインが出るタイミングを知るのが重要なことです。
活動時間オーバー → 疲れすぎ → ストレスホルモン分泌 → 寝つき悪くなる(ギャン泣き)
この流れで寝かしつけに苦戦するパターン少なくないので、最初はアプリ内の活動時間の目安を元に寝かしつけてみた方がいいと思います。

活動時間とは、赤ちゃんが無理なくご機嫌に起きていられる時間のことです。
活動時間を超えてしまうと夜泣き、寝つきが悪い、寝られてもすぐ起きてしまう等、睡眠のトラブルを引き起こすことが少なからずあります。

使用した技術

  • React

  • Next.js

  • TypeScript

  • supabase

  • prisma

  • vercel

  • Tailwind CSS

ライブラリ

  • @supabase/supabase-js: Supabaseと連携するため

  • @prisma/client: Prismaクライアントライブラリ

  • @fortawesome/fontawesome-svg-core:アイコン

  • @slack/web-api:グローバルエラーをキャッチしたらsleck通知をするため

  • dayjs: 日付と時刻を操作するため

  • react-hot-toast: 通知トーストの表示

  • react-modal: モーダルダイアログを実装するため

  • recharts: グラフを描画するため

  • swr: データフェッチ

  • jest: テスティングフレームワーク

  • Swiper:日付切替をスワイプ操作で行うため

  • react-datepicker:日付の切替をカレンダーから行うため

この実績に関連するブログ記事

  • react-hot-toastを使ってトーストを簡単に実装する

    2024年10月05日

    304
  • 【supabase】ユーザー招待機能とオプション情報の持たせ方

    2024年10月17日

    580
  • react-modalのシンプルな使い方

    2024年10月04日

    716
  • 失敗から学んだポートフォリオ作成でブランチをどうしたらいいかわからない問題について

    2024年10月08日

    730
user
吉本茜
山口在住/二児の母/育休中

他のWorks

  • 麹帳~koji-book~

    麹帳~koji-book~

    個人開発
  • kids planner

    kids planner

    個人開発
  • JS Gym問題詳細画面のプロトタイプ実装

    JS Gym問題詳細画面のプロトタイプ実装

    受託開発
  • ShiftB LP

    ShiftB LP

    受託開発
  • ShiftBポータルアプリのレスポンシブ対応

    ShiftBポータルアプリのレスポンシブ対応

    受託開発
  • ShftBの管理画面

    ShftBの管理画面

    受託開発
  • フロントエンド実装

    フロントエンド実装

    受託開発
  • フロントエンド実装

    フロントエンド実装

    受託開発
  • remindTask(仮)

    remindTask(仮)

    個人開発