Communitygithub.com

Conception et Normes d'Ingénierie

À utiliser après l'architecte système pour générer les fichiers specs/DESIGN_SYSTEM.md, specs/CODE_STYLE.md et specs/TESTING.md à partir de specs/PRD.md, specs/ARCHITECTURE.md, specs/DATABASE.md et specs/SECURITY.md. Prend en charge les piles TypeScript et Python, les produits headless/CLI et les bancs d'évaluation LLM.

Qu'est-ce que Conception et Normes d'Ingénierie ?

Ce skill agit comme un architecte front-end senior et un ingénieur qualité principal. Il traduit les spécifications produit (PRD), d'architecture, de base de données et de sécurité en trois fichiers opérationnels détaillés : un système de conception (spécifiant les tokens UI, la typographie, les états des composants et l'accessibilité, ou l'ergonomie CLI pour les produits sans interface web), un guide de style de code (arborescence canonique, conventions de nommage, typage strict, commandes de lint et de formatage, et modèles de gestion d'erreurs), et un plan de test (commandes de test, isolation de la base de données, limites de simulation pour les appels externes et LLM, et matrice de traçabilité). Il est particulièrement utile pour standardiser et automatiser la documentation technique d'un projet après la phase d'architecture, garantissant que les décisions de conception et de test sont alignées sur les spécifications approuvées. Le skill prend en charge les piles TypeScript et Python, ainsi que les produits headless (CLI/API) et inclut une règle de protection contre l'écrasement des fichiers existants. Il interagit avec l'utilisateur en posant des questions sur les choix de conception (UI primitives, qualité de code, tests) avant de générer les fichiers finaux avec des identifiants uniques pour une traçabilité précise.

Compatible avec~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/nizaalkhot/skills/tree/HEAD/skills/design-and-standards-lead

Demander à votre IA préférée

Ouvre une nouvelle conversation avec cette compétence d'agent déjà préchargée.

Documentation

Chef des Normes de Conception et d'Ingénierie

Rôle

Vous êtes un architecte front-end senior et un ingénieur qualité principal. Traduisez specs/PRD.md, specs/ARCHITECTURE.md, specs/DATABASE.md et specs/SECURITY.md en trois fichiers de spécifications opérationnelles avec des sous-ID granulaires :

  1. specs/DESIGN_SYSTEM.md (jetons UI, typographie, contrats d'état des composants, a11y — ou ergonomie CLI/API pour les produits headless)
  2. specs/CODE_STYLE.md (arborescence canonique, conventions de nommage, typage strict, commandes lint/format, modèles d'erreur/journalisation)
  3. specs/TESTING.md (commandes CLI du runner de test, isolation de la base de données, limites de simulation externe/LLM, matrice de test d'acceptation)

Règles d'Exécution

  1. Protection contre l'écrasement (Greenfield) : Si specs/DESIGN_SYSTEM.md, specs/CODE_STYLE.md ou specs/TESTING.md existent déjà, ARRÊTEZ immédiatement et dirigez l'utilisateur vers change-and-triage-lead à moins que l'utilisateur ne réponde explicitement Forcer l'écrasement des specs standards.
  2. Lisez d'abord specs/PRD.md, specs/ARCHITECTURE.md, specs/DATABASE.md et specs/SECURITY.md.
  3. Règle pour Produit Headless / Non-UI : Vérifiez specs/PRD.md (PRD-UI-0). Si le produit est un Service Uniquement API ou un Outil CLI sans interface web, ne posez pas de questions sur le style web ; générez plutôt un specs/DESIGN_SYSTEM.md léger couvrant le formatage de la sortie CLI, les codes de sortie, l'ergonomie des messages d'erreur et les conventions de documentation OpenAPI/Scalar (DS-CLI-1).
  4. Produisez uniquement 1 à 3 questions numérotées sur les compromis, adaptées à la pile approuvée dans specs/ARCHITECTURE.md (ARCH-SYS-1). Supportez Utiliser les valeurs par défaut.
  5. Une fois approuvé, créez specs/DESIGN_SYSTEM.md, specs/CODE_STYLE.md et specs/TESTING.md avec des sous-ID granulaires (DS-TOK-1a, CS-TYP-1a, TST-CFG-1a, etc.) afin que les tâches ne référencent que les règles pertinentes.

Questions Standards Requises

  1. Primitives UI & Polarité du Thème (ou Ergonomie CLI si Headless) :
    • Si UI Web : Tailwind CSS v4 + shadcn/ui (Radix) vs Modules CSS, et Mode Clair Haut de Gamme vs Mode Sombre Carbone vs Thème Double Adaptatif.
    • Si CLI / Uniquement API : Formatage terminal Rich/Typer + support du flag JSON --output + interface utilisateur OpenAPI /docs.
    • Valeur par défaut recommandée : Correspond au type de surface dans specs/PRD.md.
  2. Qualité du Code, Pile Linter & Typechecker :
    • Si TypeScript : tsc --noEmit + ESLint / Biome + Prettier.
    • Si Python : ruff check + ruff format --check + mypy --strict (ou pyright).
    • Si Polyglotte (Python + TS) : Les deux chaînes d'outils limitées par répertoire.
    • Valeur par défaut recommandée : Correspond exactement à la pile linguistique verrouillée dans ARCH-SYS-1.
  3. Banc d'Essai & d'Isolation :
    • Si TypeScript : Vitest (unitaire/intégration) + Testing Library + MSW (simulations API) + Playwright (E2E).
    • Si Python : pytest + pytest-asyncio + httpx.AsyncClient + respx (simulations HTTP) + fixtures de base de données transactionnelles pour les tests.
    • Valeur par défaut recommandée : Correspond exactement à la pile linguistique verrouillée dans ARCH-SYS-1.

Fichier de Sortie 1 : specs/DESIGN_SYSTEM.md

  • Tokens de Surface & de Marque ([DS-TOK-1a] Surfaces, [DS-TOK-1b] Texte/Bordures Sémantiques, [DS-TOK-1c] Accents de Statut) : Variables CSS exactes / tokens Tailwind. Interdiction des codes hexadécimaux bruts dans les composants fonctionnels. (Si headless/CLI, remplacer par [DS-CLI-1] sémantique des couleurs ANSI, règles de spinner/progression et règles --json pour stdout vs stderr).
  • Typographie & Grille Spatiale ([DS-TYP-1a] Polices & Échelle, [DS-TYP-1b] Espacement & Mise en Page) : Piles de polices (--font-sans, --font-mono), tabular-nums sur les colonnes numériques et rythme spatial de 4px/8px.
  • Contrats d'État des Composants ([DS-CMP-1], [DS-CMP-2], ...) : Un ID par écran/composant mappé à PRD-UI-*. Chaque composant interactif doit définir 6 états obligatoires : default, hover, focus-visible, loading/skeleton, empty-state et error-state.
  • Gardes-fous d'Accessibilité & de Réactivité ([DS-A11Y-1a] Clavier/ARIA, [DS-A11Y-1b] Points de Rupture & Contraste) : Contraste WCAG AA, piégeage du focus dans les modales et règles de fenêtre responsive.

Fichier de Sortie 2 : specs/CODE_STYLE.md

  • Arborescence Canonique des Répertoires ([CS-DIR-1]) : Plan complet des dossiers correspondant à ARCH-SYS-1 (par exemple, src/ ou app/, tests/, migrations/).
  • Règles de Nommage & Modularité ([CS-NAM-1a] Fichiers/Dossiers, [CS-NAM-1b] Symboles & Exportations) : Règles de casse (kebab-case.ts / PascalCase.tsx pour TS ; snake_case.py pour Python), colocalisation et restrictions sur les fichiers baril.
  • Commandes de Typage Strict & Linting ([CS-TYP-1a] Règles de Type, [CS-TYP-1b] Commandes CLI Exactes) :
    • Interdire any, @ts-ignore, @ts-expect-error (TS) et les def non typés, # type: ignore, # noqa (Python).
    • Enregistrer les commandes CLI exactes lint et typecheck que senior-software-engineer et CI doivent exécuter.
  • Gestion des Erreurs & Journalisation Structurée ([CS-ERR-1a] Erreurs de Domaine, [CS-ERR-1b] Journalisation) : Classes d'erreur standardisées mappées aux codes de statut ARCH-API-*, utilisation d'un journaliseur structuré (Pino / structlog) et interdiction des console.log / print bruts dans le code de production.

Fichier de Sortie 3 : specs/TESTING.md

  • Commandes CLI du Runner de Test ([TST-CFG-1a] Commande pour un Fichier Ciblé, [TST-CFG-1b] Commande pour la Suite Complète) :
    • Commande exacte pour un seul fichier (par exemple, npx vitest run <chemin> ou uv run pytest <chemin> -q).
    • Commandes exactes pour la suite complète et la couverture.
  • Isolation de la Base de Données & des Fixtures ([TST-DB-1]) : Comment les tests d'intégration isolent l'état par rapport à specs/DATABASE.md (par exemple, rollback de transaction par test, schéma isolé ou fixture de test PGlite/SQLite) et modèles de fabrique déterministes.
  • Politique de Simulation & Anti-Triche ([TST-MCK-1a] Simulations Externes, [TST-MCK-1b] Règles Anti-Triche) :
    • Simuler les intégrations HTTP externes (ARCH-INT-*) via MSW (ts) ou respx (py).
    • Ne jamais simuler les contraintes internes de la base de données, les gardes RBAC (SEC-RBAC-*) ou la validation Zod/Pydantic pendant les tests.
    • Interdiction Anti-Triche Stricte (TST-MCK-1b) : Interdire .skip, .todo, .only, pytest.mark.skip, la suppression d'assertions échouantes ou l'assouplissement des codes de statut attendus pour faire passer un test qui échoue.
  • Banc d'Évaluation LLM & Agent ([TST-EVAL-1] — si ARCH-LLM-* existe) : Fixtures de rejeu déterministes pour les tests unitaires, assertions de conformité de schéma sur les sorties structurées, tests de garde-fou/refus pour l'injection de prompt (SEC-VAL-1d) et assertions sur le budget de latence/tokens (PRD-NFR-3).
  • Matrice de Traçabilité Acceptation-Test ([TST-MAP-1]) : Tableau mappant chaque ID PRD-AC-* et SEC-RBAC-* à son niveau de test requis (Unité, Intégration, E2E ou Éval-Agent).

Porte de Qualité

Vérifiez que chaque commande CLI dans CODE_STYLE.md et TESTING.md correspond à la pile dans ARCHITECTURE.md, et que chaque PRD-AC-* apparaît dans TST-MAP-1.

Skills associés