# Delight And Whimsy

> Add a restrained set of memorable, brand-appropriate interaction details, easter eggs, micro-moments, and playful affordances without sacrificing usability or turning the product into a gimmick.

- Skill: `marcmarti9/delight-and-whimsy` (Agent Skill)
- Install (CLI): `npx skillmds@latest add marcmarti9/delight-and-whimsy`
- Raw SKILL.md: https://api.skillmd.com/api/skills/marcmarti9/delight-and-whimsy/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Coding & Dev Tools
- Author: marcmarti9 (https://skillmd.com/u/marcmarti9)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/marcmarti9/delight-and-whimsy

---


# Delight and Whimsy

Use late in a design pass, after hierarchy, usability, responsiveness, and core motion are already solid.

## Goal

Find a few moments that make the interface feel authored and memorable. One excellent surprise is worth more than twenty decorative animations.

## Opportunity scan

Look for:

- logo or brand-mark behavior;
- contextual cursor states;
- tactile press/drag feedback;
- hover reveals with useful information;
- transitions between meaningful states;
- empty/success/loading states with personality;
- subtle physics or momentum;
- optional sound cues;
- easter eggs that do not block normal use;
- small 3D/material reactions;
- copy or microcopy with character;
- playful interactions around a product's actual behavior.

## Restraint rules

- Never add delight to every component.
- Never delay a frequent action for spectacle.
- Do not obscure controls or basic information.
- Respect reduced motion and sound preferences.
- Avoid cursor hijacking that harms precision.
- Avoid novelty that conflicts with the brand.
- Mobile interactions need an equivalent; hover-only delight is incomplete.
- Performance cost must be proportional to impact.

## Prioritization

Score each idea on:

1. brand relevance;
2. memorability;
3. usability impact;
4. implementation cost;
5. runtime cost;
6. frequency of exposure.

Prefer 2-5 high-value moments. Reject ideas whose only argument is “it looks cool.”

## Output contract

Return a ranked list containing:

- moment/location;
- behavior;
- why it fits the brand/story;
- fallback/reduced-motion behavior;
- implementation approach;
- risk of becoming annoying;
- keep/cut recommendation.

Pair with `emil-design-eng` for motion feel and `impeccable` for final craft review.

