Celebration
Rare wins get a moment, built from the board's own parts: a podium of tile states, a crown that means one thing, and confetti made of tiles. Never during a round.
When it happens
Most moments in Outword are small. Celebration is kept for the rare positive ones, and the size of every moment is set by the moment map.
The moment map
| Common | Rare | |
|---|---|---|
| Positive | Small and quick. Scoring a word, copying a code. The copy icon turns into a check; "Saved". Don't get in the way | Celebrate. Winning the month, getting your account back. The podium and the crown, the update reel, welcome back. Confetti lives here only |
| Negative | Plain and fast. A wrong code, waiting. The slots turn --danger, with no shake and no novelty to fill the gap | Empathy over decoration. A lost account, a forgotten phone. A fresh phone asks "Played before?", and the words do the work |
The month's winner
- On the 1st, last month's final standings open as a sheet for everyone, once: the first time the app lands on Home that day, and only if last month had a scorer.
ow_podium_YYYY-MMmarks it seen, and it takes that visit's one ask. - For the rest of the 1st, a "Today" card sits at the top of Compete: a tiny podium with the crown, who won, and who closed out the podium. Tapping it reopens the sheet. It's gone at midnight.
- All month, the winner wears the crown on their rank circle, until the next 1st.
Where confetti lives
The 3.22 release notes name four places. In the code at 3.23.6:
| Place | Fires when | From | Letters |
|---|---|---|---|
| The podium sheet | the crown lands on the 1st column | the top of that column | the winner's name, plus up to two crowns |
| The daily longest leaderboard | you were the first to find the longest word possible; it fires as the board opens after your round | the "longest possible" pill | your name; no crowns |
| The daily trivia summary | you solved the most today | the top of the summary | your name; no crowns |
| The update reel (3.22) | the trivia chapter's solve | the green pill | your name |
| Welcome back | listed in the 3.22 notes | none: the code shows a card, not confetti |
The two daily bursts are removed after 7s; the podium's 9s after the crown lands.
Composition
Every part is a piece the board already owns: the three tile states, the trace line and the brand's flared crown. No new hue.
The crown
| Part | Spec |
|---|---|
| Glyph | viewBox 24×20; body 1.8,6 7.4,11.2 12,4.6 16.6,11.2 22.2,6 19.6,17 4.4,17; finials r 1.6, 1.9 and 1.6; fill and stroke --fg, stroke 1.2, round joins |
| Placement | on a 28px rank circle: 21px wide (75% of the circle), hung off the top left at -8 and -10, tilted -14° from its bottom centre |
| Cut | the same shape behind it at stroke 5.6, in the surface colour: --raise-solid by default, --ground on the podium and the Today card |
| Where | the season leaderboard row, with "September winner" under the name; your own circle in Home's leaderboard row, if you won; the podium's 1st column (44px); the Today card (18px) |
| Never | as decoration, as an icon for first place this month, or during a round |
Dark
Light
The podium
| Part | Spec |
|---|---|
| Columns | 72 wide, radius 12, 10 apart, in the order 2, 1, 3; heights 150, 104 and 66; numerals in the display face at 24. 1st is solid (--tile), 2nd traced (--select with a 2px --select-stroke), 3rd lit (--lit with a 1.5px --select-stroke) |
| Plates | under each column: the name, then the points; the viewer's plate reads "You · 4,210" |
| Build | 3rd, then 2nd, then 1st, starting at 380, 820 and 1260ms; each grows over 640ms on cubic-bezier(.3,1.25,.55,1); each plate fades up 280ms after its column |
| Crown | drops onto the 1st column at 1900ms, over 440ms on cubic-bezier(.5,0,.75,0), accelerating |
| Impact | the 1st column dips to scaleY(.95) and back; the confetti fires from its top; the rows below fade up 110ms later, 50ms apart |
| Pace | the whole build runs at ×0.62 for anyone who wasn't on the podium, or didn't play |
| Close | the X and the scrim. There's no action button |
Dark
Light
Who sees what
Everyone gets the same podium and the same confetti. What changes is the title, which plate says "You", and the rows under the podium.
| Viewer | Title | Under the title | Rows under the podium |
|---|---|---|---|
| The winner | "You won September" | your points, and "October starts at zero for everyone." | 4th and 5th |
| 2nd or 3rd | "Second in September" or "Third in September" | your points and your gap to the winner | 4th and 5th |
| 4th and below | "Zuhayr won September" | "Final standings · N players" | 4th, a gap, then the player above you, you (outlined) and the player below |
| Didn't play | "Zuhayr won September" | the same | 4th and 5th, with no row of your own |
Confetti
| Part | Spec |
|---|---|
| Count | 36 pieces. Every third is a ribbon; the podium adds up to two crowns; the rest are tiles, traced tiles and letter tiles spelling a name |
| Depth | three layers, painted far to near: far (34% of pieces) at ×0.55–0.7, blur 1.6px, 50% opacity; mid (44%) at ×0.95–1.15, blur 0.3px, 85%; near (22%) at ×1.45–1.8, crisp |
| Arc | one continuous move: a rise of 1.5–1.9s that slows to a stop, then a fall from rest. Each piece starts up to 340ms late, so the burst pours rather than pops |
| Life | sway of ±22px and ±7° over 3.4 or 4.2s; tiles flip slowly, brightening to 1.18 facing you and dimming to 0.5 edge-on; ribbons draw themselves out over 1.5s |
| Pieces | .cf-tile 12px in --tile; .cf-ring 12px, the selected tile (--select, 1.5px --select-stroke); .cf-let 20px, a board tile scaled down (22% corners, a 500-weight letter at 10.5px); ribbons are the trace stroke at 62% |
| Colour | the tile, selected-tile and trace tokens, and --fg for the crowns: nothing else, so light mode needs nothing of its own. Never --earned |
| Layer | fixed above the sheet at z 61, so pieces fly out over the scrim; taps pass through |
Dark
Light
The Today card
Dark
Light
Flow
The podium, on the 1st:
- Home loads and the sheet opens on its own, titled for the viewer.
- The columns grow 3rd, 2nd, 1st, each plate fading up behind its column.
- At 1900ms the crown drops onto the 1st column. On impact the column dips, the confetti fires from its top, and the rows below fade up.
- The X or the scrim closes it. The Today card stays on Home until midnight, and the crown stays on the winner's circle all month.
A daily win: the round ends first. Daily trivia shows its summary, and if you solved the most, "You solved the most" rises in green and the confetti fires 250ms later. On the daily longest, if you were first to the longest word possible, the leaderboard opens and the confetti fires from the "longest possible" pill.
States
| State | What the player sees |
|---|---|
| Reduced motion | the sheet opens on its final frame, podium built and crown on, with no confetti. The daily bursts don't fire |
| Fewer than 3 players last month | only the columns that exist |
| Nobody scored last month | nothing opens; that month is cached as empty |
| Closed | the Today card: "Today", "Zuhayr won September", and "Maya and Ru close out the podium" (or "Maya came second"); "You won September" if it's you |
| The rest of the month | the crown on the winner's circle; "September winner" under their name on the leaderboard |
Why it's built this way
Known issues and gaps
- Welcome back has no confetti. The 3.22 notes list it as one of the four places confetti lives, and the moment map puts it with the podium and the reel. The code shows a card ("Welcome back, NAME") that enters over 320ms and leaves after 7s.
- The podium breaks two motion rules. The rules written in 3.21 say rise is a 700–820ms slide out of a mask, ban
scaleYon anything with text, a radius or a border, and allow only transform and opacity to animate. The code grows each column by animatingheightover 640ms and dips the 1st column withscaleY(.95). The spec's §12 timings match the code. - The fall runs longer than the spec says. The code's fall is 4.3–7.4s (6.2, 5.2 or 4.3s by layer, plus up to 1.2s); the spec gives 4.3–6.2s, and the motion rules say confetti clears in 4–6s.
- The crown doesn't scale with the circle. On Home's 40px leaderboard circle it keeps the 28px circle's size and offsets (21px at -8 and -10); the reference page says it scales with the circle. The spec's "
--groundon the home banner" refers to the banner Home had before 3.22, which no longer renders; the Home row uses the default--raise-solid. - "Never on Home" needs a reading. §16 says confetti is never on Home, while the podium sheet that fires it (§12) opens over Home.
Related
- Tile: the three states the podium is made of
- Results: where the daily bursts happen
- Update reel: the other rare positive moment
- Home and Compete: the Today card and the crown on your circle
- Motion: the moves and the reduced-motion design
- D-002, green is earned
Changelog
| Version | Change |
|---|---|
| 3.23.3 | Confetti letter tiles are board tiles scaled down (22% corners, a 500-weight letter at about 52% of the tile); outlined pieces use the selected-tile tokens |
| 3.23.2 | The trivia summary says "You solved the most", with the podium confetti |
| 3.23 | Daily trivia's confetti moves to the end of the run, for whoever solved the most |
| 3.22 | Confetti for unlocking the daily longest first, fired off the "longest possible" pill as the board opens; the first trivia solver gets it too, built from their name tiles |
| 3.21 | The motion vocabulary and rules, including "confetti is earned and clears itself", and a reduced-motion design for every move |
| 3.20 | The monthly podium on the 1st, the crown all month, and confetti made of tiles. New token --raise-solid |