delight
Transforma interfaces con micro-interacciones encantadoras
Las interfaces funcionales a menudo se sienten frías y mecánicas. Esta habilidad agrega momentos estratégicos de alegría y personalidad que hacen sonreír a los usuarios mientras mantiene la usabilidad.
Descargar el ZIP de la skill
Subir en Claude
Ve a Configuración → Capacidades → Skills → Subir skill
Activa y empieza a usar
Pruébalo
Usando "delight". Agrega deleite a un estado de éxito de carga de archivos
Resultado esperado:
Una animación suave de escala (1.05x) con una marca de verificación que se dibuja sola durante 400ms, seguida de una breve explosión de confeti para la primera carga del día. Incluye texto alentador: '¡Tu archivo está listo!' con un brillo verde sutil en el ícono del archivo.
Usando "delight". Crea mensajes de carga juguetones para una herramienta de gestión de proyectos
Resultado esperado:
Recopila contexto sobre las operaciones reales de tu producto, luego escribe mensajes específicos como 'Sincronizando con las últimas actualizaciones de tu equipo...' y 'Preparando tu resumen del proyecto...' en lugar de relleno genérico como 'Reuniendo píxeles' que se siente como contenido basura de IA.
Auditoría de seguridad
SeguroAll static analysis findings are false positives. The file contains CSS code examples and copy writing guidance for UI design, not executable code. Backticks in the file denote markdown code blocks for CSS and text examples, not shell command execution. No cryptographic functions, system calls, or network operations are present. This is a design guideline document safe for publication.
Puntuación de calidad
Lo que puedes crear
Mejora de Dashboard SaaS
Agrega animaciones de éxito sutiles y texto alentador a flujos de trabajo de sincronización de datos y generación de informes
Aplicación Móvil de Consumo
Implementa estados de carga juguetones, celebraciones de logros y mensajes de error con personalidad
Flujo de Pago de Comercio Electrónico
Reduce el abandono del carrito con indicadores de progreso alentadores y momentos de finalización satisfactorios
Prueba estos prompts
Audita mi flujo de pago e identifica 3 momentos específicos donde el deleite podría reducir el abandono. Enfócate en estados de éxito y períodos de carga.
Mi marca es profesional pero cálida (startup fintech). Sugiere 5 micro-interacciones que se sientan sofisticadas sin ser frías. Incluye ejemplos de implementación CSS.
Reescribe estos 10 mensajes de error para que sean empáticos y útiles mientras mantienes la confianza del usuario. Nuestra audiencia son pequeños dueños de negocios, el tono debe ser cálido pero no loco.
Ejecuta el Protocolo Completo de Recopilación de Contexto para mi proyecto. Luego crea una estrategia integral de deleite que cubra estados de carga, momentos de éxito, estados vacíos y huevos de pascua. Prioriza por impacto y esfuerzo de implementación.
Mejores prácticas
- Mantén los momentos de deleite bajo 1 segundo para evitar bloquear el flujo del usuario
- Coincide la intensidad del deleite con el contexto (sutil para herramientas profesionales, juguetón para aplicaciones de consumo)
- Haz que el deleite sea omitible y respeta la configuración de accesibilidad de movimiento reducido
Evitar
- Usar el deleite para ocultar o distraer de fundamentos UX pobres
- Forzar a los usuarios a través de animaciones encantadoras sin opciones de omitir
- Texto genérico generado por IA como 'Reuniendo píxeles' que se siente inauténtico