Naviguer dans l’interface de l’éditeur universel pour AEM Forms
L’éditeur universel fournit une interface visuelle pour créer des formulaires AEM avec Edge Delivery Services. Il offre une expérience What You See Is What You Get (WYSIWYG) qui affiche exactement comment vos formulaires apparaîtront aux utilisateurs.
Ce guide vous aide à comprendre l’interface pour créer efficacement des formulaires. Que vous débutiez dans la création de formulaires ou que vous ayez de l’expérience, ce guide vous aidera avec les éléments suivants :
Acquérir les compétences essentielles :
- Naviguer dans l’interface en toute confiance et efficacement
- Utiliser les outils appropriés pour les tâches courantes de création de formulaires
- Utiliser les raccourcis clavier pour augmenter la productivité
- Résoudre les problèmes courants liés à l’interface
Maîtriser les principaux workflows :
- Configurer votre espace de travail pour une productivité optimale
- Créer des formulaires du concept à la publication
- Tester et prévisualiser des formulaires sur plusieurs appareils
- Collaborez avec des personnes membres de l’équipe sur des projets de formulaire.
Prise en main rapide
Nouveaux utilisateurs et utilisatrices : commencez par Outils essentiels pour découvrir les fonctionnalités de base que vous utiliserez le plus souvent.
Utilisateurs et utilisatrices ayant de l’expérience : accédez à Fonctionnalités avancées pour des outils et des intégrations spécialisés.
Référence rapide : utilisez les sections Vue d’ensemble de l’interface et Raccourcis clavier pour effectuer des recherches rapides.
Vue d’ensemble de l’interface
L’interface de l’éditeur universel est organisée en quatre zones principales, chacune conçue pour des tâches spécifiques :
Flux de l’interface : la plupart des utilisateurs et utilisatrices travaillent principalement dans les Zone de travail de l’éditeur (D) et le Panneau Propriétés ©, à l’aide de la Barre d’outils (B) pour des actions telles que la prévisualisation et la publication.
Outils essentiels à la création de formulaires
Commencez ici si vous découvrez l’éditeur universel. Voici les outils principaux que vous utiliserez pour la plupart des tâches de création de formulaires :
1. Zone de travail de l’éditeur : votre principal espace de travail
La Zone de travail de l’éditeur permet de créer vos formulaires visuellement. Elle affiche exactement l’apparence que votre formulaire aura pour les utilisateurs et les utilisatrices.
Actions principales :
- Ajoutez des composants en cliquant sur le bouton Ajouter dans le panneau Propriétés.
- Sélectionnez des éléments en cliquant directement dessus dans la zone de travail.
- Affichez les modifications en temps réel lorsque vous configurez des composants.
- Testez les interactions en mode Aperçu.
2. Panneau Propriétés : configurer des composants
Le panneau Propriétés (côté droit) vous permet de personnaliser les composants sélectionnés et de gérer la structure de votre formulaire.
Fonctionnalités essentielles :
- Mode Propriétés (raccourci
d) : configurez les paramètres du composant sélectionné. - Arborescence de contenu (raccourci
f) : parcourez la structure du formulaire. - Ajouter des composants (raccourci
a) : insérez de nouveaux champs de formulaire. - Actions des composants : dupliquez ou supprimez les éléments sélectionnés.
3. Éléments essentiels de la barre d’outils : prévisualiser et publier
La barre d’outils de l’éditeur universel fournit des actions clés pour tester et publier vos formulaires.
Outils à connaître :
- Mode Aperçu (raccourci
p) : testez votre formulaire tel que les utilisateurs et les utilisatrices le verront. - Mode réactif : vérifiez l’apparence de votre formulaire sur les appareils mobiles.
- Ouvrir la page (raccourci
o) : affichez le formulaire dans un nouvel onglet. - Publier : mettez votre formulaire en ligne pour les utilisateurs et utilisatrices.
4. Workflow de démarrage rapide
Pour votre premier formulaire :
- Commencer la création: ajoutez des composants à l’aide du bouton Ajouter (
a). - Configurer les champs : sélectionnez les composants et utilisez le mode Propriétés (
d). - Tester le formulaire : utilisez le mode Aperçu (
p) pour interagir avec le formulaire. - Vérifier la vue mobile : basculez vers le mode réactif pour les tests mobiles.
- Mettre en ligne : cliquez sur Publier lorsque vous avez terminé.
Points de contrôle de validation :
- Pouvez-vous ajouter et configurer des champs de formulaire ?
- Le mode Aperçu fonctionne-t-il correctement ?
- Tous les champs obligatoires sont-ils correctement configurés ?
- Le formulaire s’affiche-t-il correctement sur les appareils mobiles ?
En-tête Experience Cloud
L’en-tête Experience Cloud fournit des outils de navigation et de gestion de compte. La plupart des créateurs et créatrices de formulaires l’utilisent occasionnellement pour basculer entre les outils Adobe ou accéder à l’aide.
Éléments principaux :
Utilisations les plus courantes :
- Obtention d’aide : cliquez sur l’icône Aide pour accéder à la documentation et à l’assistance.
- Changement d’organisation : utilisez la liste déroulante des organisations si vous disposez d’un accès multiorganisation.
Barre d’outils de l’éditeur universel
La barre d’outils de l’éditeur universel contient vos outils principaux d’édition et de publication de formulaire. Ils sont organisés par fréquence d’utilisation et par workflow type.
Outils de workflow quotidiens
Ces outils sont utilisés dans la plupart des sessions de création de formulaires :
Mode Aperçu (raccourci p)
Objectif : tester votre formulaire exactement comme les utilisateurs et utilisatrices le verront.
Quand utiliser cette option : avant de publier, après avoir apporté des modifications, pour tester la fonctionnalité de formulaire.
Bonne pratique : prévisualisez après chaque modification majeure pour détecter les problèmes rapidement.
Mode réactif
Objectif : vérifier l’affichage de votre formulaire sur les appareils mobiles.
Quand utiliser cette option : après la création de votre formulaire, avant sa publication.
Bonne pratique : testez toujours la vue mobile : de nombreux utilisateurs et utilisatrices accéderont aux formulaires sur leurs téléphones.
Ouvrir la page (raccourci o)
Objectif : afficher votre formulaire dans un nouvel onglet sans l’interface de l’éditeur.
Quand utiliser cette option : pour les tests en plein écran, partage avec les parties prenantes pour révision.
Publier
Objectif : rendre votre formulaire actif et accessible aux utilisateurs et utilisatrices.
Quand utiliser cette option : après des tests approfondis en modes Aperçu et Réactif.
Liste de contrôle de validation avant publication :
- Le formulaire a été testé en mode Aperçu.
- La réactivité mobile a été vérifiée.
- Tous les champs obligatoires ont été configurés.
- Les actions Envoyer fonctionnent correctement.
Outils de navigation
Bouton Accueil
Objectif : revenir à la page de démarrage de l’éditeur universel.
Quand utiliser cette option : lorsque vous commencez à travailler sur un autre formulaire.
Barre d’emplacement (raccourci l)
Objectif : accéder directement à un formulaire par URL.
Quand utiliser cette option : lorsque vous souhaitez basculer rapidement entre des formulaires spécifiques.
Outils de configuration avancée
Ces outils sont utilisés pour des scénarios spécifiques ou des configurations avancées :
Propriétés du formulaire AEM
Objectif : configurer des paramètres au niveau du formulaire tels que le modèle de données de formulaire (FDM) et les dates de publication.
Quand utiliser cette option : lorsque vous configurez des intégrations de données et planifiez la publication.
Le panneau Propriétés du formulaire comprend les sections suivantes :
-
Envoi : définissez ce qui se passe après l’envoi du formulaire par un utilisateur ou une utilisatrice. Faites votre choix parmi plusieurs actions d’envoi, telles que l’envoi de données par e-mail, l’envoi à SharePoint, l’utilisation d’un modèle de données de formulaire ou l’intégration à des services tels qu’Adobe Experience Platform ou Microsoft Power Automate. Pour obtenir la liste complète des actions d’envoi prises en charge, reportez-vous à l’article Action d’envoi.
-
Préremplissage : configurez la manière dont les champs de formulaire sont automatiquement renseignés avant que l’utilisateur ou l’utilisatrice interagisse avec le formulaire. Vous pouvez vous connecter à des sources de données telles qu’un modèle de données de formulaire (FDM) ou utiliser des paramètres d’URL pour préremplir des champs, ce qui améliore l’expérience d’utilisation et réduit la saisie manuelle. Pour en savoir plus, consultez l’article Service de préremplissage.
-
Remerciement : personnalisez ce que voient les utilisateurs et utilisatrices après l’envoi du formulaire. Vous pouvez afficher un message de confirmation ou les rediriger vers une autre page web, et ainsi garantir une expérience de remplissage fluide et professionnelle. Pour savoir comment configurer un message de remerciement pour les formulaires, consultez l’article Configurer un message de remerciement.
Éditeur de règles (accès anticipé)
Objectif : ajouter des comportements dynamiques, des validations et une logique conditionnelle.
Quand utiliser cette option : lorsque vous créez des formulaires interactifs avec une logique commerciale complexe.
Paramètres d’en-tête d’authentification
Objectif : définir des en-têtes d’authentification personnalisés pour les tests de développement.
Quand utiliser cette option : lors d’un développement local avec des formulaires nécessitant une authentification.
Options supplémentaires (menu représentant des points de suspension)
Objectif : accéder aux actions moins courantes telles que la dépublication.
Quand utiliser cette option : mise hors ligne de formulaires, accès aux options avancées.
Panneau Propriétés
Le Panneau Propriétés (côté droit) est votre centre de contrôle pour la création et la configuration de formulaires. Il change en fonction de ce que vous sélectionnez et fournit différents outils pour diverses tâches.
Principaux outils de création de formulaires
Ces outils sont essentiels pour créer et organiser vos formulaires :
Ajouter des composants (raccourci a)
Objectif : insérer de nouveaux champs et éléments de formulaire.
Fonctionnement : affiche les composants disponibles pour le conteneur sélectionné.
Composants courants :
- Champs Entrée de texte, E-mail, Téléphone
- Liste déroulante, boutons radio, cases à cocher
- Chargement de fichier, sélecteur de date
- Panneaux et sections pour l’organisation
Mode Propriétés (raccourci d)
Objectif : configurer les paramètres des composants sélectionnés.
Quand utiliser cette option : après l’ajout d’un composant pour personnaliser son comportement.
Paramètres clés :
- Libellés de champ et texte d’espace réservé
- Règles de validation (obligatoire, format, longueur)
- Valeurs par défaut et texte d’aide
- Règles de visibilité conditionnelles
Arborescence de contenu (raccourci f)
Objectif : parcourir et organiser la structure de votre formulaire.
Quand utiliser cette option : pour les formulaires complexes comportant plusieurs sections, la recherche de composants spécifiques.
Avantages :
- Navigation rapide vers un composant
- Hiérarchie visuelle des formulaires
- Réorganisation facile des éléments
Actions des composants
Objectif : gérer les composants existants.
Actions disponibles :
- Dupliquer : copier rapidement les composants
- Supprimer : supprimer les composants (pas d’invite de confirmation)
Fonctionnalités et intégrations avancées
Ces outils offrent des fonctionnalités de formulaire sophistiquées :
Source de données
Objectif : connecter des formulaires aux systèmes de données principaux.
Quand utiliser cette option : pour les formulaires qui doivent être en lecture/écriture dans des bases de données ou des services externes.
Fonctionnalités :
- Configuration du modèle de données de formulaire (FDM)
- Population de données dynamique
- Envoi à des systèmes externes
Générer des variations
Objectif : utiliser l’IA pour créer différentes versions du contenu du formulaire.
Quand utiliser cette option : lorsque vous testez différents textes et différentes mises en page ou approches.
| code language-none |
|---|
|
En savoir plus : Guide de génération des variations
Brouillons de contenu
Objectif : créer et enregistrer des versions préliminaires de texte.
Quand utiliser cette option : itération sur une copie de formulaire, enregistrement des options de texte secondaire.
Tests A/B
Objectif : comparer des variations de formulaire pour optimiser les performances.
Quand utiliser cette option : optimisation des taux de conversion, test de différentes conceptions.
Expérimentation
Objectif : exécuter des tests contrôlés sur les conceptions de formulaire.
Quand utiliser cette option : optimisation des formulaires pilotés par les données, test de l’expérience d’utilisation.
| code language-none |
|---|
|
Gestion des tâches
Objectif : organiser le workflow de l’équipe pour les projets de formulaire.
Quand utiliser cette option : développement de formulaires pour plusieurs personnes, suivi de projet.
Personnalisation
Objectif : se connecter à Adobe Experience Platform pour des expériences personnalisées.
Quand utiliser cette option : création de formulaires personnalisés basés sur des données d’utilisation.
| code language-none |
|---|
|
Zone de travail de l’éditeur
La zone de travail de l’éditeur est votre espace de travail principal dans lequel vous créez visuellement des formulaires. Elle affiche exactement l’apparence que votre formulaire aura auprès des utilisateurs et utilisatrices et fournit des commentaires en temps réel au fur et à mesure que vous apportez des modifications.
Fonctions clés :
- Modification WYSIWYG : voyez immédiatement les modifications au fur et à mesure que vous les apportez.
- Interaction directe : cliquez sur un composant pour le sélectionner et le modifier.
- Prévisualisation en temps réel : basculez vers le mode Aperçu pour tester la fonctionnalité.
- Affichage réactif : activez/désactivez les vues d’appareil pour vérifier la compatibilité mobile.
Bonnes pratiques :
- Commencer par la structure : ajoutez les sections principales avant les composants détaillés.
- Tester fréquemment : utilisez régulièrement le mode Aperçu pour détecter les problèmes rapidement.
- Penser d’abord à la version mobile : cochez le mode réactif tout au long du processus de conception.
Raccourcis clavier
Maîtrisez ces raccourcis pour créer des formulaires plus rapidement et plus efficacement :
adfpolConseil de pro : utilisez ces raccourcis en les combinant ; par exemple, sélectionnez un composant, appuyez sur d pour le configurer, puis p pour tester les modifications.
Workflows courants
Création de votre premier formulaire
- Ajouter la structure : utilisez
apour ajouter un panneau pour les sections de formulaire. - Ajouter des champs : insérez un champ d’entrée de texte, un e-mail et d’autres composants.
- Configurer les propriétés : sélectionnez chaque champ et appuyez sur
dpour définir les libellés et la validation. - Tester la fonctionnalité : appuyez sur
ppour prévisualiser et tester le formulaire. - Vérifier la vue mobile : utilisez le mode réactif pour vérifier l’affichage mobile.
- Publier : cliquez sur Publier lorsque vous souhaitez mettre en ligne.
Modification des formulaires existants
- Naviguer dans la structure : utilisez l’arborescence de contenu (
f) pour rechercher rapidement des composants. - Sélectionner et modifier : cliquez directement sur les composants ou utilisez l’arborescence de contenu.
- Tester les modifications : prévisualisez (
p) après chaque modification significative. - Valider le workflow : testez le flux de formulaire complet avant la republication.
Collaboration avec des équipes
- Utiliser la gestion des tâches : attribuez des sections de formulaire spécifiques aux personnes membres de l’équipe.
- Partager pour révision : utilisez Ouvrir la page (
o) pour partager des prévisualisations claires. - Tester ensemble : utilisez le mode Aperçu pour les sessions de test collaboratives.
- Suivre la progression : consultez les notifications des mises à jour de tâches.
Résolution des problèmes courants
Problèmes d’interface
Problème : les boutons de la barre d’outils, le panneau Propriétés ou d’autres éléments d’interface n’apparaissent pas.
Solutions :
- Actualiser la page : une simple actualisation du navigateur résout souvent les problèmes de chargement.
- Vérifier la compatibilité du navigateur : utilisez Chrome, Firefox ou Safari.
- Effacer la mémoire cache du navigateur : supprimez les fichiers mis en cache qui peuvent être obsolètes.
- Vérifier les autorisations : assurez-vous que vous disposez d’un accès approprié pour modifier les formulaires.
Problème : impossible de sélectionner les composants ou le panneau Propriétés ne se met pas à jour.
Solutions :
- Cliquer directement sur les composants : évitez de cliquer sur des zones vides.
- Utiliser l’arborescence de contenu : appuyez sur
fet sélectionnez les composants dans l’arborescence. - Rechercher les éléments qui se chevauchent : certains composants peuvent en bloquer d’autres.
- Recharger le formulaire : utilisez la barre d’emplacement (
l) pour recharger le formulaire actif.
Problème : le mode Aperçu ne fonctionne pas correctement ou affiche des erreurs.
Solutions :
- Vérifier la validation du formulaire : assurez-vous que tous les champs obligatoires sont correctement configurés.
- Tester d’abord en mode modification : vérifiez que les composants fonctionnent avant de les prévisualiser.
- Effacer la mémoire cache du navigateur : les scripts mis en cache peuvent interférer avec la prévisualisation.
- Vérifier la configuration du composant : examinez les paramètres du mode Propriétés pour identifier les erreurs.
Bonnes pratiques pour créer efficacement des formulaires
Conseils d’organisation
- Utiliser des noms descriptifs : étiquetez les composants clairement en mode Propriétés.
- Regrouper les champs associés : utilisez les panneaux pour organiser logiquement les sections de formulaire.
- Planifier avant de créer : esquissez la structure du formulaire avant de commencer.
- Faire simple : évitez de submerger les utilisateurs et utilisatrices avec trop de champs.
Expérience clientèle
- Tester fréquemment : utilisez le mode Aperçu après chaque modification majeure.
- Penser comme les utilisateurs et utilisatrices : tenez compte de l’expérience de remplissage complète du formulaire.
- Fournir des libellés clairs : rendez les fonctions de champ évidentes pour les utilisateurs et les utilisatrices.
- Ajouter du texte utile : utilisez du texte d’aide pour les champs complexes.
Optimisation des performances
- Réduire les composants : utilisez uniquement les champs de formulaire nécessaires.
- Optimiser les images : compressez les images utilisées dans les formulaires.
- Tester sur mobile : garantissez de bonnes performances sur les connexions mobiles plus lentes.
- Valider de manière anticipée : configurez une validation appropriée pour éviter les erreurs d’envoi.
Étapes suivantes
Maintenant que vous connaissez l’interface de l’éditeur universel, procédez comme suit :
- S’exercer avec un formulaire simple : commencez par les champs de base pour vous familiariser.
- Explorer les fonctionnalités avancées : essayez les outils et intégrations optimisés par l’IA lorsque vous êtes prêt ou prête.
- Découvrir la création de formulaires :consultez le Guide de prise en main.
- Maîtriser l’éditeur de règles : ajoutez des comportements dynamiques avec le Guide de l’éditeur de règles.
À retenir : l’éditeur universel est conçu pour rendre la création de formulaires intuitive. Commencez par les éléments essentiels et explorez progressivement les fonctionnalités avancées à mesure que vos besoins évoluent.