Skip to content

Fix: duck visible through alpha-transparent card videos - #6

Merged
ob1-s merged 1 commit into
mainfrom
fix/card-duck-crossfade
Aug 31, 2026
Merged

ob1-s merged 1 commit into
mainfrom
fix/card-duck-crossfade

Conversation

@ob1-s

@ob1-s ob1-s commented Aug 31, 2026

Copy link
Copy Markdown
Owner

Problem

On cards playing the Pollen clips (e.g. alpha-walking), the static DuckMark remained visible through the video: the clips under moves-portrait-alpha/* are alpha-transparent WebMs, so their transparent regions composited over the always-present duck fallback layer. Cards never showed this before because they previously played local opaque MP4 loops.

Fix

Complete the layering design with a crossfade:

  • when the media layer reveals (onLoad / canplay, hydration-race-proof via the existing ref sync), the duck fallback fades out in the same 240ms;
  • whenever no media is paintable (slow network, load failure), the duck stays fully visible — the empty-frame protection from Perf: layered duck fallback + official remote media for cards #5 is unchanged;
  • reduced-motion users get instant swaps (no transitions).

The halftone dots of the card container remain the composite background for the transparent clips, consistent with the site motif.

Test plan

  • pnpm test (17/17), pnpm build
  • Static catalog HTML unchanged in structure: 0 <video>, 18 duck layers, 7 poster layers
  • Manual: hard-refresh catalog — no duck-through-video on alpha clips; throttled connection still shows the duck while loading

The Pollen clips are alpha-transparent WebMs (moves-portrait-alpha/*), so once cards started streaming them the transparent regions composited over the always-present DuckMark, rendering the mascot through the video. The fallback now crossfades out as the media layer fades in (240ms, reduced-motion aware); it stays fully visible whenever no media is paintable, so slow networks still see the mascot instead of an empty frame.
@ob1-s
ob1-s merged commit 3558696 into main Aug 31, 2026
1 check passed
@ob1-s
ob1-s deleted the fix/card-duck-crossfade branch August 31, 2026 18:19
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant