Skip to content

fix(design): drop cyberpunk category gradients and decorative warm colors - #15

Merged
johnnyhuy merged 5 commits into
mainfrom
feat/refine-app-design
Jul 27, 2026
Merged

fix(design): drop cyberpunk category gradients and decorative warm colors#15
johnnyhuy merged 5 commits into
mainfrom
feat/refine-app-design

Conversation

@johnnyhuy

@johnnyhuy johnnyhuy commented Jul 27, 2026

Copy link
Copy Markdown
Contributor

Summary

Aligns two more surfaces with the design system's color rules.

  • Exercise timelines (StaticTimelineRow and UnifiedExerciseTimeline) drop per-category gradient pairs (blue/cyan, purple/pink, orange/yellow, yellow/orange, red/orange, green/teal). These weren't in the design system and read as a neon-fitness aesthetic that fights the recovery palette. Both now use a single tinted ember surface with SF Symbol differentiation, so categories stay visually distinct without inventing colors.
  • Health stats in ProfileView were using arbitrary per-stat colors (.red, .orange, .blue, .purple). Now aligned:
    • BMI "Normal" → BFColors.success (semantic for healthy range)
    • Strength Score "Advanced" → BFColors.brandAccent (positive tier accent, not warning amber)
    • Resting HR → BFColors.textSecondary (was red, now neutral — HR isn't a status signal)
    • Active Cal "Today" → BFColors.brandAccent (active state)
    • Real-stats icons (Total Workouts / Total Volume / Time Active) → all brandAccent instead of mixed orange/blue/purple

Consequences

  • Better visual coherence with the design system. Ember still appears in its semantic role (action, accent, active state); red still appears for recovery: sore (recovery dots, destructive actions). The warm-tone overlap only happens where one of those two roles is appropriate.
  • Removed two helper functions (gradientColors per timeline) and a categoryColor switch.
  • No behavioural change; all changes are visual.

Testing

  • 95 SwiftPM tests pass.
  • Visual: Workout home timeline now shows uniform ember-tinted previews with white SF Symbols; Plan tab timeline matches; Profile stats now read clean (no red heart, no random blues/purples).
  • Targeted UI test passes.

Co-authored-by: opencode-agent noreply@opencode.ai

johnnyhuy and others added 5 commits July 27, 2026 13:03
@johnnyhuy opencode-agent
fix(iOS): remove invalid UIApplicationSceneManifest blocking launch
decc5d3 
The auto-generated scene manifest declared an empty
UISceneDelegateClassName, which prevented UIKit from installing a
scene delegate and left the app on a black launch screen on
iOS 26 simulators. Removing the manifest lets SwiftUI's
WindowGroup attach directly.

Co-authored-by: opencode-agent <noreply@opencode.ai>
@johnnyhuy opencode-agent
feat(design): add identity tokens and BetterFit mark mascot
8629b14 
The mascot was rendered with the ember product accent, which the
design system reserves for ordinary product actions. Identity
yellow is for brand moments only, so the mascot now mirrors
the BetterFit mark (three compressed ovals in identity yellow
with black features for contrast) and a new `identity` token
lives in BFColors alongside identityInk and identitySurface.

The profile header swaps its generic avatar for the new
EmberMascot, and athlete illustrations on workout cards stay
on the ember product accent (correct per the posture rule).

Co-authored-by: opencode-agent <noreply@opencode.ai>
@johnnyhuy opencode-agent
feat(ios): lead with next action and tighten Workout/Plan layouts
f4f8f70 
Restructure Workout home and Plan to follow the design-system
flow rule: lead with the next action or conclusion, then support
it; do not fill the screen with metrics.

Workout home:
- greeting 'Hello! Demo' -> 'Hello, Demo' (proper comma, single
  voice, no debug-flag feel)
- workout overview collapses seven metrics into one
  conclusion line + recovery %; the category split was an
  echo of the heatmap below
- workout preview reads from the currently-displayed suggested
  workout, so Target Muscles stays in sync with Up Next
- Apple Health banner collapses two icon buttons into a single
  tappable card; long-press exposes Dismiss

Plan:
- page padding 16 -> 20 per spec
- empty-day state becomes a clear 'Add exercises' primary CTA
  on a 16pt card instead of a dashed ghost button
- recovery row corner radius aligned to BFRadius.card

Co-authored-by: opencode-agent <noreply@opencode.ai>
@johnnyhuy opencode-agent
docs(readme): add screenshots and marketing showcase
030f0db 
Adds a polished README with:
- tagline and identity copy
- retina (@2x) iOS screenshots in a comparison grid
- 'why BetterFit' principles aligned to the design system
- feature overview table
- install, run, and docs links

Co-authored-by: opencode-agent <noreply@opencode.ai>
@johnnyhuy opencode-agent
fix(design): drop cyberpunk category gradients and decorative warm co…
86a1c22 
…lors

The exercise timeline previews used per-category gradient pairs
(blue/cyan, purple/pink, red/orange, green/teal) that don't
exist in the design system and read as a neon-fitness aesthetic.
Both StaticTimelineRow and UnifiedExerciseTimeline now use a
single tinted ember surface with SF Symbol differentiation, so
exercise categories stay visually distinct without inventing
colors that fight the recovery palette.

ProfileView health stats were using .red, .orange, .blue, .purple
arbitrarily. Re-aligned:
- BMI 'Normal' -> success (green, semantic for healthy range)
- Strength Score 'Advanced' -> brandAccent (ember, positive tier)
- Resting HR -> text secondary (was red, now neutral; HR isn't
  a status signal)
- Active Cal 'Today' -> brandAccent (active state)
- Real-stats icons (Total Workouts / Total Volume / Time Active)
  -> brandAccent instead of mixed orange/blue/purple

Consequences: better visual coherence with the design system.
Recovers, destructive actions, and the streak indicator are
unchanged; ember and red still appear in their semantic roles
(action and recovery: sore / destructive).

Co-authored-by: opencode-agent <noreply@opencode.ai>
@johnnyhuy
johnnyhuy merged commit 5aea84d into main Jul 27, 2026
4 of 6 checks passed
@johnnyhuy
johnnyhuy deleted the feat/refine-app-design branch July 27, 2026 04:45
@github-actions github-actions Bot mentioned this pull request Jul 27, 2026
Closed
johnnyhuy added a commit that referenced this pull request Aug 9, 2026
@johnnyhuy @opencode-agent
fix(design): drop cyberpunk category gradients and decorative warm co…
7b9fd42 
…lors (#15)

* fix(iOS): remove invalid UIApplicationSceneManifest blocking launch

The auto-generated scene manifest declared an empty
UISceneDelegateClassName, which prevented UIKit from installing a
scene delegate and left the app on a black launch screen on
iOS 26 simulators. Removing the manifest lets SwiftUI's
WindowGroup attach directly.

Co-authored-by: opencode-agent[bot] <219766164+opencode-agent[bot]@users.noreply.github.com>

* feat(design): add identity tokens and BetterFit mark mascot

The mascot was rendered with the ember product accent, which the
design system reserves for ordinary product actions. Identity
yellow is for brand moments only, so the mascot now mirrors
the BetterFit mark (three compressed ovals in identity yellow
with black features for contrast) and a new `identity` token
lives in BFColors alongside identityInk and identitySurface.

The profile header swaps its generic avatar for the new
EmberMascot, and athlete illustrations on workout cards stay
on the ember product accent (correct per the posture rule).

Co-authored-by: opencode-agent[bot] <219766164+opencode-agent[bot]@users.noreply.github.com>

* feat(ios): lead with next action and tighten Workout/Plan layouts

Restructure Workout home and Plan to follow the design-system
flow rule: lead with the next action or conclusion, then support
it; do not fill the screen with metrics.

Workout home:
- greeting 'Hello! Demo' -> 'Hello, Demo' (proper comma, single
  voice, no debug-flag feel)
- workout overview collapses seven metrics into one
  conclusion line + recovery %; the category split was an
  echo of the heatmap below
- workout preview reads from the currently-displayed suggested
  workout, so Target Muscles stays in sync with Up Next
- Apple Health banner collapses two icon buttons into a single
  tappable card; long-press exposes Dismiss

Plan:
- page padding 16 -> 20 per spec
- empty-day state becomes a clear 'Add exercises' primary CTA
  on a 16pt card instead of a dashed ghost button
- recovery row corner radius aligned to BFRadius.card

Co-authored-by: opencode-agent[bot] <219766164+opencode-agent[bot]@users.noreply.github.com>

* docs(readme): add screenshots and marketing showcase

Adds a polished README with:
- tagline and identity copy
- retina (@2x) iOS screenshots in a comparison grid
- 'why BetterFit' principles aligned to the design system
- feature overview table
- install, run, and docs links

Co-authored-by: opencode-agent[bot] <219766164+opencode-agent[bot]@users.noreply.github.com>

* fix(design): drop cyberpunk category gradients and decorative warm colors

The exercise timeline previews used per-category gradient pairs
(blue/cyan, purple/pink, red/orange, green/teal) that don't
exist in the design system and read as a neon-fitness aesthetic.
Both StaticTimelineRow and UnifiedExerciseTimeline now use a
single tinted ember surface with SF Symbol differentiation, so
exercise categories stay visually distinct without inventing
colors that fight the recovery palette.

ProfileView health stats were using .red, .orange, .blue, .purple
arbitrarily. Re-aligned:
- BMI 'Normal' -> success (green, semantic for healthy range)
- Strength Score 'Advanced' -> brandAccent (ember, positive tier)
- Resting HR -> text secondary (was red, now neutral; HR isn't
  a status signal)
- Active Cal 'Today' -> brandAccent (active state)
- Real-stats icons (Total Workouts / Total Volume / Time Active)
  -> brandAccent instead of mixed orange/blue/purple

Consequences: better visual coherence with the design system.
Recovers, destructive actions, and the streak indicator are
unchanged; ember and red still appear in their semantic roles
(action and recovery: sore / destructive).

Co-authored-by: opencode-agent[bot] <219766164+opencode-agent[bot]@users.noreply.github.com>

---------

Co-authored-by: opencode-agent[bot] <219766164+opencode-agent[bot]@users.noreply.github.com>
@github-actions github-actions Bot mentioned this pull request Aug 9, 2026
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

1 participant

@johnnyhuy