The animation's weakest moment was its final frame, which is also the frame
most chat clients show as the GIF's poster image.
Celebration:
- Confetti launches from two cannons framing the wheel instead of bursting
inside the hub, using closed-form drag ballistics so chips decelerate and
flutter rather than flying a clean parabola. The field previously drained
from 70 particles to 3 before the GIF ended; it now stays populated, and a
2500ms hold ends with 68 on screen instead of 0.
- The opening frame rendered at opacity 0, throwing away the one frame where
particles are still clustered. Removed the fade-in and made the tail
frame-relative and quantized to bound its palette cost.
- Chips streak along their direction of travel in proportion to speed, faking
the motion blur a GIF cannot carry. A second volley, sized to the
celebration window, keeps long holds from thinning out.
- Each theme carries its own confetti palette. Slice colors are tuned to hold
dark text over a large area, which left five of six mono colors under 2.4:1
against the background and invisible at particle size.
- The winner's name appears over the hub during the hold. At a 200px chat
display the pointer is ~17px and a slice label ~9px, so the poster frame did
not say who won.
- Winner emphasis is an opaque stroke, not a drop-shadow. A filter on a Pie
paints outside the shape, so later siblings overpainted it and only one
neighbour ever showed the halo.
Motion:
- Turn count scales with the frame budget and slice width. A fixed 5 turns put
peak speed at ~40deg per frame regardless of option count, so 65 of 98
frames advanced more than a full slice at 32 options and the wheel appeared
to run backwards. Turn counts floor rather than round, since rounding up
reintroduces the aliasing, and stay integral so the winner still lands on
the detent.
- The spin launch now blends into the deceleration at a matched slope. The
previous curve started at maximum speed, and a naive ease-in jumped from 18
to 41deg per frame in a single frame.
- A damped recoil rocks the wheel into its detent, resolving to exactly zero
so the landing and the flapper's rest position are unaffected.
- The pointer is drawn as SVG with a real outline and a tick as slices pass.
clip-path had been discarding its border and shadow entirely.
Legibility:
- Labels flip by their rest-frame angle so every name reads upright in the
final frame. This reverses an earlier decision to leave them slice-aligned;
three of eight names rendered mirrored on a default wheel.
- Label text renders inside a promoted compositing layer, which switches
Chromium from LCD sub-pixel to grayscale antialiasing. Sub-pixel fringes put
2178 colored pixels into an all-grayscale theme and consumed 255 of 256
palette entries. Promoting the one rotating container rather than each label
keeps render time flat on dense wheels.
- Line boxes leave room for stacked Vietnamese diacritics and shrink to fit
rather than clipping.
- Slice colors are ordered for colorblind separation, and the last slice
avoids reusing the first slice's color when the option count leaves a
remainder of one.
tiennm99