習慣トラッカーアプリの作り方

習慣トラッカーは、習慣のリストと、毎日すばやくチェックするための仕組み、そして続けるモチベーションになる連続記録と履歴の表示を備えたものです。データは小さく、ルールも明確で、自分自身が毎日使うので、AIで作る最初のアプリとしてとても適しています。今日の現実的な作り方は、スマートフォンのホーム画面に追加して使うモバイル対応のWebアプリです。App Store のアプリではありません。このガイドでは、それがリマインダーにどう影響するかも正直にお伝えします。

Webアプリであって、App Store のアプリではない（今のところ）

習慣トラッカーというと、スマートフォンのアプリを思い浮かべる人が多いでしょう。選択肢は三つあります。

個人用や少人数向けの習慣トラッカーなら、通常はPWAが最初のバージョンとして適しています。ストアのアカウントには費用もかかります。各社のサイトによると、2026年9月時点で Apple の開発者プログラムは年間99米ドル、Google Play の開発者アカウントは一回25米ドルです。ネイティブアプリとプログレッシブWebアプリの違いでさらに詳しく解説しており、モバイル対応のWebアプリの作り方では、スマートフォン向けの細かい点を扱っています。

AIビルダーについての補足ですが、ほとんどはWebアプリを作ります。Mythex もそうで、Pro プランでは、Webアプリを Android と iPhone のアプリとして包み、Google Play の内部テストや TestFlight に送ることもできます。画面はWeb画面なので、完全にネイティブなUIが必要な場合は、ネイティブ向けのビルダーを使ってください。

習慣トラッカーに必要なもの

中核の機能

• 習慣： 名前、任意のアイコンや色、そして予定（毎日、特定の曜日、または週に何回か）。
• チェックイン： 一回タップで今日の完了を記録します。もう一度タップすると取り消せます。
• 今日の画面： 今日行うべき習慣を表示し、完了したものは見た目を変えます。人が最も頻繁に開く画面なので、速く表示される必要があります。
• 連続記録： 習慣ごとの現在の連続記録と最長の連続記録。
• 履歴： 毎日の結果をカレンダーやグリッドで表示し、抜けた日が一目で分かるようにします。

あると良いが、後からで十分なもの

• 数量で記録する習慣（「水を8杯」「20ページ」）と、1日あたりの目標。
• チェックインへのメモ（「5km走った、きつかった」）。
• 指定した時刻のリマインダー。
• 習慣の一時停止（休暇や病気のとき）。連続記録は途切れません。
• やめた習慣を削除せず、アーカイブすること。

データ

アプリ全体を支えるのは、次の二つのテーブルです。

• 習慣 — ユーザー、名前、予定、目標、作成日、アーカイブのフラグ。
• チェックイン — 習慣、日付、数値（数量の習慣の場合）、メモ。

チェックインは、タイムスタンプだけでなく、ユーザーのタイムゾーンでのカレンダーの日付（2026-09-29 のような形式）として保存します。この一つの決定で、連続記録のバグの大半を防げます。

連続記録を正しく扱う

連続記録は単純に見えて、実は単純ではありません。次のルールを決め、プロンプトに書いておきましょう。

1. 誰にとっての「今日」か？ ユーザーの現地の日付を使います。ロサンゼルスで午後11時30分に記録したなら、UTC ではすでに「翌日」です。ユーザーのタイムゾーンをプロフィールに保存してください。
2. 今日はまだ数えるか？ 今日の分がまだ完了していなくても、現在の連続記録は昨日までの分を表示し続けるべきです。真夜中にゼロになるわけではありません。多くのトラッカーは、予定日が完全に終わるまで連続記録を途切れたとみなしません。
3. 予定の日だけを数える。 月・水・金の習慣では、火曜日は達成できなかった日にはなりません。
4. 週の目標。 「週に3回」は週単位で測るので、連続記録も週で数えます。
5. 後からの記録。 昨日の分を後からチェックできますか？ 通常は、忘れてしまう人が多いため、一定の範囲内で可能にします。

連続記録の計算は、AI に独立したテスト可能な関数として書かせ、期待される答えのある例を与えてください。手で確認する価値が最も高いのはこの部分です。

一人で使うか、アカウントを作るか？

一台の端末で自分だけが使うトラッカーなら、ブラウザ内のストレージにデータを保存できます。ログインもデータベースも不要です。ただし、ブラウザを消去したり、スマートフォンを替えたりすると、すべて失われます。

スマートフォンとノートパソコンの両方で習慣を見たい、または他の人のために作るなら、次を追加しましょう。

• ログイン — メールとパスワード、またはサインインのプロバイダー。アプリにログインを追加する方法をご覧ください。
• データベース — データをサーバーに置き、端末間で同期させます。
• ユーザーごとのデータ分離 — 各自が自分の習慣しか見られないようにします。二人のユーザーでサインインして確認しましょう。

習慣のデータは個人的なもの（健康、禁酒、服薬など）になりえます。初期設定では非公開にし、明示的に許可しない限りソーシャルな共有は付けず、ユーザーがデータをエクスポートしたり削除したりできる手段を用意してください。

リマインダーについて正直に

リマインダーは、Webアプリとネイティブアプリを最も分ける機能です。

• Webプッシュ は、最新のブラウザで動作します。iPhone と iPad では、Apple の WebKit チームによると、Webプッシュは iOS と iPadOS 16.4 で、ホーム画面に追加されたWebアプリ向けに使えるようになりました。つまり、ユーザーはまずアプリをインストールし、それから通知を許可する必要があります。
• 何かが通知を送らなければなりません。 夜8時のリマインダーには、予定に従って動くサーバー側のジョブが必要で、そのジョブがプッシュやメールを送ります。アイドル時にスリープするホスティングのアプリは、自動では起きません。ビルダーに、予約された処理がどう起動されるのかを確認してください。
• メールは簡単な代替手段です。 毎日の概要メールは作るのが簡単で、どこでも動きます。アプリからメールを送る方法をご覧ください。

現実的な計画としては、まずリマインダーなしで出し、一週間使ってから追加することをおすすめします。

うまくいく最初のプロンプト

スマートフォンを最優先に設計された習慣トラッカーのWebアプリを作ってください。習慣は、名前、色、予定（毎日、選んだ曜日、週に N 回）を付けて追加できます。ホーム画面には今日の習慣を大きなタップ領域で表示し、一回タップで完了、もう一度タップで取り消しにしてください。各習慣には現在の連続記録と最長の連続記録を表示します。数えるのは予定の日だけで、ユーザーの現地のタイムゾーンを使い、その日が終わるまで今日の分は連続記録を途切れさせないでください。履歴画面では、習慣ごとに月のグリッドを表示します。チェックインは現地のカレンダーの日付として保存します。メールとパスワードのログインを追加し、データベースに保存して、スマートフォンとノートパソコンの間で同期させてください。名前とアイコンを付けて、PWA としてホーム画面に追加できるようにしてください。

構築のステップ

1. サンプルデータでの今日の画面。 他の作業の前に、スマートフォンサイズでメイン画面の使い心地を整えます。
2. 習慣とチェックインの追加。 異なる予定の習慣を三つ作り、チェックしてみます。
3. 連続記録のロジック。 AI にテストケースを与えます。「月・水・金の習慣を、月・水・金・月に達成 → 連続記録 4」のように。それを確認します。
4. 履歴のグリッド。 抜けた日が明確に分かるようにします。
5. ログインとデータベース。 次に、二台目の端末で開いてデータが一致するか確認します。
6. インストール。 iPhone では（共有 → ホーム画面に追加）、Android ではブラウザのインストールオプションで、ホーム画面に追加します。アイコン、名前、全画面での起動を確認します。
7. 一週間使う。 一時間のテストよりも、七日間の実際の利用のほうが、本当の問題を多く見つけられます。

よくある失敗

• 「今日」にサーバーの時刻を使う。 最もよくある連続記録のバグです。ユーザーのタイムゾーンを使いましょう。
• タップ領域が小さい。 トラッカーは、片手で、半分寝ぼけたまま使われます。チェックのボタンは大きくしましょう。
• 最初に機能を詰め込みすぎる。 ソーシャルなフィード、バッジ、グラフは、基本の流れが動いてからで十分です。
• ホーム画面に追加せず、iPhone でプッシュを約束する。 先にホーム画面に追加するよう、ユーザーに伝えてください。
• 取り消しがない。 押し間違いは毎日起きます。
• 削除せず、アーカイブしない。 習慣をやめたとき、人は履歴を残したがります。

既製の習慣アプリのほうが良い場合

自分の習慣を記録したいだけなら、すでにある習慣アプリは洗練されていて、ウィジェットやネイティブの通知があり、費用もほとんどかからないか無料です。自作するのが向いているのは、そうしたアプリにはない機能が必要なとき（特定のプログラム向けのトラッカー：コーチングのクライアントグループ、診療所の患者、チームのチャレンジ）、連続記録に独自のルールが必要なとき、習慣を自分の持つ他のデータと結びつけたいとき、あるいは自分のためだけに作られた道具を持ちたいときです。AI で作るプロジェクトとしても良い題材です。AI で作れる副業のアイデアもご覧ください。

Mythex での構築

Mythex では、このアプリをWebアプリとして作ります。チャットで説明し、ライブプレビューのスマートフォンサイズの枠で確認できます。アカウントと同期が必要になると、データベースを追加します。公開リンクに公開し、スマートフォンのホーム画面に追加してください。Pro プランなら、Android と iPhone のアプリとしても包み、Google Play の内部テストと TestFlight に送れます。すぐに使えるプロンプトから始めたい場合は、毎日の習慣トラッカーのテンプレートを開くか、アプリのテンプレートを見てください。

よくある質問