Par Gaël Amoros ·
Les 3 skills de design à installer sur ton agent IA
Colle les prompts dans l’ordre, depuis le dossier de ton site, dans Claude Code ou n’importe quel agent qui lit les skills. Remplace [ma page] par la page à retravailler.
La vidéo sur InstagramTon IA n’est pas nulle en design, elle n’avait pas les règles1.Installer les trois skills
Installe ces skills de design dans ce projet : `npx skills add https://github.com/jakubkrehel/make-interfaces-feel-better --skill make-interfaces-feel-better`, puis `npx skills add https://github.com/ibelick/ui-skills --skill baseline-ui`. Installe ensuite Rams en suivant https://www.rams.ai/skill. Dis-moi où chaque skill est installé.
2.Enlever ce qui fait « site fait par l’IA »
Applique le skill baseline-ui à [ma page]. Liste chaque règle enfreinte avec la ligne de code et la raison en une phrase. Commence par les dégradés, les effets lumineux et les animations, puis corrige.
3.Soigner les détails
Avec le skill make-interfaces-feel-better, fais une passe sur les détails de [ma page] : coins arrondis imbriqués, alignement optique, ombres, retour au clic, chiffres alignés. Montre-moi chaque changement avant de l’appliquer.
4.Faire noter ton site par Rams
Lance /rams sur les fichiers de [ma page]. Donne-moi la note sur 100 et les problèmes classés par gravité, avec un correctif pour chacun. Corrige les critiques en premier, puis relance la review.
5.Brancher tout le catalogue
Ajoute le serveur MCP d’UI Skills (https://www.ui-skills.com/mcp) à ma configuration. Ensuite, à chaque tâche d’interface, cherche dans le catalogue le skill adapté et lis-le avant de coder.
2 min de lecture
La méthode, étape par étape
Si ton IA te sort toujours des dégradés violets et des cartes qui brillent, c’est qu’elle n’a aucune règle de design. Un skill lui en donne. Les trois de cette page viennent d’UI Skills, un catalogue de 712 skills de design pour agents IA (au 9 novembre 2026).
Étape 1 : installer les trois skills
- Make Interfaces Feel Better de Jakub Krehel : les petits détails qu’on ne remarque pas, mais qu’on sent
- Baseline UI d’ibelick : la liste de ce qui fait « site fait par l’IA », interdit noir sur blanc
- Rams : une review de designer, avec une note sur 100
Les deux premiers sont installés 75 800 et 26 000 fois sur skills.sh (au 9 novembre 2026).
Étape 2 : enlever ce qui fait « site fait par l’IA »
Baseline UI passe ta page au crible et cite chaque ligne fautive avec son correctif. Ses règles sont sans détour : pas de dégradé sans demande, jamais de dégradé violet, pas d’effet lumineux pour attirer l’œil.
Étape 3 : soigner les détails
Make Interfaces Feel Better s’occupe de ce qu’on sent sans le voir. Deux exemples tirés du skill : le rayon d’un coin extérieur égale le rayon intérieur plus la marge, et un bouton se réduit à 96 % de sa taille quand tu cliques.
Étape 4 : faire noter ton site par Rams
Rams relit ton code d’interface : accessibilité, typo, espacements, couleurs, composants. Chaque problème arrive avec sa gravité et un correctif. Un seul problème critique bloque la note à 59, alors corrige ceux-là d’abord.
Étape 5 : brancher tout le catalogue
Plutôt qu’installer les skills un par un, tu branches le serveur MCP d’UI Skills sur ton agent. À chaque tâche d’interface, il cherche lui-même le skill adapté dans le catalogue.
Sources : UI Skills · Make Interfaces Feel Better · Baseline UI · Rams
Questions fréquentes
Reçois la prochaine ressource
Chaque nouvelle ressource tirée de mes vidéos, avec la méthode pour t’en servir, directement dans ta boîte mail.
Gratuit, désinscription en un clic.