frontend-design

SKILL.md

This skill guides creation of distinctive, production-grade frontend interfaces that avoid generic "AI slop" aesthetics. Implement real working code with exceptional attention to aesthetic details and creative choices.

The user provides frontend requirements: a component, page, application, or interface to build. They may include context about the purpose, audience, or technical constraints.

Before coding, understand the context and commit to a BOLD aesthetic direction:

Créez des interfaces frontales audacieuses, haut de gamme et de qualité production avec l'état d'esprit d'un concepteur UI/UX professionnel et d'un ingénieur front-end. Cette compétence est utilisée lorsque l'utilisateur demande à concevoir ou à repenser des interfaces Web (composants, pages, tableaux de bord ou applications) qui doivent sembler intentionnelles, distinctives et non génériques. Le modèle doit s'inspirer activement d'un large éventail de références de conception réelles (par exemple, interfaces de produits modernes, mises en page éditoriales, systèmes de conception, conception Web expérimentale, tendances observées sur des plateformes comme Pinterest, Awwwards, Dribbble), sans copier une seule source. Le résultat doit être un code réel, prêt à être mis en œuvre, mais doit éviter les composants rigides, de type modèle ou trop symétriques « ressemblant à l'IA ». Les mises en page, l'espacement, la typographie, la hiérarchie et les modèles d'interaction doivent donner l'impression d'être conçus et non générés. La préférence est donnée à une direction visuelle forte, à des décisions UX réfléchies et à une expérimentation contrôlée par rapport aux modèles d'interface utilisateur sûrs ou conventionnels. Source : le-dat/claude-skill-engineer.

Voir l'original