Comment designer un quiz produit avec des prompts IA (sans compétences en design)
Résumé :
La plupart des gens ne bloquent pas en créant un quiz, ils bloquent en essayant de lui donner l'allure de leur boutique. Cette vidéo prend un quiz de compléments alimentaires tout simple et le met aux couleurs de la marque uniquement avec des prompts dans l'éditeur de design IA, sans toucher à un seul réglage de design.
Transcription :
- La plupart des gens ne bloquent pas en créant un quiz. Ils bloquent en essayant de lui donner l'allure de leur boutique. Alors dans cette vidéo, je ne vais toucher à aucun réglage de design. Je vais décrire ce que je veux en langage courant et laisser l'éditeur de design IA faire le reste. Au passage, ce n'est pas obligé d'être en anglais. Vous pouvez écrire vos prompts dans la langue de votre choix.
- Voici un quiz pour une marque de compléments alimentaires quotidiens. Il est construit à partir d'un modèle simple : cinq questions, une page de contact et une page de résultats. La logique est branchée et les produits sont associés. Ça marche. C'est juste complètement brut. C'est le vrai point de départ de la plupart des gens, et c'est là que ça coince en général.
- Voici l'onglet IA, et voici mon premier prompt : « Améliore le design général de mon quiz, rends-le beau et moderne avec une ambiance conviviale pour une marque de compléments alimentaires quotidiens. » Couleurs, typographie, espacements, appliqués partout d'un coup. Il vous dit ce qu'il a changé, et vous le voyez en direct dans l'éditeur.
- C'est ça qu'il faut comprendre. Un seul prompt a changé tout le quiz, pas une seule page. Vous décrivez une direction, elle est appliquée partout, puis vous affinez. Rien n'est définitif tant que vous n'appuyez pas sur enregistrer, vous pouvez donc prompter autant que vous voulez.
- Affinons donc. La palette est bien, mais ce n'est pas la nôtre. Je lui donne nos couleurs de marque en codes hex, et il les applique exactement, partout.
- Pour les images, même approche : « Ajoute des images au quiz là où il y a des éléments image. Trouve les plus pertinentes. » Elles viennent d'une banque d'images gratuite, donc libres d'utilisation commerciale. Mais si vous avez vos propres photos, il suffit de les téléverser et de dire où elles vont : « Utilise cette image sur la page de démarrage. »
- Maintenant l'autre direction : changer une seule chose. Il y a plusieurs façons de présenter un ensemble de réponses : images, icônes, liste déroulante, contrôle de sélection ou onglets. L'astuce, c'est de nommer la question et le type d'option de réponse dans le prompt. « Sur la question du niveau d'énergie, mets à jour les options de réponse pour qu'elles utilisent des images. » Seule cette question change. Je répète l'opération pour utiliser une liste déroulante sur la question de l'objectif santé : « Sur la question de l'objectif santé actuel, transforme les options de réponse en liste déroulante. »
- La page de contact reçoit le même traitement. Ajouter un champ : « Ajoute un champ numéro de téléphone à la page de contact. » Et pour le design, vous pouvez rester aussi vague que vous voulez : « Rends la page de contact plus jolie. » C'est vraiment tout ce qu'il faut.
- La page de résultats est là où être précis paie, simplement parce qu'il y a beaucoup de choses sur la page. « Supprime l'élément de partage sur les réseaux sociaux de la page de résultats. » Et « Change la mise en page de la page de résultats pour recommander deux produits. » Page, élément, changement. Si un prompt ne donne rien, c'est l'un de ces trois qui manque.
- Maintenant, le mobile. Je ne sauterais pas cette étape, parce que la majorité de votre trafic est sur téléphone. « Optimise mon quiz pour le mobile. Assure-toi que toutes les questions s'affichent bien sur cet appareil. » Il passe sur chaque page, question par question, en ajustant la mise en page pour un écran mobile.
- Voici le rendu sur téléphone, du début à la fin. Démarrer. Objectif santé principal. Niveau d'énergie. Qualité du sommeil. Ce que je prends. Budget. La page de contact. Et les résultats : produits associés, aux couleurs de la marque, prêts à convertir.
- Le même quiz qu'au départ. Mêmes questions, même logique. La seule chose qui a changé, c'est que j'ai décrit le design que je voulais.
- Si vous voulez l'essayer, il y a un lien d'essai gratuit juste en dessous. Et si vous avez un quiz qui fonctionne mais qui ressemble à un formulaire, vous savez maintenant comment y remédier.
Description :
- Un seul prompt restyle tout le quiz d'un coup : couleurs, typographie et espacements sur chaque page
- Ajoutez les codes hex de votre marque, des images de banque libres de droits commerciaux, ou vos propres photos
- Changez le type de réponse d'une seule question, images ou liste déroulante, en nommant la question dans le prompt
- Terminez par un prompt pour optimiser chaque page pour le mobile