Life System · concept · personal PWA

Операционная панель для жизни.
Не чек-лист.

365 дней. 7 сфер. Каждый день — одна звезда на сферу. Стрики компаундируются, недели складываются в годовой trajectory. Habit-трекеры умирают через 2 недели, потому что они оторваны от целей и ощущаются как обязаловка. Здесь по-другому: каждая сфера — отдельный track с собственным ритмом и квартальным фокусом, квесты — конкретные специфические действия со ссылками, прогресс показан как приборная панель пилота, а не галочки.

7
domains
Body · Mind · Inner · Family · Social · Craft · Creative
21
specs
3 трека внутри каждой сферы. Один день закрыт когда все активные — lit
365
day cycle
Год = одна revolution. 32% завершённости видны как ring-progress
4
screens
Today · Quest · Atlas · Me — четыре среза одной системы
▎ ЗАЧЕМ ЭТО

Личная операционка,
а не привычки.

Когда ты управляешь капиталом или операционкой компании, у тебя есть приборная панель — ты видишь все ключевые метрики одним взглядом, понимаешь что в норме, что отстаёт, куда направить внимание. Для жизни такого нет. Habit-tracker'ы предлагают список галочек, fitness-приложения — счётчик шагов, journal-приложения — текстовое поле. Ничто не показывает trajectory жизни целиком.

Life System — это попытка сделать тот самый дашборд. Семь сфер, разные ритмы, конкретные точечные действия со ссылками на источники, годовой ring-progress, weekly heatmap. На главном экране — что делать прямо сейчас. На Atlas — где ты в году. На Me — куда движешься в горизонте.

7 СФЕР · domains
  • Bodyдвижение, сила, восстановление
  • Mindчтение, deepwork, языки, output
  • Innerвнимание, дыхание, психо-практика
  • Familyфокусное время с близкими
  • Socialnetwork, дружбы, общение вне работы
  • Craftпрофессиональный рост, операторские навыки
  • Creativeсоздание контента вне работы
МЕХАНИКА · how it works
  • Звезда = litСделал что-то в сфере сегодня — звезда зажглась. День "закрыт" когда все активные звёзды залиты.
  • Streak = compoundingКаждый день в сфере подряд — стрик растёт. x47 = 47 дней подряд. Гайд для глаз: чем длиннее, тем заметнее на тайле.
  • Квест = спецификаНе "поучи английский" — а "Cambly 30 min с native speaker". Каждый вариант — конкретное действие со ссылкой на источник.
  • Cadence per domainBody ходит в зал 3× в неделю — это не daily. Inner — daily 5 минут дыхания. Каждая сфера сама определяет ритм.
  • Atlas = trajectoryHeatmap по неделям, sparkline по 17 неделям. Видишь не только "сегодня", но и куда движешься за квартал.
▎ 01 / 04 · TODAY

Today.
Что делать сейчас.

Главный экран. Открываешь утром — видишь все сферы которые ещё не закрыл сегодня: каждая как карточка с конкретным квестом и duration. Первая (next-target) пульсирует жёлтой полоской — туда метит внимание. Залитые сферы уезжают вниз компактным списком "done". Arc-gauge сверху показывает прогресс дня: 3 / 7 lit. Снизу — 24-часовая полоса с маркером "now". Один экран = весь день.

Tue 27 Apr 14:05 live 43%
3/7
lit

The day is open.
Four left.

up next 17:00 → 17:30
Board game with Vera, no phones
Body
47d
Mind
12d
Inner
33d
Social
4d
Craft
18d
Creative
2d
Day timeline 10h ahead
0610141822

Что внутри Today

Главный экран собран как приборная панель. Сверху – pill-bar с датой, временем, "live" и общим прогрессом. Затем arc-gauge с дробью 3/7 и ряд из 7 домен-иконок (lit / next / dim).

  • Now-card – анимированный ticker-bar сверху, градиентная иконка домена, прогресс-бар "уже идёт"
  • Tile-сетка 3×2 – sparkline + название + streak на каждом домене, fade-in stagger при загрузке
  • 24h timeline – маркер "now" с подписью, dim-точки для будущих квестов, glow на следующем
arc gauge live ticker 7 domain icons stagger anim timeline
▎ 02 / 04 · QUEST DETAIL

Quest. Конкретное действие.

Тапаешь любую сферу — открываешь её квест на сегодня. Не "почитай что-нибудь", а "Howard Marks memo: The Most Important Thing — Risk · oaktreecapital.com". Не "проведи время с семьёй", а "20 min board game with Vera, no phones". Большая жёлтая orb-иконка домена, заголовок-action, описание-контекст, три stat-карты (duration / streak / status), reference на источник где брать материал. Внизу — Mark [Domain] done. Один тап — звезда зажигается.

today FMLY · 17:00
family
Board game with Vera, no phones.
Sit on the floor, at her eye level. One round of "First Orchard" or stacking blocks. Eye contact > the board.
duration
30min
streak
x12
window
17:00
12:00
left
live
Started at 17:00. 18 of 30 minutes elapsed.
sub-actions
Phone in another room
Pick a game Vera chose last time
Sit at her eye level on the floor
Let her direct, even wrong moves
End on her cue, not yours
reference
"Trust is the dividend of presence."
Esther Wojcicki · ch. 3 · wojcicki.com/trust

Что внутри Quest Detail

Полный экран на квест: всё для исполнения и для понимания контекста.

  • Glowing orb – градиентная сфера-домен, pulse-анимация
  • 3 stat-карты – duration / streak / window. Числа – Bricolage 22pt
  • Live timer – progress-ring с обратным отсчётом + RESUME кнопкой
  • Custom checkboxes – квадрат с галочкой при заполнении, fill-анимация
  • Reference card – мини-обложка книги + цитата серифом + кликабельный URL
  • Primary CTA – большая жёлтая кнопка "Mark complete" с иконкой
orb icon timer ring checklist book ref 2 ctas
▎ 03 / 04 · ATLAS

Atlas. Где ты в году.

Trajectory view. На сегодня смотришь Today — но что если посмотреть с высоты квартала? 7×7 heatmap (7 сфер × 7 дней) сразу показывает где густо, где пусто, где есть пробелы. 17-недельный спарклайн снизу — годовая динамика. Hero-метрика 31 / 49 = stars on the week, дельта vs прошлой. Это не "достижения", это видеть себя в движении. Без этого жизнь чувствуется как каждый день заново — здесь видна линия, которая складывается в год.

Wk 17 · Apr 21 — 27
31/49
+8 vs prev
stars · best 47 (wk 11)
cycle
63%
vs goal 70%
best day
7
all lit · sun
missed
3
slots
MTWTFSS
Body
Mind
Inner
Family
Social
Craft
Crtv
less
more
17 weeks · stars / wk +24%

Что внутри Atlas

Бэк-офис системы. Видишь не только сегодня, но и неделю + куда ты идёшь по году.

  • Week pill-bar – навигация назад/вперёд по неделям
  • Hero metric 31/49 – Bricolage 56pt + chip-дельта "+8 vs prev"
  • 3 mini-stats – cycle %, best day, missed slots
  • 7×7 heatmap – staggered fade-in, today обведён
  • 17-week sparkline – draw-анимация, точка-маркер на текущей неделе, area-fill
heatmap delta chip stagger spark draw marker dot
▎ 04 / 04 · ME

Me. Куда ты движешься.

Самый дальний zoom-out. Год — одна revolution. 32% этой revolution прошло — это не дата, это сделанный путь. 487 stars из 819 возможных, daily average 4.2, лучшая неделя — wk 11 с 42-мя. Снизу — leaderboard активных стриков по 7 сферам, отсортированный по длине. Самая длинная — Body x47 — это 47 дней подряд движения. Видишь не только прогресс, но и приоритеты: где ты вкладываешь систематически, а где провисаешь.

Saša
YR 1 · D117
since 1 Jan
32%
year
total
487
/ 819
avg
4.2
/ day
best wk
42
wk 11
cycle
59%
goal 70
active streaks
Body
x47
Inner
x33
Craft
x18
Family
x12
Mind
x12
Social
x4
Creative
x2

Что внутри Me

Год на ладони. Hero – большое кольцо прогресса. Снизу четыре статистики и рейтинг стриков по 7 доменам.

  • Year ring – ring-fill анимация на загрузке (1.8s)
  • 32% число – Bricolage 56pt внутри кольца
  • 4-сегментная статистика – total / avg / best wk / cycle
  • Streak ladder – 7 доменов отсортированы по длине стрика, bar-grow анимация задержанная (delay 0.6s)
year ring stats grid streak ladder bar grow domain icons
▎ COMPONENT LIBRARY

Vocabulary vivente.

Словарь, которым собираются все экраны. Каждый компонент тестируется здесь – цвет, форма, анимация. Когда придёт время кодить — вот что будет в `components/`.

01 buttons
Кнопки
Три уровня вызова. Primary – основное действие, ghost – вторичное, mono — техническое.
02 chips
Tags & pills
Statusы – live, streak, delta. Mono шрифт, signal yellow, pill-форма.
live x47 +8
paused x4 -2
03 icons
7 доменов
Custom SVG, не Lucide. Hover = заливка жёлтым + lift.
BodyMindInnerFmlySoclCrftCrtv
04 tiles
Tiles · 4 state
lit (сделано) / next (следующий, glow) / dim (предстоящий) / done (тёплый soft).
Body
x47
Social
--
05 sparks
Sparklines
Активные – signal yellow, dim – #3A3A3A. Загрузка – path-draw 1.4s.
06 gauges
Rings & arcs
Прогрессы. Полный круг (year), полу-круг (day), мини (timer).
70%
3/7
12'
07 colour
Tokens
Один accent. Всё остальное – серая шкала и near-black.
Signal yellow
#FFD60A · accent · use sparingly
Near-black
#050505 · base bg
Foreground
#ECECEC · primary text
Muted
#6E6E6E · secondary, mono labels
08 type
Type scale
Display – Bricolage. Body – Inter Tight. Numbers – Geist Mono. Italics & quotes – Fraunces.
Display 36 / 200
Heading 22 / 300
Body 14 / 500
MONO 11 / 600 · accents
"italic Fraunces, for quotes"
09 motion
Anim tokens
Все на CSS @keyframes. Никаких Framer/Lottie.
pulse · 1.4s blink · live dots
tick · 2.4s linear · active quest bar
draw · 1.4s ease-out · sparkline path
fill · 1.8s ease-out · ring progress
grow · 4s alternate · in-progress bar
stagger · 0.5s + 0.1s/i · tile fade-in
glow · 2s · next-up emphasis
▎ ROADMAP

Это работающий продукт,
не мокап.

Сейчас приложение задеплоено как PWA и используется ежедневно. 7 сфер · 21 спец · simplified quest variants со ссылками на источники · stars / streaks / atlas / ring. Всё что выше — реальные экраны, не картинки.

Что в работе:

Q2 2026 · сейчас
Goals interview по доменам
Прохожу 7 доменов структурированными вопросами. Затем активирую специ + наполняю quest variants под мои реальные цели на год.
Q3 2026 · далее
Real Atlas + Me data
Heatmap и кольцо года перейдут с placeholder'а на реальные entries из БД. Quarterly focus toggle. Monthly themes per spec.
Q3-Q4 · network
Social subsystem
Категоризация контактов, relationship-граф, AI-рекомендации с кем взаимодействовать когда. Возможно отдельное приложение.
2027 · ai layer
AI assistant + Whoop
Claude API подключается к Atlas — даёт еженедельные insights и подсказывает корректировки. Whoop integration для Body domain (recovery / strain / sleep).
"Habit-tracker'ы умирают через 2 недели потому что они отделены от целей. Здесь — наоборот."