Design Frontend

Ce qu'elle fait

Cette compétence aide un agent à concevoir et à implémenter des interfaces frontend prêtes pour la production — composants, pages ou applications complètes — avec une esthétique forte et intentionnelle. Elle guide l'agent à travers la réflexion design, la direction visuelle, la typographie, la couleur, le mouvement et la composition spatiale, puis produit du code HTML/CSS/JS fonctionnel ou du code spécifique à un framework (React, Vue, etc.) optimisé selon l'esthétique choisie.

Quand l'utiliser

Utilisez cette compétence lorsqu'un utilisateur demande une interface web, une page de destination, un tableau de bord, un composant ou tout artefact frontend qui doit paraître distinctif plutôt que générique. Elle est idéale pour les tâches nécessitant une direction visuelle claire (minimalisme brutal, maximalisme, rétro-futurisme, éditorial, etc.), des micro-interactions polies et du code prêt pour la production.

Ce qui est inclus

• Scripts : aucun (has_scripts=false)
• Références : aucune (has_references=false)
• Instructions : guide étape par étape sur la réflexion design (objectif, ton, contraintes, différenciation), notes d'implémentation concrètes sur la typographie, les couleurs/thèmes, le mouvement, la composition spatiale et les techniques de fond/détails. La compétence met l'accent sur le choix d'une direction esthétique forte et unique et son exécution précise.

Agents compatibles

Idéal avec les LLM capables de produire du code et un raisonnement design (Claude, Gemini, agents de style Copilot) et les agents pouvant générer du HTML/CSS/JS.