Delight

Earning a Moment

Delight is a budget, not a style, and the default answer is no. This skill exists to reject nine ideas so the tenth is worth building — a product with one earned moment and uniform polish everywhere else beats a product with six flourishes and a broken focus ring. Boundary with motion: this skill decides whether a moment gets extra craft; motion decides how it moves. Nothing here contains a duration, an easing curve, or a transform — the instant the answer is yes, hand the moment to motion (one element), transitions (a sequence), or gestures (pointer-driven) and stop. If someone is asking which curve their confetti uses, they have already skipped the decision this skill makes.

Read the product's existing personality before proposing anything. Count what is already there: a sound file, a navigator.vibrate call, a confetti dependency (canvas-confetti, react-rewards), a celebration component, a mute preference, a prefers-reduced-motion block. A product with zero flourishes has a deliberate register that one addition changes; a product with four has a consistency problem, and the right proposal is usually to remove three. Whatever survives uses the project's existing motion, sound, and token systems — a delight moment is the worst possible reason to introduce a second animation library.

Quick Reference

The Delight-Impact Curve

Benji Taylor's formulation: "the potential for delight increases as the frequency of feature usage decreases." Rauno Freiberg is credited in Taylor's own /family-values footnotes as a co-source on the frequency-and-novelty axis. Emil Kowalski's frequency gate gives the same curve as four operating rows, and this is the decision procedure — score the moment before discussing it:

Score by the frequency of the outcome, not the action. The four-hundredth message send of the day is top row; the send that completes a year-long streak is bottom row, even though the button is identical. This is the only legitimate way a high-frequency control ends up with a moment attached to it.

Core Principles

1. Uniform polish is a precondition, not a companion. Taylor's dirty-bathroom rule, credited in his own margin note to Paco Coursey: "our ability to introduce delight anywhere depends on achieving a consistent level of polish everywhere." A celebration in a product with a missing :focus-visible ring reads as a distraction from the mess. Concrete gate: if any interactive element in the same view lacks a hover, focus, active, disabled, or loading state, the budget goes there first and the moment is deferred. Exception: a throwaway demo or pitch prototype whose entire purpose is the one moment being demonstrated.

2. One delight moment per flow. "Mastering delight is mastering selective emphasis" — Taylor. Two celebrations in one flow do not double the feeling; they cancel, because emphasis is defined by what surrounds it. Count moments per flow, not per screen: 1. Exception: a genuinely multi-day flow (a course, an onboarding that spans weeks) may carry one per session, provided the sessions are far enough apart that nobody sees two in a row.

3. State the payload, or reject. Every proposal fills three fields in one sentence each — Frequency, Payload, If removed — in the block at the end of this file. If If removed answers "nothing", remove it; that is not a bar to clear, it is the default outcome. Reject in writing rather than silently, so the idea does not return next quarter. Exception: none — an unfilled field is itself a rejection.

4. Sound is composed to the interaction, not attached to it. On Honk, Taylor credits Ethan Mueller with composing the sound to match the interaction's timing — a stock library sample fired on an arbitrary event is noise wearing a costume. Hard constraints regardless: never play audio before a user gesture (browsers block it and users hate it), ship a mute control honored on first paint, and default the web to muted. Exception: a product whose output is audio, where sound is the content and not the garnish.

5. A haptic marks a transition, and in a shared moment it fires for everyone. Taylor's Honk example is a simultaneous haptic felt by both users at once — that simultaneity is the entire social payload, not the buzz. Platform truth on the web: navigator.vibrate is Android-only and iOS Safari has no haptic API at all, so never design a moment whose only payload is a haptic. Exception: native and React Native shells, where Haptics.impactAsync-class APIs are real on both platforms and a haptic can carry the moment alone.

6. Deliberate friction is a delight instrument when it changes behavior. Taylor reports that having people sign their name on screen "noticeably reduced bad behaviour in random chats" — the friction is the moment. Justify it by naming the behavior it suppresses; if you cannot name one, you have added a step. Exception, absolute: never add friction to a recovery path — undo, cancel, sign-out, close, delete-my-account stay frictionless no matter how much friction the forward path carries.

7. An easter egg must be unreachable by accident and free to miss. It sits on the path to 0 tasks, changes 0 state, and is the only route to 0 features — a "hidden" feature that users need is a discoverability bug. Exception: none — anything failing one of the three is a feature, and gets designed as one.

8. Under prefers-reduced-motion: reduce, celebration is the category that drops to zero movement. Elsewhere reduced motion means gentler, not absent; confetti, screen shake, and physics bursts are the exception — keep the words and the color, remove the travel entirely. Exception: none. Motion sickness is not a taste question.

9. Take having fun seriously. Taylor's phrase, and it is an engineering instruction: a moment ships with a spec, a review, and a prefers-reduced-motion path, or it does not ship. A half-built flourish is worse than none, because it reads as the level of care the whole product received. The aggregate is the mechanism — Paul Graham, quoted by Emil Kowalski: "a thousand barely audible voices all singing in tune." Most of that singing is invisible correctness; the audible note only works because of it. Exception: none — an unfinished moment is cut, not shipped rough.

Smell / Fix

Output format

A delight proposal is one block, and a rejection uses the same block so both are comparable:

Moment:     <what happens, in one sentence>
Frequency:  <100+/day | tens/day | occasional | rare-first-celebration>  ← scored on the OUTCOME
Payload:    <the feeling being bought>
If removed: <what specifically gets worse>
Precondition: <state-coverage check in this view: pass | fail>
Verdict:    Earned → hand to `motion` / `transitions` / `gestures`  |  Rejected → reason

Checklist

• Frequency scored on the outcome, not the action, and written down
• Top two rows of the curve produce a rejection, always
• State coverage in the same view verified before any moment is approved
• Exactly one delight moment in this flow
• Payload and removal cost named in one sentence each
• Sound composed, muted by default, mute honored on first paint
• No moment depends on a haptic alone
• Friction justified by a named behavior, and absent from every recovery path
• Easter eggs off-path, stateless, and non-essential
• Reduced-motion path removes travel from celebration entirely
• Verdict recorded; timing and curves handed to motion, never decided here