ワダチを作る #10：連続日数を主役にしない「積み上がり」を、数え方から作った

前回（#9）で、戻す手順を試して、Notion の5年分を取り込みました。今回は、ステップ3（過去の実績を見せる段階）の中身です。

• 「積み上がり」の数え方を、画面より先に決めた
• 記録の画面に、直近と通算を出した
• 休んだあとに、「3 日ぶりです」と出した
• 習慣ごとの画面に、年ごとの日数を出した

数え方を、先に決めて、画面から切り出した

ワダチの一番大事な設計原則は、連続日数を主役にしないことです。「途切れた」ことを数字で見せず、「積み上がった」ことを見せます。では、何をどう数えるのか。ここが決まっていないと、画面は作れません。

そこで、画面より先に、数え方だけを、画面にもデータベースにも触らない関数として作りました。ユニットテストで固めて、画面は、その結果を出すだけにします。決めたことは、次のとおりです。

• 数えるのは、期間の中の「やる日」だけ。始める前・休止中・やめたあと、曜日指定のやらない曜日は、分母にも分子にも入れない
• やらない曜日に付けた記録は、分子にも分母にも入れず、無視する（読書は平日だけの習慣ですが、たまたま日曜にやることもあります。それを数に入れると、割合が崩れます）
• 毎日の習慣は、直近 7 日・30 日・通算
• 曜日指定の習慣は、やる曜日だけを分母にする（「直近 30 日の平日 22 日のうち 22 日」）
• 週○回の習慣は、週で数える。「達成」は、その週の回数が目標以上。今週は途中なので、達成の週には数えず、「今週 2/3」だけ
• 期間の途中で始まった週や、休止にかかる週は、7 日すべてが期間の中の週だけ数える（始めたばかりの週を、「できなかった週」にしない。責めない）

テストは、日付の境界に時間をかけました。月またぎ、年またぎ、うるう日（2024 年 2 月 29 日）、週の区切り（日曜と月曜）、期間の最初の日と最後の日、休止と再開。記録が 0 件のとき、割合が NaN や 0 除算にならないことも、確かめています。

記録の画面に出す

毎日の記録の画面で、各習慣に、次のように出しました。

• 毎日：「直近 7 日で 6 日・30 日で 27 日」、その下に小さく「通算 1,670 日（93%）」
• 曜日指定：「直近 30 日の平日 22 日のうち 22 日」
• 週○回：「今週 2/3・直近 4 週のうち 3 週で達成」

基準日は、見ている日です。前の日に戻ると、その日を基準にした数字になります。記録が 1 件もない習慣には、何も出しません（「まだ記録がありません」と責めない）。

スマホで、改行されすぎた

実際に開発環境で見ると、スマホでは、この数字が、2〜3行に折り返して、見にくくなりました。

原因は、名前の列が狭いことです。チェック・アイコン・「▶ 10分」のボタンに挟まれて、名前の列は、スマホで約 160px しかありません。そこに、積み上がりの2行を入れていました。案Aにしました。積み上がりを、1 行目（チェック・アイコン・名前・▶）の下に、枠の幅いっぱいで出す形です。

休んだあとの、ひとこと

「休んだ日があっても、積み上がった跡は消えない」という考えを、画面の言葉にしました。空いたあとに「やった」を付けると、その枠に、**「3 日ぶりです。また始めましたね」**と出ます。

決めたことは、次のとおりです。

• 付けた、その場だけ出す（保存しない。再読み込みで消える）
• 「N 日ぶり」の N は、前の記録の日から、今回までの日数
• 毎日の習慣は、やる日を 2 日以上飛ばしたとき（前の記録が 3 日以上前）
• 曜日指定の習慣は、やる曜日だけで数える（金曜 → 月曜は、飛ばしていないので出ない）
• 週○回の習慣は、7 日以上空いたとき
• 初めての記録、同じ日にもう一度送られたとき、チェックを外したとき、休止を挟んだ再開（前の記録が別の期間）では、出さない
• 「途切れた」「連続」という言葉は、使わない（テストでも確かめる）

判定は、これも、画面から切り出した関数です。

習慣ごとの画面と、年ごとの日数

記録の画面は、数字を増やしたくないので、**詳しいものは、習慣ごとの画面（/habits/[id]/progress）**に分けました。通算を大きく出し、その下に直近の数え方。そして、年間推移です。「2022 年 340 日 / 2023 年 345 日…」と、年ごとの日数が出ます。座禅は、取り込んだ5年分で、毎年 340 日台です。

年間推移は、既定で閉じていて、開くと出ます。毎回見るものではないからです。そして、その年に「やった」がある年だけ出します。記録のない年を、「0 日」と出すと、始める前の年や、休止していた年が、できなかった年に見えてしまいます。

おわりに

• 画面を作る前に、数え方を、純関数にして、ユニットテストで固める。日付の境界（うるう日・年またぎ・週の区切り）は、ここで見つかる
• 数え方で迷ったところ（今週を達成に入れるか、始めたばかりの週をどうするか）は、責めない方に倒す。原則が、そのまま判断の基準になった
• 画面に出してみて、はじめて、スマホで改行されすぎることが分かった。実際の画面で、案を並べて決めた
• 言葉は、機能の一部。「途切れた」「連続」を使わない、ことも、テストにした

次回は、見た目の直し（チェックボックス・一覧）と、習慣の並べ替え、そして、ここまでを本番に出した話です。