Comment créer un gabarit pour un clip de type transport

Un exemple de création d'un gabarit de transport, celui-ci peut diffuser des passages d'autobus et de train

1. Sur le Studio ITESLIVE cliquez sur l'onglet nommé paramètres et sélectionnez la gestion des gabarits

2. Naviguez au dossier dans lequel vous désirez créer le gabarit et cliquez sur le bouton « nouveau gabarit »

3. Déterminer les configurations du gabarit

Avant de faire la création du visuel, il faut fournir les informations suivantes.

• Nom: Identifiant unique pour le gabarit
• Nom Anglais: Le nom qui sera affiché lorsque le Studio est utilisé en Anglais
• Nom Français: Le nom qui sera affiché lorsque le Studio est utilisé en Français
• Type: Dans ce cas-ci, nous devons sélectionner le type de gabarit nommé transport
  
• Dimensions: La résolution du gabarit doit être identique à la résolution de la zone 
• Icône: Un fichier que vous pouvez sélectionner qui servira de "Thumbnail" pour le gabarit
• Langue: Détermine le nombre de langues disponibles dans le gabarit
• Transition de l'introduction (facultatif): L'animation de la transition utilisée pour le gabarit s'il y a une transition
• Durée de l'introduction (facultatif): La durée en secondes pour la transition de l'introduction
• Durée de l'introduction (facultatif): la durée de l'introduction

Une fois que les informations ont été entrées, cliquez sur le bouton accepter.

4. Création d'un entête

Une fois que les configurations ont été appliquées, le Studio ITESLIVE ouvrira automatiquement l'éditeur de gabarit. Pour la première étape de création du gabarit, il est important d'avoir un entête qui décrit chaque colonne d'information diffusée à l'affichage pour les usagers qui regarderont le moniteur.

1. Cliquez sur l'outil de forme dans le coin supérieur gauche de l'éditeur de gabarit
    
2. Vous devez cliquer sur l'espace blanc dans l'éditeur, maintenir le clic et déplace votre souris afin de positionner la forme
   
   
   
3. Vous pouvez redimensionner la forme en utilisant les cercles au tour de la forme ou de façon numérique avec les contrôles pour la position et la taille de la forme
   
4. Une fois que la forme est placée, nous allons renommer le calque pour bien l'identifier. Pour renommer le calque, cliquez sur le calque désiré dans la liste du côté droit de l'éditeur, cliquez l'icône qui représente un crayon sous la liste
   
5. Dans la fenêtre qui s'ouvre entrez le nom du calque et cliquez le bouton nommé OK
   
6. Cliquez sur la forme de nouveau pour la sélectionner, par la suite vous pouvez modifier la couleur de la forme avec les contrôles des couleurs dans le coin inférieur gauche de l'éditeur
   
7. Vous pouvez utiliser les contrôles de couleurs RVB (Rouge, Vert, Bleu), entrer un code de couleur hexadécimale ou bien choisir parmi les couleurs proposées
   
8. La prochaine étape sera d'ajouter des textes pour représenter les informations qui seront diffusées en dessous de l'entête, pour configurer les textes nous allons devoir ajouter un nouveau calque et le nommer.
   
9. Cliquez sur l'outil de texte et placez-le de la même façon que la forme dans le gabarit
   
10. Vous pouvez positionner le texte de la même façon que vous aviez positionné la forme, vous pouvez également ajuster la couleur du texte avec les contrôles dans le bas de l'éditeur. Vous pouvez également ajuster les configurations de la police avec les contrôles à la droite des contrôles pour la position et la taille de l'outil.
    
    
    
11. Pour modifier le texte inclus dans l'outil, vous devez double-cliquer le texte une fois que vous avez terminé les configurations désirées, dans la fenêtre de configuration du texte, entrez le texte que vous désirez voir à cet endroit et cliquez le bouton sauvegarder.
    
12. Placez le nombre de champs texte nécessaire pour avoir les titres désirés dans votre entête.

5. Ajouter une source de données

Afin de configurer les données de transport dans le gabarit, vous allez devoir ajouter une source de données au gabarit.

1. Cliquez sur l'icône qui représente un disque dur
   
2. Cliquez sur le « + »
   
3. Cliquez sur la source de données désirées et cliquez sur le bouton sélectionner
   
4. Afin d'assurer que l'ensemble des passages seront diffusés, vous devez activer la case à cocher nommé tout. De plus, dans la section nommée noeud principal, cliquez sur la flèche pour ouvrir la section TransportData et cliquez sur l'entrée nommée Routes. Cliquez sur l'icône de la disquette une fois que c'est fait.
   
5. Une fois que vous avez sauvegardé la source de données, celle-ci sera affichée du côté gauche de la fenêtre, vous pouvez maintenant fermer la fenêtre en cliquant sur l'icône représentant la lettre X dans le coin supérieur gauche de la fenêtre.
   

6. Création de la liste de données

1. Cliquez sur l'outil de liste du côté gauche de l'éditeur de gabarit
   
2. Placez la liste de la même façon que vous l'aviez fait pour le texte ainsi que la forme plus tôt
   
3. En plus des configurations habituelles au sujet de la position et de la taille de la liste, vous devez spécifier la source de données ainsi que le noeud principal qui doit être utilisé par la liste. Vous devez également spécifier le nombre de lignes et de colonnes qui seront diffusées dans votre liste ainsi que spécifier la méthode de défilement pour la liste.
   
   Dans l'exemple ci-dessus, nous avons utilisé les configurations suivantes.
   
   • Lignes : 8
   • Colonnes : 1
   • Défilement : Vertical
   • Type de défilement : Par page
   • Source de données : GTFS
   • Noeud principal : Routes
4. Il faut maintenant modifier l'intérieur de la liste, afin de le faire vous devez d'abord double cliquer la liste.
5. Une fois que vous arrivez dans la configuration de la liste, vous allez remarquer que vous avez une nouvelle liste de calques et que le reste du gabarit est maintenant grisé. Lors de l'application de visuel (d'outils tels que les formes, les textes, etc.) vous devez seulement configurer le visuel pour la première ligne, la liste va reproduire les configurations sur les lignes suivantes.
   
6. De la même façon que vous l'avez fait plus tôt, vous allez créer plusieurs calques pour séparer les objets que vous allez ajouter dans la liste. Vous allez donc commencer avec l'arrière-plan pour les entrées dans la liste.
   
7. Afin de créer une alternance dans la couleur de l'arrière-plan de chaque ligne dans la liste, vous pouvez cliquer sur le bouton des conditions d'affichage dans le coin supérieur gauche de la fenêtre après avoir sélectionné la forme.
   
8. Cliquez sur le « + » pour ajouté une condition
   
9. Dans les configurations de la condition du côté droit de la fenêtre, appliquez les configurations suivantes.
   • Condition (liste déroulante) : Est Pair
   • Opérateur (liste déroulante) : Égale
   • Condition (liste déroulante) : Statique
   • Valeur (texte) : true
   • Quantificateur (liste déroulante) : Aucun
   
10. Une fois que la condition apparait dans la liste du côté gauche de la fenêtre vous pouvez fermer la fenêtre.
    
11. Vous devez maintenant placer une zone de texte pour chaque type d'information inclus dans l'entête, voici un exemple du minimum d'information que vous pouvez inclure dans le gabarit.
    
    • Ligne (le numéro de l'autobus ou du train)
    • Destination (destination de l'autobus ou du train)
    • Minutes (avant l'arrivée ou le départ)
    
    
    
12. Pour configurer la donnée particulière que vous allez diffuser dans chaque outil de texte, double-cliquez l'outil de texte pour ouvrir sa configuration.
    
13. Plutôt que de configurer une valeur statique comme vous aviez fait pour l'entête, cliquez sur le bouton de données externes.
    
14. Utilisez la liste déroulante pour sélectionner la source de données.
    
15. Naviguez la source de données afin de visionner les informations sous le noeud principal (Routes dans ce cas-ci). Voici les champs à utiliser pour les trois informations utilisées dans cet exemple.
    
    • TransportData -> Routes -> RouteLabel (numéro de l'autobus)
    • TransportData -> Routes -> Trip1 -> Destination (la destination de l'autobus)
    • TransportData -> Routes -> Trip1 -> TimeToDepart (le temps en minutes avant le départ de l'autobus)
    • TransportData -> Routes -> Trip2 -> TimeToDepart (le temps en minutes avant le départ du prochain autobus)
    Cliquez sur le bouton nommé sauvegarder lorsque vous avez sélectionné le champ désiré.
    
16. Une fois que vous avez cliqué le bouton sauvegarder, votre sélection sera maintenant présente dans le champ de texte. Vous pouvez maintenant cliquer le bouton sauvegarder.
    
17. Compléter cette configuration pour chacun des outils de texte dans votre liste, une fois que vous l'avez fait, cliquez sur le bouton nommé « clip transport » pour retourner à la racine du gabarit.
    
    
18. Maintenant vous devez sauvegarder le gabarit afin d'appliquer les modifications que vous avez apportées. Suite à la sauvegarde du gabarit, celui-ci sera utilisable dans l'affichage désiré.