Comprendre le Canvas
Le Canvas—également appelé Designer Studio—est l'espace de travail où vous construisez visuellement votre contenu d'affichage dynamique. Cet environnement vous permet de combiner texte, images, vidéos, intégrations en direct et éléments interactifs en une seule mise en page. Comprendre le fonctionnement du Canvas est essentiel avant de plonger dans les éléments individuels.
La mise en page du Designer Studio
Le Canvas est organisé en trois sections principales, chacune ayant un rôle différent dans l'expérience de conception.
1. Barre latérale gauche : outils et bibliothèque d'éléments
La barre latérale gauche contient la liste complète des éléments que vous pouvez ajouter à votre mise en page. Ils incluent images, vidéos, textes, intégrations, intégrations Google, sliders, et bien d'autres. Cliquer sur n'importe quel élément le placera directement sur le canvas.
2. Espace de travail central : le Canvas
La zone centrale est votre surface de conception en direct. Sa taille correspond à la résolution et à l'orientation que vous avez sélectionnées lors de la création du contenu. Ici, vous pouvez glisser, redimensionner, superposer et positionner des éléments librement.
Vous pouvez interagir avec les éléments en :
- Cliquant pour sélectionner un seul élément.
- Cliquant avec le bouton droit sur n'importe quel élément pour ouvrir un menu contextuel complet pour des actions rapides.
- Glissant pour déplacer les éléments sélectionnés.
- Tirant les poignées pour redimensionner directement les éléments.
- Utilisant le menu contextuel ou les raccourcis clavier pour ajuster la superposition.
Lorsque vous cliquez avec le bouton droit sur un élément, un menu contextuel apparaît proposant les options suivantes :
- Copier, Coller, Dupliquer et Supprimer : gérez rapidement vos éléments sans utiliser la barre d'outils supérieure.
- Contrôles de superposition : ajustez l'ordre d'empilement de vos éléments.
- Mettre au premier plan : déplace l'élément tout en haut de la pile.
- Avancer : déplace l'élément d'une couche vers le haut.
- Reculer : déplace l'élément d'une couche vers le bas.
- Mettre en arrière-plan : déplace l'élément tout en bas de la pile.
- Adapter à l'écran : redimensionne et centre automatiquement l'élément sélectionné dans la vue du canvas.
Le Canvas représente exactement la façon dont votre design final apparaîtra sur l'écran.
3. Panneau de droite : panneau des propriétés
Lorsque vous sélectionnez un élément, le panneau de droite affiche toutes les propriétés modifiables spécifiques à cet élément. Cela peut inclure :
- Taille et dimensions
- Coordonnées de position
- Arrière-plan et opacité
- Paramètres de typographie
- URL ou sources de données
- Modes d'ajustement
- Contrôles du volume et de la lecture
- Options d'animation ou de comportement
Le panneau se met à jour dynamiquement en fonction de l'élément sélectionné.
Maintenant que vous comprenez le fonctionnement du Canvas, la section suivante vous guidera à travers chaque type d'élément que vous pouvez ajouter. Chaque élément a ses propres capacités, comportements et paramètres de configuration.