FREUDIX/Studio
Tableau de bord
freudix.academy
SEO
Les bases du SEOLocal SEOProgrammatic SEOCréer un PBNAutomatiser vos réseaux de sitesTrouver un domaine expiré
Business
Site d'affiliationVente de liensCréer un programme d'affiliation
YouTube
Créer une chaîne YouTubeCréer des vidéos IACréer des musiques IAMontage vidéo (Capcut)
Claude Code
Créer des agents IACréer des SkillsCréer un workflow avec Claude CoWork
Dev
Installer une IA en localVidéos motion designCréer un jeu navigateurCréer une extension ChromeCréer une app PC
VidéosKeyword SEODatasets & ListesWebsite CheckerAffiliation FinderSEO Spots FinderAPIs FinderMCP FinderWorkflows.mdMes Skills.mdMes agents.mdMes OutilsMes templates
Le studio
À proposRoadmapAI Team
Mentions·Confidentialité
🔥Offre lifetime sur otomatic.ai — -40%Profiter de l'offre →
← Workflows
CréationIntermédiaire· ~1-2 h · 7 étapes

Refonte design d'un site

Refond l'UI/UX d'un site existant : audit technique et UX, critique et direction artistique, formalisation d'un design system (tokens), puis application de la refonte.

Télécharger refonte-design-site.workflow.mdinstruction prête pour Claude Code
Schéma du workflow
7 nodes · 6 liens
Démarrageentrée01
Site à refondre
ActionWebsite Checker02
Audit technique & UX
MCPFigma03
Importer la maquette Figma
Agentdesigner04
Critique & direction
Skilldesign-md05
Design system
Agentdeveloppeur06
Appliquer la refonte
Résultatsortie07
✓Site refondu
Démarrage01
Site à refondre

Le site dont on veut améliorer le design.

ActionWebsite Checker02
Audit technique & UX

État des lieux : perf, structure, accessibilité.

MCPFigma03
Importer la maquette Figma

MCP Figma : lit frames, styles et tokens de la maquette pour cadrer la refonte.

Agentdesigner04
Critique & direction

Hiérarchie, contraste, couleurs, typo, composants.

Skilldesign-md05
Design system

Tokens (couleurs, spacing) + contraste WCAG.

Agentdeveloppeur06
Appliquer la refonte

Mise en œuvre du nouveau design.

Résultat07
✓Site refondu

Un site cohérent, plus lisible et plus beau.

Outils enchaînés
5
ActionWebsite Checker
ouvrir →
MCPFigma
fiche MCP →
Agentdesigner
fiche →
Skilldesign-md
fiche →
Agentdeveloppeur
fiche →
Comment l'utiliser
  1. Télécharge le fichier refonte-design-site.workflow.md.
  2. Dépose-le dans ton projet et demande à Claude Code : « Exécute ce workflow ».
  3. L'assistant enchaîne les Skills / Agents dans l'ordre, en te faisant valider les étapes sensibles.
  4. Adapte librement : remplace un outil, saute une étape, branche tes propres Skills.
Workflows liés
Création · 6 étapes

Créer un Skill sur-mesure

D'un besoin à un Skill installable, déclenché correctement.Voir le schéma →Création · 6 étapes

Créer un serveur MCP

Exposer une API à un agent via un serveur MCP propre et testé.Voir le schéma →Création · 8 étapes

Publication WordPress automatisée

D'un sujet à un article publié sur WordPress, en série et planifié.Voir le schéma →