ACurrent
1
2
3
4
5
BNew
1
Back arrow replaces dismiss
Close X→Back arrow. Standard mobile navigation. The X read as modal in a non-modal context.
2
Favourite promoted to header
Heart icon top-right makes saving a primary, persistent action — visible even after scroll.
3
Title in its own surface
Overlay on image→Dedicated card with PROGRAM eyebrow. Bigger title, more breathing room.
4
Trainer attribution added
"by Denise Harlass" — the person behind the program is surfaced at the top, not buried.
5
CTA: calmer, more confident
Orange "START NOW"→White floating pill "Start Program". Doesn't fight the brand orange in the hero. Sentence case.
ACurrent
1
2
3
4
BNew
1
Sticky header collapses cleanly
Persistent full hero→Title-only sticky bar. Frees vertical space for what users came to see.
2
Cleaner equipment row
A row of icons and labels users will recognise from across the app — same component, same pattern, same expectations.
3
Workout cards from the system
These are the existing design system workout cards. No bespoke styling — same component used elsewhere, dropped in here.
4
CTA never blocks content
Orange bar over the cards→Floating pill. Cards stay readable as you scroll.
BuddyfitTop
BuddyfitScrolled
Same components. The dark variant proves the system holds: header, hero card, equipment row, workout cards, floating CTA — all the same parts, just repainted for Buddyfit's palette. Zero bespoke work for the second brand.
ACurrent
1
2
3
4
5
BNew
1
Content-type eyebrow
"GYMONDO ORIGINAL SERIES" in Tangerine, replacing the small Vorschau. Tells you what you're looking at before the title.
2
Title gets room to breathe
Overlaid on the image→In a card, with full line-height. Long German titles no longer fight the photo.
3
Presented by, surfaced
A taste of the dedicated Presented by section that follows — name immediately associated with the content.
4
Consistent meta row
Same icon-row pattern as Program Detail: Wissen · Beginner · 3 Weeks. Same component, different labels.
5
CTA aligned with Program Detail
Orange "JETZT STARTEN"→Black floating pill. Two pages, one CTA pattern.
1
2
NewSection
1
Presented by
A dedicated surface for the person behind the series — face, name, role, and a link to their social. The content has a creator, and the page now says so.
2
What you'll learn
A checklist of concrete outcomes, with Tangerine checkmarks. Sets expectations before commit — users know what they're getting into.
1
2
NewSection
1
Materials
Downloadable resources — journals, guides, worksheets — live with the series itself. The content extends beyond the video.
2
Episodes
Bigger thumbnails, less metadata. No body part, no level, no calorie burn — series episodes aren't workouts and shouldn't pretend to be. Title, duration, done.
1
2
LightIn progress
DarkIn progress
1
A new progress component
Circular indicator (2/6 episodes), progress bar, and watch-time stats. Sits between hero card and meta row — only when the user has started.
2
CTA becomes contextual
"Start"→"Continue EP. 3" in Tangerine. The action shifts from initiation to resumption — no friction, no thinking.
BuddyfitOriginal Series
Eyebrow becomes "BUDDYFIT ORIGINAL SERIES". Same content-type label pattern, different brand. Everything else — hero card, presented-by, meta row, CTA — runs on the shared components, no rework needed.