design-system-builder

Ce que fait le skill

À partir d'un logo, de quelques couleurs et des documents du produit, votre agent construit un design system utilisable : une page qui montre chaque décision avec des valeurs copiables, et un court fichier que lisent les agents de code.

La page fonctionne hors ligne, dans toutes vos langues, et se vérifie dans un vrai navigateur.

Compatibilité, agent par agent

• Natif, testéformat d'origine, vérifié sur un vrai projet
• Adapté, testéfichier d'adaptation fourni et vérifié
• Non testéaucune promesse
• Non compatiblela raison est écrite

Ce que contient le paquet

215 fichiers, 15,0 Mo une fois décompressés, ZIP de 3,7 Mo. Tout est lisible ; les dépendances sont incluses avec leur licence, rien ne s'installe à part.

Ce qu'il faut sur votre machine

Ce que l’agent vous demandera d’autoriser

• Lire et écrire dans le dossier du projet
• Lancer python et node
• Ouvrir un navigateur sans interface
• Accès réseau à la demande : api.iconify.design

Installer le skill

Deux façons : une commande, ou le ZIP décompressé à la main. Choisissez votre agent.

La commande d’installation sera publiée prochainement ; en attendant, installez le skill à la main à partir du ZIP.

Utiliser le skill

Demandez simplement le résultat. L'agent pose les questions qui manquent (type de produit, langues, écrans), puis travaille par étapes et regarde ses captures avant de dire que c'est fini.

• Création

  « Crée le design system de notre CRM, en français, italien et anglais. Voici le logo et la planche de couleurs. »

• Ajout d’une section

  « Ajoute une section Produits à notre design system, avec la fiche produit et le stock par entrepôt. »

• Illustrations

  « Fais les illustrations d'états vides de notre CRM : aucun prospect, boîte vide, aucun résultat, pages 404 et 500. »

• Accessibilité

  « Ajoute un bouton d'accessibilité : taille du texte, contraste renforcé, couleurs pour daltoniens, animations coupées. »

Les commandes, si vous voulez les lancer vous-même

python scripts/new_project.py ../acme --name "Acme" --type crm --langs fr,it,en --source fr
python scripts/palette_check.py ../acme
python scripts/build.py ../acme
node scripts/qa.mjs ../acme
node scripts/qa.mjs ../acme shots

Sécurité et confidentialité

• Aucune donnée envoyée à SOGNI DIGITALI

  Le skill ne contient aucune télémétrie, aucun compteur, aucun appel à nos serveurs. Votre marque et vos documents restent sur votre machine.

• Un seul accès réseau, à votre demande

  scripts/fetch_icons.py télécharge les icônes choisies depuis l'API publique Iconify. Le build et la page produite fonctionnent hors ligne.

• Code lisible

  Python et JavaScript en clair, sans fichier compilé ni code masqué. Lisez-les avant la première exécution.

• Dépendances déclarées

  Hairline (MIT), playwright-core (Apache-2.0), Atkinson Hyperlegible (OFL) : versions et licences dans THIRD_PARTY_NOTICES.md.

• Intégrité du téléchargement

  Chaque ZIP est publié avec son empreinte SHA-256, affichée sur cette fiche. La commande d'installation la vérifie avant d'écrire le moindre fichier.

Versions et changements

1. 1.0.0
   • Trois modes de couleur : Dark, Light et Colour, avec températures froide, chaude et équilibrée.
   • Bord lumineux des cartes, au survol et au focus clavier seulement.
   • Mention « Image générée par IA » partagée, toujours hors de l'image.
2. 0.9.0
   • Première version : thèmes clair et sombre, splash SVG, illustrations Hairline, panneau d'accessibilité, contrôle qualité dans le navigateur.

Assistance et questions

• Par email

  support@sognidigitali.com, avec le nom du skill et sa version. Délai de réponse.

• Documentation incluse

  README, SKILL.md et quatorze références : la méthode complète est dans le paquet.