Transformer un long formulaire en étapes que les utilisateurs terminent

Réorganiser un long formulaire en une courte séquence d'étapes que les gens finissent réellement par remplir.

Durée: ~30 minutes Difficulté: Intermediate Fonctionne avec: Base44 / Lovable / v0

Quand l'utiliser

Lorsque qu'un formulaire important de demande, de candidature, d'accueil ou de devis pose trop de questions à la fois et que les utilisateurs l'abandonnent avant de le soumettre.

Avant de commencer

  • Le formulaire existant et la liste de tous les champs qu'il collecte actuellement.
  • Une décision sur les questions qui sont réellement obligatoires et celles qui peuvent être supprimées ou posées plus tard.
  • Un regroupement sensé des questions, tel que les coordonnées, les besoins, les préférences et une revue finale.
  • Le message de succès exact et ce qui doit se passer après la soumission.
  • Une entrée de test sécurisée sans aucune information privée réelle d'un client.

Le prompt

Ces prompts fonctionnent mieux en anglais — collez-les tels quels, même sur les pages traduites.

Convert [FORM NAME] into a short multi-step form that feels manageable and saves one complete submission at the end. Keep every necessary field and preserve where successful submissions are stored and who is notified.

Group the questions into [NUMBER OF STEPS] clear steps named [STEP NAMES IN ORDER]. Each step should ask only related questions. Start with the easiest questions unless [A DIFFERENT ORDER IS IMPORTANT]. Remove these fields because I no longer need them: [FIELDS TO REMOVE OR NONE]. Mark these fields as optional: [OPTIONAL FIELDS].

Show the current step and the total number of steps in plain language. Add clear Back and Continue buttons. Preserve everything the person already entered when they move backward or forward. Do not submit the form until they confirm the final step.

Check required answers before someone moves to the next step. Put each error beside the question that needs attention and explain how to fix it. Move the keyboard selection to the first error so the form also works for people who do not use a mouse.

Use conditional questions only where I specify them. If [ANSWER OR CONDITION] is selected, show [FOLLOW-UP QUESTION]. Otherwise do not ask it and do not save an empty answer as if the person had seen it.

Add a final review step showing the important answers in readable language with an Edit option for each section. On final submission, prevent double clicks from creating duplicate entries. Show [SUCCESS MESSAGE], send or display [NEXT STEP], and keep the existing owner notification.

Make every step comfortable on a phone, with persistent labels above fields and large tap targets. Do not collect new sensitive information, do not add account creation, and do not change other forms. The tone should feel [REASSURING / DIRECT / FRIENDLY].

Test the shortest valid path, the longest valid path, going backward without losing answers, a required-field error, and one successful submission. Tell me what you removed, what remains required and where the completed submission appears.

Vous construisez déjà ? Collez ceci dans votre projet. Vous partez de zéro ? Ouvrez un compte gratuit sur un outil compatible ci-dessous.

Créez-le sur

Comment nous gagnons de l’argent

Ce que cela crée

  • Un long formulaire réorganisé en une courte séquence
  • Un indicateur de progression clair avec des commandes Précédent et Continuer
  • Des vérifications par étape et des messages d'erreur utiles
  • Des questions conditionnelles qui n'apparaissent que lorsqu'elles sont pertinentes
  • Une revue finale des réponses et une action de soumission protégée
  • Un flux adapté aux mobiles qui conserve les réponses saisies lors de la navigation entre les étapes

Vérifiez que ça a marché

Collez le prompt, attendez la fin de la construction, puis vérifiez ceci — en langage simple, sans contrôle technique :

  • Vous pouvez avancer et reculer sans avoir à ressaisir les réponses
  • Le formulaire indique où vous en êtes et ce qu'il reste à faire
  • Laisser une réponse obligatoire vide produit un message clair à côté de la question
  • Choisir une réponse pertinente affiche la question de suivi appropriée, alors que d'autres personnes ne la verront jamais
  • L'écran de revue affiche les réponses saisies et permet de les corriger
  • Appuyer deux fois sur Soumettre ne crée pas deux demandes, candidatures ou réservations
  • L'entrée de test terminée parvient au même propriétaire et dans la même liste enregistrée qu'auparavant

Il manque quelque chose ? C'est normal — demandez-le dans un court message de suivi plutôt que de relancer tout le prompt.

Étapes suivantes

Supprimer les questions qui ne sont pas justifiées

Après avoir testé le nouveau formulaire et constaté qu'une étape semble encore lourde

Review every question in [FORM NAME] and classify it as needed to respond now, useful later, or unnecessary. Show me the list before changing anything. After I approve [FIELDS TO REMOVE OR MOVE LATER], shorten the form without changing how completed submissions are stored.

Vous saurez que ça a marché quand : Le formulaire ne demande que ce qui est nécessaire pour l'action suivante, et la soumission enregistrée contient toujours chaque champ approuvé.

Permettre aux utilisateurs d'enregistrer et de revenir plus tard

Lorsque le formulaire nécessite des documents, des réponses détaillées ou plus d'une session de travail

Add a Save and continue later option to [FORM NAME]. Explain whether the person must sign in or can receive a private return link at [EMAIL FIELD]. Make the link expire after [TIME PERIOD], prevent anyone else from opening the draft, and never treat a saved draft as a completed submission.

Vous saurez que ça a marché quand : Une personne test peut quitter, revenir via une méthode privée et poursuivre avec ses réponses précédentes intactes.

Confirmer ce qui se passe ensuite

Lorsque les utilisateurs soumettent avec succès mais vous contactent tout de même pour être rassurés

Improve the success step for [FORM NAME]. Show a short summary, explain [WHAT HAPPENS NEXT], give the expected response window [TIMEFRAME], and send the same confirmation to [CUSTOMER EMAIL FIELD]. Do not expose private answers in the email subject.

Vous saurez que ça a marché quand : Une soumission test se termine par des étapes suivantes claires et envoie une confirmation correspondante à l'adresse de test.

Attention à

  • Plus d'étapes ne signifie pas automatiquement un formulaire plus simple. Un formulaire court divisé en plusieurs écrans crée des clics supplémentaires. Utilisez les étapes seulement lorsque le formulaire original est vraiment long ou change en fonction des réponses.
  • Enregistrer chaque réponse incomplète peut créer un problème de confidentialité. Stockez les brouillons uniquement si c'est réellement nécessaire, expliquez-le à l'utilisateur et protégez les données des autres comptes.
  • Les messages d'erreur tardifs causent des abandons. Vérifiez chaque étape avant de passer à la suivante au lieu de révéler tous les problèmes uniquement lors de la soumission finale.
  • Un message de progression doit être véridique. Les étapes surprises cachées donnent aux gens le sentiment d'être trompés. Comptez toutes les étapes dont ils pourraient raisonnablement avoir besoin.
  • Les soumissions en double peuvent entraîner un double travail ou des frais. Désactivez le bouton final après le premier clic et reconnaissez les tentatives répétées comme une seule et même soumission.

Notes par plateforme

<ul><li><strong>Base44:</strong> Base44 peut conserver le formulaire et les soumissions enregistrées dans son système de données intégré. Demandez-lui de préserver la destination et les notifications existantes tout en ne modifiant que l'expérience du visiteur face au formulaire.</li><li><strong>Lovable:</strong> Lovable peut construire le flux d'étapes et le tester dans un navigateur. Si le formulaire enregistre des brouillons ou des réponses privées, confirmez que les règles de stockage connectées protègent les informations de chaque personne.</li><li><strong>v0:</strong> v0 peut construire une interface multi-étapes soignée, mais l'enregistrement de la progression et la prévention des soumissions en double nécessitent un espace de stockage connecté et des vérifications privées en arrière-plan. N'acceptez pas une démonstration purement visuelle pour un vrai formulaire de collecte de données.</li></ul>

Dépensez moins de crédits

Chaque plateforme vous facture le travail que fait son IA — la habitude la moins chère est donc de réfléchir avant de construire. Ces six règles éliminent l'essentiel du gaspillage, quelle que soit la plateforme.

  1. Planifiez d'abord dans un chat gratuit. Esquissez le tout dans ChatGPT, Claude ou Gemini — pages, fonctionnalités, ce que chaque formulaire collecte, l'apparence voulue. Réfléchir là-bas est gratuit ; réfléchir dans un builder est facturé.
  2. Partez d'un prompt écrit, pas d'une phrase. « Fais-moi un site » est la phrase la plus chère de la construction avec l'IA. Un premier prompt complet — comme ceux de ce site — évite des dizaines de corrections.
  3. Ne soyez pas paresseux sur les détails. Chaque détail omis revient en correction payante. Nom de l'entreprise, couleurs, chaque page, chaque champ de formulaire, ce qui se passe après l'envoi — mettez tout dans le premier prompt.
  4. Ensuite, un changement par message. « Corrige l'en-tête, et le formulaire, et les couleurs » crée un enchevêtrement plus coûteux à démêler que ce qu'il a économisé.
  5. Bloqué ? Arrêtez de rustiner. Si la même correction échoue environ trois fois, n'en envoyez pas une quatrième — décrivez plutôt l'état final souhaité de toute la section dans un nouveau message.
  6. Commencez gratuitement. Passez au payant quand il vous en faut plus. Utilisez le quota gratuit pour créer et explorer votre première version. Passez au payant quand vous avez besoin de plus d’utilisation ou de fonctionnalités payantes, et vérifiez le coût des services connectés avant le lancement.

Les prompts de cette page sont écrits pour faire l'essentiel de ce travail à votre place — c'est tout leur intérêt.

Lire le guide complet

Dernière vérification: 2026-07-27

FAQ

Nous utilisons des cookies pour analyser le trafic et suivre les clics d'affiliation. En continuant, vous acceptez notre Politique de Confidentialité.