delight

Identify delight opportunities across UI states and define brand-aligned strategies.

1|Updated Mar 12, 2026

Search Tags:#accessibility #usability #delight #ui-design #ux #micro-interactions #brand-personality

Ready to run

npx skills add https://github.com/mahou-labs/shiru --skill delight-mahou-labs

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: delight
Source: https://github.com/mahou-labs/shiru/tree/main/.agents/skills/delight
Command: npx skills add https://github.com/mahou-labs/shiru --skill delight-mahou-labs

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Add moments of joy, personality, and unexpected polish to otherwise functional interfaces, making experiences more memorable and engaging.

Core Features & Use Cases

Identify natural delight moments across success states, empty states, loading states, achievements, interactions, errors, and Easter eggs.
Define a brand-aligned delight strategy (subtle sophistication, playful personality, helpful surprises, sensory richness) and apply it safely without obstructing usability.
Ensure accessibility, performance, and consistency with the product's design system across components and interactions.

Quick Start

Audit the UI to locate opportunities for delight and implement a single lightweight micro-interaction per screen.

Frequently Asked Questions about delight

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

What are UI micro-interactions and how do they improve UX?▼

UI micro-interactions are small, focused moments of joy and brand personality added to success, empty, and loading states. They transform functional interfaces into delightful experiences without obstructing usability.

How do I add brand personality to empty states and error messages?▼

Apply a brand-aligned delight strategy—such as playful personality or helpful surprises—to empty states and errors. This adds unexpected polish while ensuring the tone remains context-appropriate and accessibility is maintained.

How do I audit my UI for opportunities to add delight?▼

Audit the UI to locate natural delight moments across success, empty, loading, achievement, and error states. Define a brand-aligned strategy and implement a single lightweight micro-interaction per screen to start.

Does adding micro-interactions and animations hurt accessibility or performance?▼

Delightful micro-interactions must conform to Delight Principles and Implementation Patterns to ensure accessibility and performance are not harmed. The strategy focuses on lightweight polish that integrates safely with the product's design system.

What is the best way to design Easter eggs and achievements in a web app?▼

The best way is applying context-appropriate delight strategies to achievements and Easter eggs. This injects unexpected joy and brand personality into the interface while maintaining usability and consistency with the design system.