SaaS Landing Page Forge

Que fait SaaS Landing Page Forge ?

Créez une page d'accueil SaaS soignée et réactive dans le fichier Figma de l'utilisateur. Traitez le contenu, les preuves du produit, le système de marque et le système Figma existant de l'utilisateur comme la source de vérité. Les conseils de conception génériques ne les surpassent jamais.

Commencez par la collecte

Lisez references/intake-and-planning.md. Demandez les entrées dans une liste de contrôle compacte, reconnaissez ce qui est déjà présent et séparez les éléments essentiels manquants des entrées facultatives.

Ne bloquez pas sur les lacunes récupérables. Continuez avec des hypothèses et des espaces réservés étiquetés lorsque l'utilisateur accepte ou vous a déjà demandé de procéder. N'inventez jamais de capacités de produit, de prix, de preuves, de logos clients, de témoignages, de métriques, de réclamations de conformité ou de règles de marque.

Une cible Figma valide et un MCP connecté avec des outils d'écriture appropriés sont nécessaires pour modifier le fichier. Si l'un ou l'autre manque, fournissez le brief de conception et le plan d'assets, puis indiquez l'étape exacte nécessaire pour débloquer la production Figma.

Travaillez dans cet ordre

1. Vérification préalable : Inspectez les outils MCP Figma disponibles, ouvrez la cible fournie, déterminez la portée des modifications et inventorier les styles, variables, composants, grilles et cadres existants. Suivez references/figma-mcp-workflow.md.
2. Brief : Résumez le public, l'offre, la conversion principale, le message, les preuves, les assets, les contraintes, les entrées manquantes et les hypothèses. Obtenez une confirmation uniquement pour les choix qui modifient matériellement le résultat.
3. Architecture du contenu : Préservez le texte approuvé et organisez-le en un parcours de conversion clair. Utilisez references/conversion-and-content.md. Proposez les modifications de texte séparément ; ne réécrivez jamais silencieusement le contenu approuvé.
4. Direction créative : Dérivez une idée visuelle cohérente de la marque et du produit. Utilisez references/visual-direction.md. Lorsque la direction est vraiment ouverte, présentez jusqu'à trois options distinctes et recommandez-en une avant de construire.
5. Fondations Figma : Réutilisez le système du fichier lorsque c'est approprié. Sinon, créez un petit système local de variables/styles, grilles, hiérarchie typographique, espacements, rayons et composants réutilisables.
6. Construction : Composez la page d'accueil de bureau avec du contenu réel et des captures d'écran du produit. Créez des variantes responsives pour tablette/mobile ou un comportement de point de rupture explicite si demandé. Utilisez references/responsive-and-motion.md.
7. Révision et correction : Exécutez references/design-qa.md, corrigez les problèmes matériels dans le fichier, puis réinspectez les cadres affectés.
8. Remise : Rapportez les noms exacts des pages/cadres, les composants et styles réutilisables, les variantes responsives, les annotations d'animation, les hypothèses/espaces réservés, les entrées non résolues et les risques restants.

Règles d'utilisation de Figma

• Utilisez uniquement les outils que le MCP Figma connecté expose réellement. Ne prétendez jamais qu'une modification, un rendu ou une inspection a réussi sans preuve de l'outil.
• Inspectez avant d'écrire. Après une écriture, inspectez les nœuds résultants ou le rendu avant de continuer.
• Ne remplacez pas et ne supprimez pas le travail non connexe. Si la cible est ambiguë, demandez où travailler ou demandez l'approbation pour créer une page/cadre de travail clairement nommé.
• Privilégiez les calques natifs éditables, l'auto-layout, les composants, les variantes, les variables, les styles de texte et les effets plutôt que les images aplaties.
• Gardez les captures d'écran du produit fidèles : préservez le rapport hauteur/largeur, recadrez intentionnellement et ne les redessinez jamais d'une manière qui suggère des fonctionnalités inexistantes.
• Utilisez des noms stables et descriptifs. Évitez Frame 123, Group 5 ou le groupement décoratif sans but de mise en page.
• Ne modifiez pas le partage, les autorisations, l'état de publication, la propriété ou les bibliothèques.
• En cas d'échec d'écriture, inspectez le fichier avant de réessayer afin qu'un succès partiel ne crée pas de doublons.

Niveau de qualité

La page doit communiquer ce que le produit fait, à qui il s'adresse, pourquoi il est crédible et quelle action entreprendre dans le premier viewport. Utilisez un seul CTA dominant, une hiérarchie cohérente, une typographie et un espacement disciplinés, un contraste accessible, uniquement des preuves réelles et une idée visuelle liée au produit plutôt qu'une décoration SaaS générique.

L'animation est facultative et utile. Spécifiez-la uniquement lorsqu'elle améliore l'attention, la compréhension, le retour d'information, la continuité ou l'expression de la marque. Incluez toujours le comportement de mouvement réduit.

Périmètre de la compétence

Cette compétence produit un design de page d'accueil Figma et une remise prête pour les développeurs. Elle peut annoter le comportement, les assets et les règles responsives, mais elle ne génère pas de code frontend de production, sauf si l'utilisateur le demande séparément.

Pour la provenance et l'audit des capacités derrière cette compétence combinée, voir references/source-coverage.md.