§12-01Engagement
Streak (連続)
連続して利用した日数を数えて表示する。
続けた日数を見せ、途切れさせたくない気持ちで習慣化を後押しする。学習や運動記録など、毎日の継続自体が価値になるサービスに向く。
実装のポイント
日付の境界はユーザーのタイムゾーンで判定し、1 日休んでも即リセットしない「フリーズ」枠を用意すると離脱を防げる。今日の未達状態を明示して行動を促す。
- 特徴
- CSS のみ
- デモで使っているもの
- lucide-react
§12-01Engagement
連続して利用した日数を数えて表示する。
続けた日数を見せ、途切れさせたくない気持ちで習慣化を後押しする。学習や運動記録など、毎日の継続自体が価値になるサービスに向く。
日付の境界はユーザーのタイムゾーンで判定し、1 日休んでも即リセットしない「フリーズ」枠を用意すると離脱を防げる。今日の未達状態を明示して行動を促す。