Vous consultez actuellement l'aide de la version:

Le mappage de zones permet de créer différentes zones et d’utiliser une variété de ressources telles que des vidéos, des images et du texte, qui peuvent être regroupées en un seul écran de manière contextuelle. Vous pouvez importer des images, des vidéos et du texte, et les mélanger de façon à créer une expérience numérique intuitive et interactive. En fonction des exigences du projet, vous avez parfois besoin de plusieurs zones dans un affichage.

Par exemple, une séquence de produits avec un flux de réseaux sociaux associé qui s’exécute dans deux zones distinctes sur un seul affichage.

Aperçu

Lors de la création d’un affichage pour le canal, vous pouvez sélectionner différentes options de modèle pour consulter/gérer le contenu dans le canal.

Les modèles suivants sont disponibles lors de la création des zones pour l’affichage :

  • 2x1 
  • 2x2 
  • 3x1 
  • 4x1
  • 5x1

En utilisant l’un de ces modèles, vous pouvez créer une expérience d’affichage dynamique interactive et intuitive dans laquelle une grande variété de contenu peut être utilisée sur un seul écran.

Remarque :

Pour obtenir des informations détaillées sur la création des canaux et des affichages, voir Gestion des canaux et Gestion des affichages, respectivement, dans la section Création dans Screens.

Description du cas d’utilisation

Ce cas d’utilisation permet de créer un projet AEM Screens avec un canal qui exploite le contenu et l’affiche à l’écran dans plusieurs zones. 

Remarque :

Les zones ne mettent pas le contenu à l’échelle ; la mise à l’échelle doit être effectuée avant d’insérer le contenu dans vos canaux.

Procédure à suivre pour créer un projet

Suivez les étapes ci-dessous pour créer un projet AEM Screens ; elles expliquent comment effectuer un mappage de zones pour votre projet AEM Screens :

  1. Création d’un projet Screens

    1. Sélectionnez le lien Adobe Experience Manager (en haut à gauche), puis Screens. Vous pouvez également accéder directement à : http://localhost:4502/screens.html/content/screens.
    2. Cliquez sur Créer pour créer un projet Screens.
    3. Sélectionnez Screens à partir de l’assistant Créer un projet Screens, puis cliquez sur Suivant
    4. Saisissez le titre Demo Mapping Project et cliquez sur Créer.
    zm1
  2. Création d’un dossier de canaux

    1. Naviguez vers Zone Mapping Project.
    2. Cliquez sur Créer dans la barre d’actions. Un assistant s’ouvre.
    3. Sélectionnez Dossier de canaux et cliquez sur Suivant.
    4. Saisissez le titre Dual Zone et cliquez sur Créer.
    zm2
  3. Création d’un canal

    1. Accédez au projet Zone Mapping Project que vous avez créé et sélectionnez le dossier de canaux (Dual Zone).
    2. Cliquez sur Créer dans la barre d’actions. Un assistant s’ouvre.
    3. Sélectionnez Canal de séquences et cliquez sur Suivant.  
    4. Saisissez le titre Left et cliquez sur Créer.

    De la même manière, créez un autre canal de séquence Right dans le projet Zone Mapping Project.

    zm3
  4. Ajout de contenu à des canaux

    1. Accédez au projet Zone Mapping Project que vous avez créé et sélectionnez le canal que vous avez créé.
    2. Cliquez sur Modifier dans la barre d’actions.
    3. L’éditeur du canal Left s’ouvre. Cliquez sur l’icône qui fait passer le panneau latéral du côté gauche de la barre d’actions pour ouvrir les ressources et les composants.
    4. Faites glisser et déposez les composants que vous souhaitez ajouter à votre canal.

    De même, ajoutez du contenu au canal Right.

    zm4

    Remarque :

    Vous pouvez remplir le contenu de vos canaux avec différentes ressources (images et vidéos) conformément aux exigences du projet.

  5. Création d’un emplacement

    1. Accédez au projet Zone Mapping Project et sélectionnez le dossier Emplacements.
    2. Cliquez sur Créer en regard de l’icône plus (+) de la barre d’actions. Un assistant s’ouvre. 
    3. Sélectionnez Emplacement à partir de l’assistant, puis cliquez sur Suivant.
    4. Saisissez le titre de votre emplacement (San Jose), puis cliquez sur Créer.
    zm5
  6. Création d’un affichage pour San Jose

    1. Accédez à l’emplacement où vous souhaitez créer votre affichage (Demo Mapping Project > Emplacements > San Jose) et sélectionnez San Jose.
    2. Cliquez sur Créer dans la barre d’actions. Sélectionnez Affichage à partir de l’assistant Créer et cliquez sur Suivant.
    3. Saisissez le titre de votre emplacement d’affichage (saisissez le titre Dual Zone).
    4. Sous l’onglet Affichage, sélectionnez les détails de la mise en page.Sélectionnez la résolution Full HD.
    5. Définissez Nombre d’appareils horizontalement sur 2. Définissez Nombre d’appareils verticalement sur 1.
    6. Cliquez sur Créer.
    zm6
  7. Attribution de canaux

    1. Accédez à l’affichage du projet Zone Mapping Project > Emplacements > San Jose > Dual Zone Display.
    2. Sélectionnez Dual Zone Display et cliquez ou appuyez sur Attribuer un canal depuis la barre d’actions.
    3. Vous pouvez aussi cliquer sur Tableau de bord et sélectionner +Attribuer le canal en haut à droite du panneau CANAUX ET PLANIFICATIONS AFFECTÉS, comme illustré dans la figure ci-dessous. La boîte de dialogue Attribution de canaux s’ouvre.
    4. Saisissez Zone comme rôle du canal.
    5. Sélectionnez Canal de référence comme chemin. Sélectionnez le chemin d’accès au dossier de canal (Zone Mapping Project > Canaux > Dual Zone) dans le canal.
    6. Sélectionnez la priorité 1 pour ce canal. Choisissez les événements pris en charge Chargement initial et Écran inactif.
    7. Cliquez sur Enregistrer.
    zm7
  8. Enregistrement et attribution du périphérique

    1. Lancez une fenêtre du navigateur distincte. Accédez au lecteur Screens à l’aide du navigateur web ou lancez l’application AEM Screens. Lorsque vous ouvrez le périphérique, vous remarquez que son état est non enregistré.  
    2. Depuis le tableau de bord AEM, accédez à Zone Mapping Project > Périphériques.
    3. Cliquez sur Gestionnaire de périphériques dans la barre d’actions.
    4. Cliquez sur Enregistrement de périphérique pour voir les périphériques en attente.
    5. Sélectionnez le périphérique à enregistrer et cliquez sur Enregistrer le périphérique.
    6. Vous devez valider le code en le vérifiant à partir du navigateur web ou du lecteur AEM Screens. Cliquez sur Valider pour accéder à l’écran Enregistrement de périphérique.
    7. Saisissez le titre Zone Device et cliquez sur Enregistrer, pour que le périphérique soit enregistré.
    8. Cliquez sur Attribuer l’affichage pour passer à l’étape suivante où vous attribuez le périphérique à un affichage.
    9. Cliquez sur Attribuer le périphérique et sélectionnez le chemin d’affichage de votre canal () comme suit : /content/screens/Test_Project/Locations/TestLocation/TestDisplay. Cliquez sur Attribuer.
    10. Cliquez sur Finish (Terminer) pour terminer le workflow. Le périphérique est désormais attribué.
    zm8
  9. Création de l’affichage multizone

    1. Recherchez et sélectionnez l’affichage à partir de Zone Mapping Project > Emplacements > San Jose > affichage Dual Zone et cliquez sur Tableau de bord dans la barre d’actions.
    2. Sélectionnez l’icône située à gauche de Configuration du périphérique dans le lecteur à partir du panneau PÉRIPHÉRIQUES et cliquez sur Propriétés.
    3. Accédez à l’onglet Configuration du périphérique, puis renseignez les champs Mappage et Modèle. Saisissez {"a1":"${display.channel}/left", "a2": "${display.channel}/right"} dans le champ Mappage et grid-2x1 pour le modèle. 
    4. Cliquez sur Enregistrer et fermer, et rechargez le lecteur.

    Remarque :

    Présentation du mappage et des modèles dans la configuration de périphérique :

    • Les identifiants a1 et a2 correspondent aux zones définies dans le modèle, c’est-à-dire, screens-zone-a1 et screens-zone-a2.
    • ${display.channel}/left pointe sur le canal à incorporer dans la zone, où display.channel pointe sur le chemin du canal actuel dans l’affichage. Cela permet d’incorporer efficacement les enfants « left » et « right » du canal.

    screen_shot_2018-01-22at114708am

Affichage du contenu dans le lecteur AEM Screens

Chargez le lecteur AEM Screens ou utilisez le navigateur web.

Vous verrez le contenu des deux canaux (Left et Right) affiché dans votre lecteur Screens. Le contenu est affiché en tant que zone d’affichage 2x1.

screen_shot_2018-01-22at120206pm

Inférence

Le mappage des zones utilise l’un des modèles disponibles lors de la création d’un canal dans AEM Screens, ce qui permet d’effectuer l’aplatissement côté client. Vous pouvez créer différentes zones dans votre écran et remplir ensuite les zones avec des vidéos, des images et d’autres ressources disponibles.

Ce produit est distribué sous licence Creative Commons Attribution - Pas d’utilisation commerciale - Partage à l’identique 3.0 non transposé  Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.

Mentions légales   |   Politique de confidentialité en ligne