Faites en sorte que Claude transforme les interfaces « visiblement générées par une IA » en designs dotés d'une personnalité propre : commencez par lister les indices tels que les dégradés violets, les effets lumineux, les étiquettes avec émojis, les textes agressifs et les espacements irréguliers, puis définissez une direction basée sur votre produit, en effectuant des modifications itératives par catégorie : espacement, couleurs, icônes, textes, typographie, mise en page, détails, visuels et animations.
Nombre d'étoiles 1100 (+58 / 24h)
Raisons
- Fournir un audit et une direction de design avant les modifications permet de corriger le tir rapidement ; si l'interface est déjà bonne, cela est indiqué clairement, avec seulement quelques ajustements mineurs suggérés
- Si des images de contexte sont nécessaires, elles peuvent être générées via fal, Replicate, OpenAI Images ou Higgsfield ; si ces services ne sont pas connectés, il est proposé de les intégrer comme serveurs MCP ; il est également possible d'utiliser Playwright et ffmpeg pour produire une courte vidéo carrée de « transformation d'interface » de moins de 10 secondes
- Le dossier examples contient deux interfaces d'exemple à modifier
Utilisation
- Après un git clone, copiez skills/unslop dans ~/.claude/skills/ (pour un projet unique, placez-le dans .claude/skills/)
- Dans Claude Code, tapez /unslop this dashboard, /unslop the hero of <URL>, ou formulez votre demande avec vos propres mots
Risques
- Le README est très court, ne décrit que l'installation pour Claude Code et ne propose pas d'évaluation de l'efficacité ; la génération d'images nécessite la connexion à des services d'images payants
- Licence CC BY 4.0, la redistribution exige de créditer l'auteur et de lier le dépôt ; le dépôt a été créé le 29 10