13 points par GN⁺ 2026-01-20 | Aucun commentaire pour le moment. | Partager sur WhatsApp
  • Les designers utilisent des agents en ligne de commande comme Claude Code comme un établi de travail, pour créer et corriger rapidement
  • L’éditeur visuel de Cursor permet de vérifier immédiatement des ajustements fins comme le padding ou l’espacement, ce qui réduit les allers-retours de prompt
  • Lorsqu’ils ne trouvent pas l’effet UI voulu, ils créent eux-mêmes un petit playground/studio pour tester les options, puis récupèrent le code validé dans le projet principal
  • Les bonnes références sont ajoutées sous forme d’URL afin de faire analyser et appliquer les techniques, ce qui renforce un mode de travail où apprentissage et implémentation avancent ensemble
  • Les fichiers Claude.md globaux/projet sont maintenus légers, et si nécessaire découpés par sous-dossiers pour limiter l’explosion du contexte

  • Une nouvelle approche émerge : considérer Claude Code non comme un outil de programmation, mais comme un ordinateur

L’établi IA du designer en 2026

  • L’idée qu’il faut d’abord renforcer les compétences (la mémoire musculaire) plutôt que trouver la configuration parfaite se diffuse
  • Le mur d’outils de l’établi diffère selon les personnes, et l’obsession du « stack idéal » finit par faire perdre du temps
  • Une philosophie/approche reste utile plus longtemps que les outils eux-mêmes, même quand ceux-ci changent

Cursor : navigateur intégré et éditeur visuel

  • L’éditeur visuel permet des « ajustements immédiats → vérification immédiate », ce qui accélère le fine-tuning
  • Même sans connaître exactement des valeurs comme le padding, on peut optimiser par itérations directement dans l’UI
  • Pour les designers, manipuler directement l’écran est plus naturel que multiplier les allers-retours de prompt
  • L’extension VS Code sert de porte d’entrée qui réduit la peur du terminal
  • La navigation à la souris et au scroll dans l’UI de l’application crée un écart de productivité face au terminal

Si on ne trouve pas, on le fabrique : stratégie du playground

  • S’il n’existe pas d’interaction satisfaisante, on construit soi-même un studio personnel pour expérimenter uniquement l’élément concerné
  • Un environnement de test a été créé pour expérimenter des options d’animation waveform on/off à ajouter à une vidéo au survol
  • Une fois l’état souhaité choisi, le code est repris et connecté au composant du projet principal
  • Les effets/paramètres créés une fois peuvent ensuite être réutilisés et étendus à d’autres icônes ou éléments
  • Des outils comme un hologram projector affichant une vidéo uploadée en 3D sont réalisés de la même façon

Comment gérer des effets difficiles à décrire avec des mots

  • En apprenant les termes et conventions de nommage du code utilisés par les développeurs, le modèle associe mieux les effets
  • Des expressions comme « glitchy » ou « CRT scan lines » mènent directement à une implémentation en code
  • Ajouter la source (URL) d’un bon exemple et lui faire retrouver puis appliquer la technique accélère l’apprentissage

Ajouter des liens externes et implémenter tel quel : ombres multi-couches

  • Adoption d’une technique qui crée bordure + relief à l’aide de plusieurs couches d’ombre plutôt qu’avec une bordure
  • En partant du nombre de couches (par ex. 3), on peut intensifier l’effet en passant à 5 couches
  • On conçoit des différences subtiles en variant le nombre de couches selon les éléments, comme les boutons ou les conteneurs
  • La répétition de cette même théorie sur différentes UI renforce la cohérence stylistique

Systématiser ses préférences avec des skills/sous-agents

  • Des ensembles de références comme Yakob ou Jay Tompkins servent de matériau d’apprentissage pour construire un agent d’audit visuel/d’interaction
  • Le plugin Compounding Engineering joue un rôle de catalyseur pour accélérer la création de skills/agents
  • Automatiser l’audit basé sur des références permet de faire tourner en boucle un processus manuel « review → amélioration »
  • Si l’on met tous les goûts d’un designer dans un seul skill, il perd de son utilité ; il faut le restreindre volontairement de façon quasi chirurgicale
  • Il faut se méfier de biais comme « toujours de la subtilité » et poser des critères distinguant accentuation et détail de fond

Panneau de contrôle Leva : des poignées pour régler les détails dans le code

  • En React/Next.js, Leva permet d’exposer des paramètres sous forme de molettes/sliders pour les ajuster immédiatement
  • On peut régler en temps réel des valeurs comme la durée d’une animation de ligne d’angle au survol ou le timing du tracer
  • Une simple instruction en langage naturel du type « ajoute Leva et relie ce que je veux pouvoir ajuster » suffit pour automatiser la configuration
  • Même sans savoir quels paramètres sont nécessaires, on peut commencer en demandant « crée les molettes pertinentes »

Principes de gestion de Claude.md : léger, séparé, localisé

  • Le Claude.md global ne doit contenir que de vraies règles universelles, et le Claude.md du projet doit éviter de devenir une encyclopédie excessive
  • Quand les documents de mémoire persistante grossissent trop, le contexte se pollue et la qualité du travail baisse
  • Séparer les consignes par domaine via des Claude.md par sous-répertoire permet de ne charger que le contexte nécessaire
  • Il est possible de formaliser des déclencheurs globaux comme « besoin de contrôles UI » afin d’adopter automatiquement Leva à ce moment-là

Attitude dans le choix des outils : sortir de la boucle d’optimisation de la configuration

  • Les recommandations d’outils deviennent vite obsolètes en quelques mois, et les messages de type « productivité x10 » déclenchent des boucles de sur-optimisation
  • Les designers non techniques ont plus tendance à suivre les conseils à la lettre ; une approche centrée sur les principes sert donc de garde-fou
  • Comme pour les pédales d’effet ou les amplis de guitare, ce sont les goûts et les objectifs qui déterminent le stack, pas une réponse unique
  • Le plus grand coût, c’est de « ne plus vraiment construire parce qu’on optimise le système »

Stratégie d’investissement pour les indépendants au budget limité

  • Il faut exploiter activement les essais gratuits et réduire les doublons entre outils pour diminuer le bruit
  • Si l’on atteint souvent la limite de Claude Code à 20 $, on peut ajouter un abonnement à 20 $ comme Factory pour répartir l’accès aux modèles
  • Il est possible d’alterner entre la génération d’UI avec Gemini 3 Pro dans Factory et les gros travaux dans Claude Code
  • Le palier Claude Code à 100 $ réduit le stress lié aux limites et aide à préserver le flux de travail
  • L’efficacité vient aussi du fait d’étendre Claude Code à des tâches comme l’organisation d’Obsidian ou de Linear, et de l’utiliser comme un « ordinateur »

Tuneup Day : inscrire l’expérimentation dans le planning

  • On réserve une demi-journée en mode « production interdite, amélioration de la configuration uniquement » pour concentrer les expérimentations et la maintenance
  • Cela permet de regrouper en une journée l’installation de plugins, le rangement des dossiers, les essais de nouveaux workflows et la lecture attentive d’interviews ou d’articles
  • On accumule une liste de tâches pour le prochain tuneup day, puis on les traite au choix le moment venu
  • Cette habitude contribue à accélérer l’expérimentation tout en évitant les boucles de sur-optimisation

Aucun commentaire pour le moment.

Aucun commentaire pour le moment.