feat: Add GlowTrack mood and habit wellbeing grid specifications
- Introduced export schema for JSON data structure. - Created renderer contract detailing canvas/SVG rendering requirements. - Defined IndexedDB storage schema and migration strategies. - Documented data model including entities and relationships. - Developed implementation plan outlining execution flow and project structure. - Provided quickstart guide for development environment setup. - Compiled research documentation on performance, accessibility, and theming. - Established feature specification with user scenarios and functional requirements.
This commit is contained in:
31
specs/001-glowtrack-a-mood/contracts/renderer.md
Normal file
31
specs/001-glowtrack-a-mood/contracts/renderer.md
Normal file
@@ -0,0 +1,31 @@
|
||||
# Renderer Contract — Canvas/SVG
|
||||
|
||||
## Purpose
|
||||
Render a grid of DayTiles with mood hue, glow intensity from net habit score, negative overlay static, and glyph counts.
|
||||
|
||||
## Inputs
|
||||
- containerSize: { width: px, height: px, devicePixelRatio }
|
||||
- days: DayTile[] (ordered by date)
|
||||
- theme: palette + CSS variables
|
||||
- options:
|
||||
- showLegend: boolean
|
||||
- pngScale: number (for export)
|
||||
|
||||
## Outputs
|
||||
- On-screen render at 60 fps target
|
||||
- Exported PNG at screen resolution (pngScale defaults to 1.0)
|
||||
|
||||
## Rules
|
||||
- Base hue from mood.hue; luminance curve f(netScore) with easing and clamping
|
||||
- Negative entries: apply subtle static texture overlay (non-hue-altering)
|
||||
- Glyphs: ticks = count(positive), dots = count(negative)
|
||||
- No hue change from overlays; only luminance/texture affected
|
||||
|
||||
## Performance
|
||||
- Batch draw tiles; minimize layout/paint; avoid per-frame allocations
|
||||
- Prefer Canvas for tiles; SVG for glyph overlays and interactive focus rings
|
||||
- Ensure keyboard focus indicators meet WCAG AA contrast
|
||||
|
||||
## Accessibility
|
||||
- Keyboard navigable tiles (tab/arrow); ARIA labels describing day, mood, counts
|
||||
- High-contrast theme variant; color-blind palettes via CSS variables
|
||||
Reference in New Issue
Block a user