Free
🧘 Wellness
CROSS_PLATFORM

Stride Fitness

Fitness dashboard app with animated activity rings, streak flames and workout cards that feel like achievements.

8 views 0 copies 362 palavras

O prompt

# Stride — Fitness Dashboard App

## Goal
Design and build "Stride", a fitness dashboard app. Feel: energetic but never shouty — a coach who celebrates consistency over intensity. Every screen should feel native-quality — fluid, tactile, zero jank.

## Visual Language
- **Palette**: charcoal #101214 base, elevated card #1A1D21, signal orange #FF6B35 for primary metrics, mint #4ADE80 for completed goals, text off-white
- **Type scale**: large title 32-34px bold, section header 20px semibold, body 16-17px, caption 13px.
- **Surfaces**: layered backgrounds (base / elevated card / sheet), 20px card radius, subtle 1px hairline separators.
- **Iconography**: consistent 24px stroke icons, 1.75px stroke weight.

## Screens
1. **Home** — today's three activity rings (move/exercise/stand) animate on open; below: streak flame with count, weekly bar chart, 'Today's focus' card.
2. **Workout detail** — exercise list with checkable rounds (haptic on complete), rest timer sheet with a radial countdown, 'Finish' morphs to celebration state.
3. **Progress** — month grid heatmap (GitHub-style, orange intensity), PR badges row, weight/strength trend line chart.
4. **History** — grouped workout cards: date chip, duration, volume, one-tap 'Repeat'.
5. **Profile/Settings** — goal sliders that snap to sane values, unit toggle, quiet-hours for reminders.

## Interactions & Motion
- Rings sweep open with staggered spring on Home mount; long-press a ring to see its breakdown sheet.
- Checking an exercise: circle draws its stroke, row strikes through softly, progress header ticks up.
- Streak flame flickers (subtle loop); missing a day shows it as a gentle ember, never a guilt screen.
- Pull-to-refresh on History reveals a motivational one-liner.
- Spring physics for all transitions (stiffness ~260, damping ~24); never linear easing.
- Skeleton loaders for every async surface; optimistic UI for user actions.

## Details That Matter
- All numbers tabular; charts hand-rolled SVG (no chart lib) with drawing animations.
- Celebrations: single confetti burst on goal completion only — rare rewards stay rewarding.
## Tech & Quality Bar
- React Native + Expo + TypeScript (or Flutter if requested). Reanimated for 60fps gestures.
- Dark & light mode from a single token file. Safe-area aware on all screens.
- Haptics on key confirmations. Offline-tolerant: cache last data, show stale-while-revalidate.

Você também pode gostar

Verified DR - Verified Domain Rating for buildpromptkit.comBuildPromptKit - AI prompts that ship real UI — every one has a live demo | Product HuntBuildPromptKit — AI Website & App Prompts - Featured on YizhanFeatured on saasfame.comFeatured on Twelve Tools