3分日記

3つの質問に答えるだけで、その日の気持ちと明日の一歩を短く残せる日記アプリです。 「今日あったこと」「いまの気持ち」「明日の一歩」を順番に書いて、3分でその日をやさしく閉じます。

公開 URL: https://ai-app-gen-factory.pages.dev/002-three-minute-journal/

特長

• 3つの質問だけ — 今日あったこと / いまの気持ち / 明日の一歩。書くことを迷わせません。
• やわらかい3分タイマー — リング型のタイマーが集中を助けます。3分を過ぎても強制終了はせず、書き終えるまで寄り添います。
• 明日の一歩カード — 保存すると、明日の一歩が目立つカードとして残り、翌日に見返したくなります。
• 1枚の縦長ノート — 入力・タイマー・履歴を1画面に連続配置。設定タブを分けず、その場で完結します。
• 履歴の見返し — 日付順に過去の記録を一覧でき、タップで詳細表示・編集・削除ができます。
• 藍と薄金の研究ノート — 罫線、左余白の金線、ミンチョ体の見出しで、静かに書ける佇まいにしています。

使い方

1. ページを開くと、その日の日付と空の3つの質問が表示されます。
2. 「今日を書きはじめる」を押し、3つの設問に短く答えます（書きはじめると3分タイマーが静かに動きます）。
3. 「今日を保存する」で記録を保存します。すでに今日のぶんがある場合は、上書き確認のモーダルが出ます。
4. 保存後は「明日の一歩」がカードとして表示され、下部の「これまでの記録」に追加されます。
5. 過去の記録はタップで詳細を開き、今日のぶんは編集、各記録は削除ができます。

タイマーは「開始 / 一時停止 / 再開 / リセット」を手動でも操作できます。書くきっかけと集中のための補助で、時間切れでも記録は妨げません。

データ保存・プライバシー

• 記録はすべてこの端末のブラウザの localStorage にだけ保存されます。
• サーバー送信や外部 API 呼び出しは一切ありません。
• 保存キーは three-minute-journal:v1 です。
• 1件の記録は次の構造で保存されます。

``json { "id": "2026-06-26", "date": "2026-06-26", "happened": "...", "feeling": "...", "nextStep": "...", "createdAt": "...", "updatedAt": "..." } ``

• ブラウザの履歴やサイトデータを消去すると記録も消えます。別の端末やブラウザとは同期しません。

技術

• 依存ライブラリなしの素の HTML / CSS / JavaScript による静的ページ。Cloudflare Pages でのサブディレクトリ配信を前提にしています。
• PC・スマホ両対応のレスポンシブレイアウト。
• 確認や通知は、ブラウザ標準の alert() / confirm() を使わず、アプリ独自のモーダルとトーストで行います。
• 3分タイマーは SVG のリングと setInterval で表現しています。
• 用意された画像アセット（背景・設問カード・明日の一歩など）を装飾に使いつつ、読み込めない場合も CSS の罫線・カード・メーターだけで主要 UI が成立するフォールバックを備えています。
• prefers-reduced-motion に配慮し、アニメーションを抑える設定にも対応します。

ファイル構成

002-three-minute-journal/
  index.html        画面とメタ情報
  css/style.css     藍と薄金の研究ノートスタイル
  js/app.js         入力・タイマー・保存・履歴・共有のロジック
  assets/           バナー / favicon / 背景 / 装飾画像
  README.md         このファイル
  STATUS.txt        レーン同期用の状態ファイル

共有

ページ下部の「Xでポストする」から、ハッシュタグ #3分日記 と公開 URL を添えて投稿できます。「リンクをコピー」で URL だけを取得することもできます。