3.9 KiB
FightRate Design Context
Design Context
Users
FightRate is for combat-sport athletes and coaches during boxing, Muay Thai, jiu-jitsu, MMA, conditioning, pad work, sparring, and heavy bag sessions. The athlete starts the app before training, leaves the phone aside, and expects heart-rate monitoring to keep running while the screen is locked. During training they cannot babysit the interface.
Use Cases
- Monitor heart rate continuously all day/session-long from a BLE chest strap such as Magene H003.
- Mark a training window by pressing start and stop; that window is highlighted later in history while the underlying heart-rate stream continues to be stored.
- Open saved history items and inspect the exact training window with real timestamped BPM data.
- Extract as much useful training information as possible from captured data: max/min/avg BPM, zones, load, effort spikes, recovery patterns, density, and session notes.
- Diagnose sensor state clearly without fake statuses or fake data.
Brand Personality
Industrial, precise, uncompromising. The product should feel like a physical corner instrument used by a fight team: durable, technical, serious, and immediately legible under pressure.
Aesthetic Direction
Corner Instrument. Dark, physical, rugged surfaces; high-contrast numbers; technical strips; timeline/window metaphors; no generic SaaS cards, no nested cards, no decorative fake analytics, no soft consumer wellness look. The interface should look like training equipment, not a dashboard template.
Design Principles
- Continuous capture is the core product. A workout is a marked window inside the continuous stream, not the whole lifetime of monitoring.
- Every metric must come from real timestamped samples. Empty states must explain what data is missing.
- Replace generic cards with instrument surfaces, rails, strips, separators, and timeline details.
- History must be inspectable: saved windows open into detailed, timestamped training evidence.
- UI copy stays PT-BR; code identifiers stay English.
Estado atual (2026-06-15)
Direção 01 — Corner Instrument refinada para Instrumento Forte (release v2). Mudanças:
- JetBrains Mono tabular em todos os displays numéricos (BPM 110px, métricas 28px, detalhes 18px, score 56px). Fontes bundled em
assets/fonts/JetBrainsMono-{Regular,Medium,Bold,ExtraBold}.ttf+android/app/src/main/assets/fonts/.fontVariant: ['tabular-nums']para alinhamento perfeito de dígitos. - 6 novos componentes (LiveDot, PressableSurface, EmptyState, DialTile, TrackRow, InsightRow) e 2 hooks (usePulseAnimation, useMotionPreference). 9 novos testes TDD.
- Animações orquestradas via Reanimated 4 + Worklets 0.9: LiveDot pulse (1.6s), BPM pulse condicional (0.8s), stop alert ring durante captura (1.6s), tab cross-fade (200ms), stagger reveal em listas (50ms por row), press feedback refinado (scale 0.96/opacity 0.82), pin pulse 1.4→1 com easeOutBack.
- TrainingChart refinado: 6 furos laterais (1.5×4px) estilo ECG + LiveDot no readout.
- BLE, SQLite, hooks de monitor NÃO foram tocados — apenas refinamento de UI/UX.
- applicationId preservado:
com.healthtracking.fightrate— APK instala por cima da versão anterior mantendo dados. - Tokens adicionados ao
src/theme/:displayNumeric,displaySmallNumeric,metricNumeric,detailNumeric,ringWarn,motion.{easeOutQuart, easeOutExpo, easeOutBack, easeInOutQuart, duration, stagger}. - Componentes existentes modificados sem breaking change: ActionButton (stopAlert), StatusTag (size), SectionPanel (divider, subtle), MetricTile (numeric).
Próxima iteração: avaliar Direção C (Cinemática) — entrada de tela com reveal, transições slide, sombras direcionais, esqueletos geométricos.
Verificação: npm run typecheck (0 erros), npm test -- --runInBand (74/74 passa), npm run lint (config pre-existente, erro de jest/globals — não bloqueante). APK 32.5 MB → 9.8 MB (.7z).