Agent skill · design visual · aiskillstore

delight

Add moments of joy, personality, and unexpected touches that make interfaces memorable and enjoyable to use. Elevates functional to delightful.

Why this skill is useful

Provides specific techniques and guidelines for enhancing user interfaces with delightful interactions that the AI wouldn't generate on its own.

What it needs

About 6k tokens when loaded. Last updated 2026-08-07. 405 stars on the source repository.

What this skill does

Identify opportunities to add moments of joy, personality, and unexpected polish that transform functional interfaces into delightful experiences. MANDATORY PREPARATION Use the frontend-design skill — it contains design principles, anti-patterns, and the Context Gathering Protocol. Follow the protocol before proceeding — if no design context exists yet, you MUST run teach-impeccable first. Additionally gather: what's appropriate for the domain (playful vs professional vs quirky vs elegant). --- Assess Delight Opportunities Identify where delight would enhance (not distract from) the experience: 1. Find natural delight moments: Success states: Completed actions (save, send, publish) Empty states: First-time experiences, onboarding Loading states: Waiting periods that could be entertaining Achievements: Milestones, streaks, completions Interactions: Hover states, clicks, drags Errors: Softening frustrating moments Easter eggs: Hidden discoveries for curious users 2. Understand the context: What's the brand personality? (Playful? Professional? Quirky? Elegant?) Who's the audience? (Tech-savvy? Creative? Corporate?) What's the emotional context? (Accomplishment? Exploration? Frustration?) What's appropriate? (Banking app ≠ gaming app) 3. Define delight strategy: Subtle sophistication: Refined micro-interactions (luxury brands) Playful personality: Whimsical illustrations and copy (consumer apps) Helpful surprises: Anticipating needs before users ask (productivity tools) Sensory richness: Satisfying sounds, smooth animations (creative tools) If any of these are unclear from the codebase, {{askinstruction}} CRITICAL: Delight should enhance usability, never obscure it. If users notice the delight more than accomplishing their goal, you've gone too far. …

How to use it

Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:

@skills aiskillstore/delight

View the source on GitHub

Browse the @skills marketplace