Web

A Better Life

睡眠・習慣・集中まわりを少しずつ整えるための、無料 Web ツール群です。すべてブラウザ内で動き、登録もアカウントも不要です。

Next.js 15TypeScriptCloudflare PagesGA4

A Better Life

概要

A Better Life は毎日を少し整えるためのツールとガイドを提供する Web サイトです。Phase 1 では Sleep Calculator / Bedtime Calculator / Evening Routine Builder の 3 ツールを軸に、検索流入から「ツール利用 → 次のツール → 習慣化」までを 1 サイト内で完結できる構造を組んでいます。

解決したい課題

睡眠改善や夜のルーティンを「読む」だけのコンテンツは多い一方、その場で試せて結果が残るツールは意外と少なく、回遊と習慣化に繋がりにくいという課題がありました。

主な機能

  • Sleep Calculator: 起床時刻から最適な就寝時刻を逆算
  • Bedtime Calculator: 就寝時刻から眠りのサイクルに合った起床候補を表示
  • Evening Routine Builder: 自分のリズムに合わせた夜のルーティンを組み立て
  • 結果は localStorage に保存。サインアップ・サーバー保存は不要
  • ja / en の対訳ブログでツール利用後の文脈をサポート

技術スタック

フロント
Next.js 15, TypeScript
ホスト
Cloudflare Pages
保存
localStorage
計測
GA4

アーキテクチャ

Next.js 15 (App Router) + TypeScript で構築し、`output: "export"` の静的書き出しを Cloudflare Pages にデプロイしています。Phase 1 ではサーバー側状態を持たず、計算もブログ記事もすべてビルド時か localStorage で完結させています。

AIの活用

プロダクト内には現状 AI を組み込んでいません。記事のドラフトやキーワード設計、対訳の品質チェックなど制作プロセス側で AI を活用しています。

評価・運用

GA4 で各ツールの利用と回遊を計測し、検索からツール、関連ツールへの 3 角回遊が実際に発生しているかを観測しています。記事はツール利用後の自然な接続を最重要指標として配置しています。