Esthétique front-end améliorée
Instructions
Évitez l'esthétique médiocre et superficielle de l'IA et créez une interface utilisateur étonnamment unique.
## Cinq dimensions fondamentales
**1. Typographie**
- ❌ Polices interdites : Inter, Roboto, Arial, polices système
- ✅ Choisissez : des polices uniques et distinctives
- ✅ Combinaison : Police de présentation + Police du corps, contraste élevé
- ✅ Conseils : Contraste extrême de graisse de police (100 contre 900), large gamme de tailles de police (3x+)
**2. Couleur et thème**
- ✅ Maintenez une esthétique cohérente en utilisant des variables CSS.
- ✅ Couleur dominante + couleur d'accent vibrante
- ❌ À éviter : Dégradé violet + fond blanc
- ✅ Inspiration : Thèmes d'IDE, esthétique culturelle
**3. Mouvement**
- ✅ Les animations CSS sont prioritaires (HTML)
- ✅ Bibliothèque de mouvements
- ✅ Priorité à l'impact maximal : chargement de page soigneusement optimisé > micro-interactions dispersées
- ✅ Déclencheur de défilement, surprise au survol
**4. Aménagement spatial**
- ✅ Flux asymétrique, superposé et diagonal
- ✅ Brisez la grille, utilisez l'espace blanc de manière audacieuse OU contrôlez la densité
**5. Informations générales**
- ✅ Créer une ambiance et de la profondeur
- ✅ Maillage dégradé, bruit, motifs géométriques
- ✅ Transparence superposée, ombres dramatiques, bordures décoratives
## Principes clés
- Chaque conception doit être différente afin d'éviter une convergence répétitive.
- Parvenir à une vision esthétique adaptée à la complexité
L'extrême complexité exige une conception méticuleuse, tandis que le minimalisme requiert retenue et précision.
- Libérez-vous des idées reçues et faites des choix véritablement uniques
⚡ Résumé en une ligne
Police unique + palette de couleurs audacieuse + animation soignée + mise en page innovante + arrière-plan immersif = un design front-end inoubliable
Rejet : Inter/Roboto, dégradé violet sur fond blanc, mise en page monotone
📋 Liste de vérification rapide
Dimensions et éléments d'inspection
Faut-il éviter les polices Inter/Roboto ? Existe-t-il des combinaisons de couleurs originales ?
La palette de couleurs présente-t-elle une cohérence visuelle ? Faut-il éviter les dégradés de violet ?
L'animation comporte-t-elle un effet de chargement soigneusement chorégraphié ?
La disposition s'écarte-t-elle de la grille conventionnelle ?
L'arrière-plan crée-t-il de la profondeur et de l'atmosphère ?
Description
Recommandé par
nene@YouMind
Pourquoi nous recommandons cette compétence
Lassé des designs « AI slop » ? Cette compétence vous aide à créer des interfaces front-end époustouflantes avec typographie unique, couleurs audacieuses, animations subtiles, mises en page innovantes. Un guide pratique pour vous démarquer et obtenir une percée visuelle.
Personnalité typographique unique Esthétique cyberpunk sombre Disposition dynamique asymétrique Animations de chargement soigneusement orchestrées Création d'ambiance immersive
Compétences associées
Tout voir
DiapositivesNéo-brutalisme développeur
Transformez votre contenu (thèmes, articles, concepts, analyses de projets, cours, présentations d'outils) en une série de slides horizontaux au style éditorial néo-brutaliste pour développeurs. Ce style combine l'esthétique néo-brutaliste, la mise en page de magazines indépendants et l'esthétique de terminal développeur : fond blanc cassé, bordures noires épaisses, ombres dures, blocs de couleurs à fort contraste, titres très gras, police monospace, et une mise en page modulaire de type web/terminal/carte, pour une expression visuelle forte du contenu technique. Cette compétence extrait d'abord la structure de votre contenu, puis détermine une idée centrale pour chaque slide, générant automatiquement titres, explications, modules de connaissances, conclusions et composants visuels adaptés. Elle est particulièrement adaptée pour les présentations d'outils IA, les pratiques Agent, les déconstructions de projets open source, l'organisation de cours, les synthèses méthodologiques, les explications de fonctionnalités produits et les analyses de projets. Le résultat final est un ensemble de slides horizontaux au format 16:9, visuellement cohérents, lisibles, avec une marge suffisante et un style marqué, produisant un effet d'expression avancé qui évoque à la fois un partage technique par un auteur de projet open source et un récit de magazine de design indépendant.
ImageAffiche style bas-reliefs Han
Un système visuel extrait des bas-reliefs des Han : silhouettes géométriques × couleurs de fond classiques × mise en page asymétrique éditoriale. Idéal pour les affiches d'événements, les annonces de live, les couvertures de podcast, etc. Vous indiquez le thème, il grave le contenu moderne dans une esthétique bimillénaire.
ÉcrireTitres viraux style Dan Koe
Générez 7 titres pour votre contenu, chacun représentant un trait de style clé de Dan Koe, pour garantir diversité et choix. Ce maître de la création de titres maîtrise la psychologie du contenu viral et l'esthétique de Dan Koe. Conçu pour les créateurs, les bâtisseurs de marque personnelle et les nomades numériques, il transforme vos sujets ennuyeux en titres percutants avec une touche de « leader d'opinion ». 🌟 Compétences clés Analyse approfondie du contenu : extrait automatiquement les points douloureux, le profil du public et les promesses de valeur à partir de mots-clés fragmentés ou de scripts de plusieurs milliers de mots. Sept dimensions en or : suit la logique visuelle de Dan Koe pour générer 7 angles d'attaque complètement différents.
Esthétique front-end améliorée
Instructions
Évitez l'esthétique médiocre et superficielle de l'IA et créez une interface utilisateur étonnamment unique.
## Cinq dimensions fondamentales
**1. Typographie**
- ❌ Polices interdites : Inter, Roboto, Arial, polices système
- ✅ Choisissez : des polices uniques et distinctives
- ✅ Combinaison : Police de présentation + Police du corps, contraste élevé
- ✅ Conseils : Contraste extrême de graisse de police (100 contre 900), large gamme de tailles de police (3x+)
**2. Couleur et thème**
- ✅ Maintenez une esthétique cohérente en utilisant des variables CSS.
- ✅ Couleur dominante + couleur d'accent vibrante
- ❌ À éviter : Dégradé violet + fond blanc
- ✅ Inspiration : Thèmes d'IDE, esthétique culturelle
**3. Mouvement**
- ✅ Les animations CSS sont prioritaires (HTML)
- ✅ Bibliothèque de mouvements
- ✅ Priorité à l'impact maximal : chargement de page soigneusement optimisé > micro-interactions dispersées
- ✅ Déclencheur de défilement, surprise au survol
**4. Aménagement spatial**
- ✅ Flux asymétrique, superposé et diagonal
- ✅ Brisez la grille, utilisez l'espace blanc de manière audacieuse OU contrôlez la densité
**5. Informations générales**
- ✅ Créer une ambiance et de la profondeur
- ✅ Maillage dégradé, bruit, motifs géométriques
- ✅ Transparence superposée, ombres dramatiques, bordures décoratives
## Principes clés
- Chaque conception doit être différente afin d'éviter une convergence répétitive.
- Parvenir à une vision esthétique adaptée à la complexité
L'extrême complexité exige une conception méticuleuse, tandis que le minimalisme requiert retenue et précision.
- Libérez-vous des idées reçues et faites des choix véritablement uniques
⚡ Résumé en une ligne
Police unique + palette de couleurs audacieuse + animation soignée + mise en page innovante + arrière-plan immersif = un design front-end inoubliable
Rejet : Inter/Roboto, dégradé violet sur fond blanc, mise en page monotone
📋 Liste de vérification rapide
Dimensions et éléments d'inspection
Faut-il éviter les polices Inter/Roboto ? Existe-t-il des combinaisons de couleurs originales ?
La palette de couleurs présente-t-elle une cohérence visuelle ? Faut-il éviter les dégradés de violet ?
L'animation comporte-t-elle un effet de chargement soigneusement chorégraphié ?
La disposition s'écarte-t-elle de la grille conventionnelle ?
L'arrière-plan crée-t-il de la profondeur et de l'atmosphère ?
Description
Recommandé par
nene@YouMind
Pourquoi nous recommandons cette compétence
Lassé des designs « AI slop » ? Cette compétence vous aide à créer des interfaces front-end époustouflantes avec typographie unique, couleurs audacieuses, animations subtiles, mises en page innovantes. Un guide pratique pour vous démarquer et obtenir une percée visuelle.
Personnalité typographique unique Esthétique cyberpunk sombre Disposition dynamique asymétrique Animations de chargement soigneusement orchestrées Création d'ambiance immersive
Compétences associées
Tout voirDiapositivesNéo-brutalisme développeur
Transformez votre contenu (thèmes, articles, concepts, analyses de projets, cours, présentations d'outils) en une série de slides horizontaux au style éditorial néo-brutaliste pour développeurs. Ce style combine l'esthétique néo-brutaliste, la mise en page de magazines indépendants et l'esthétique de terminal développeur : fond blanc cassé, bordures noires épaisses, ombres dures, blocs de couleurs à fort contraste, titres très gras, police monospace, et une mise en page modulaire de type web/terminal/carte, pour une expression visuelle forte du contenu technique. Cette compétence extrait d'abord la structure de votre contenu, puis détermine une idée centrale pour chaque slide, générant automatiquement titres, explications, modules de connaissances, conclusions et composants visuels adaptés. Elle est particulièrement adaptée pour les présentations d'outils IA, les pratiques Agent, les déconstructions de projets open source, l'organisation de cours, les synthèses méthodologiques, les explications de fonctionnalités produits et les analyses de projets. Le résultat final est un ensemble de slides horizontaux au format 16:9, visuellement cohérents, lisibles, avec une marge suffisante et un style marqué, produisant un effet d'expression avancé qui évoque à la fois un partage technique par un auteur de projet open source et un récit de magazine de design indépendant.
ImageAffiche style bas-reliefs Han
Un système visuel extrait des bas-reliefs des Han : silhouettes géométriques × couleurs de fond classiques × mise en page asymétrique éditoriale. Idéal pour les affiches d'événements, les annonces de live, les couvertures de podcast, etc. Vous indiquez le thème, il grave le contenu moderne dans une esthétique bimillénaire.
ÉcrireTitres viraux style Dan Koe
Générez 7 titres pour votre contenu, chacun représentant un trait de style clé de Dan Koe, pour garantir diversité et choix. Ce maître de la création de titres maîtrise la psychologie du contenu viral et l'esthétique de Dan Koe. Conçu pour les créateurs, les bâtisseurs de marque personnelle et les nomades numériques, il transforme vos sujets ennuyeux en titres percutants avec une touche de « leader d'opinion ». 🌟 Compétences clés Analyse approfondie du contenu : extrait automatiquement les points douloureux, le profil du public et les promesses de valeur à partir de mots-clés fragmentés ou de scripts de plusieurs milliers de mots. Sept dimensions en or : suit la logique visuelle de Dan Koe pour générer 7 angles d'attaque complètement différents.
Trouve ta prochaine compétence préférée
Explore d'autres compétences IA sélectionnées pour la recherche, la création et le travail quotidien.