Guide utilisateur
Hockey Builder est l'outil de régie qui prépare et envoie les données graphiques vers Xpression pour les émissions de la National League sur MySports.
L'application tourne sur le Mac de régie. Tu ouvres l'interface dans ton navigateur (Safari, Chrome…), tu prépares tes données, et quand tu cliques Envoyer, un fichier JSON est écrit sur le kDrive partagé. Xpression lit ce fichier et met à jour les graphiques à l'antenne.
Le serveur doit tourner en arrière-plan pour que l'interface fonctionne. En cas de page blanche ou d'erreur, vérifie que le Terminal avec Node.js est bien ouvert.
Démarrer l'application
Double-clique sur l'icône Hockey Builder.app depuis le Finder.
- Une fenêtre Terminal s'ouvre automatiquement et lance le serveur.
- Ton navigateur par défaut ouvre http://localhost:3001.
- L'interface se charge, l'indicateur en haut à droite affiche ● API connectée.
Au premier lancement, macOS peut afficher "impossible d'ouvrir". Fais un clic droit → Ouvrir sur l'icône, puis confirme. Ça ne se reproduira plus.
Fermer l'application
Ferme la fenêtre du navigateur, puis ferme le Terminal (ou tape Ctrl + C dans le Terminal pour arrêter le serveur).
L'interface en un coup d'œil
| Élément | À quoi ça sert |
|---|---|
| HOCKEY BUILDER | Titre de l'app |
| Date | La date de référence pour le classement et le calendrier. Clique sur les flèches ← → pour changer de jour. |
| ● API connectée | Le serveur réussit à récupérer les données de la National League. Si rouge, les données sont en cache ou l'API est indisponible. |
| ● Auto-save | Un petit flash vert indique que tes données ont été sauvegardées automatiquement. |
Toutes tes données (liste d'invités, crosspromos, joueurs…) sont sauvegardées automatiquement dans le fichier data/store.json. Tu n'as rien à faire — elles seront là à la prochaine ouverture.
Classement
Affiche le classement National League du jour, récupéré automatiquement depuis l'API officielle.
Mode automatique (par défaut)
Le classement se charge tout seul à l'ouverture. Clique Recharger pour le mettre à jour manuellement.
Mode manuel
Coche Mode manuel pour verrouiller le classement et l'éditer ligne par ligne (points, matchs, différence de buts). Xpression reçoit ta version corrigée.
En mode manuel, "Recharger" est bloqué et affiche un message d'avertissement. Décoche "Mode manuel" d'abord si tu veux revenir aux données de l'API.
Envoyer à Xpression
Clique Envoyer le classement. Le fichier nl_standings.json est mis à jour sur le kDrive.
Calendrier
Affiche les matchs du jour avec leurs scores. Les données viennent de l'API — les scores s'affichent automatiquement dès qu'ils sont disponibles.
Ajouter un match manuellement
Clique + Ajouter une ligne pour saisir un match qui ne figure pas dans l'API (match reporté, match de présaison, etc.).
Mode manuel
Comme pour le classement, tu peux cocher Mode manuel pour modifier les scores directement dans le tableau sans que l'API les écrase.
Un match est automatiquement marqué comme joué dès que tu saisis les deux scores (domicile et visiteur). Pas besoin de cocher quoi que ce soit.
Le JSON exporté contient toujours 7 lignes minimum — les lignes vides permettent à Xpression de vider les éléments non utilisés à l'écran.
Lower Thirds
Gère les bandeaux inférieurs (sous-titres) qui apparaissent à l'antenne.
Studio (invités plateau) — 3 emplacements
- Dans la colonne de gauche, crée tes invités avec leur nom et leur fonction.
- Dans la colonne de droite, sélectionne qui apparaît dans chaque menu déroulant "Invité 1 / 2 / 3".
- Clique Envoyer à Xpression (Studio).
Tu peux laisser un emplacement sur "— Aucun —" si tu n'utilises que 1 ou 2 invités.
Commentateur — 2 emplacements
Même logique que Studio, avec 2 menus déroulants maximum.
Joueur
- Choisis l'équipe dans le premier menu.
- Sélectionne le joueur dans le menu "Rechercher / Sélectionner". Les champs se remplissent automatiquement.
- Ajuste si besoin (numéro facultatif, fonction libre : Entraîneur, DT, etc.).
- Clique + Créer / ajouter à la liste, puis sélectionne le joueur dans le menu de droite et clique Envoyer.
Alertes / Messages
Pour un message court affiché en bandeau (ex : ⚡ Match reporté à 20h30). Crée le message, sélectionne-le et envoie.
Crosspromo
Crée les annonces de matchs à venir pour la promotion croisée à l'antenne.
Créer un crosspromo
| Champ | Exemple |
|---|---|
| Libellé (ligne 1) | Quart de finale |
| Équipe Home / Away | Bienne / Lausanne |
| Date | 2026-03-07 |
| Heure | 19:25 |
| Chaîne / diffusion | MySports UN et en Free TV |
| Template avec photos | Coche si le template Xpression affiche des photos de joueurs |
| Logos free TV | Coche si les logos des chaînes Free TV doivent apparaître |
Envoyer à Xpression
Dans la colonne de droite, sélectionne le crosspromo dans le menu déroulant et clique Envoyer ce crosspromo à Xpression. Seul le crosspromo sélectionné est écrit dans le JSON — les autres restent dans ta liste pour usage futur.
Utilise le bouton ✎ Modifier pour éditer un crosspromo existant directement dans la liste. Les flèches ▲▼ permettent de changer l'ordre.
Tableaux (TABS)
Gère les images de tableaux (statistiques, résultats, infographies) à afficher à l'antenne.
Les images doivent être des PNG en 1920×1080 pixels. Tout autre format ou dimension sera refusé.
Importer des images
- Clique ＋ Importer des PNG.
- Sélectionne un ou plusieurs fichiers PNG.
- L'app vérifie automatiquement le format et les dimensions. Les images valides apparaissent dans la liste.
Gérer la liste
Pour chaque image tu peux :
- ▲ / ▼ — changer l'ordre dans la liste
- Note — ajouter un commentaire pour toi-même (ex : "Classement semaine 12")
- Envoyer — envoyer cette image à Xpression
- Suppr. — supprimer définitivement l'image du dossier
Envoyer à Xpression
Clique sur le bouton Envoyer de la ligne souhaitée. L'image est immédiatement sélectionnée (sa ligne s'encadre en rouge) et le fichier nl_tabs.json est mis à jour avec son nom de fichier.
Les PNG sont stockés dans le dossier TABS du kDrive. L'app n'en fait pas de copies — elle les référence dans le JSON.
Sponsors
Fonctionne exactement comme Tableaux, mais pour les images sponsors. Les fichiers vont dans le dossier SPONSORS et le JSON de sortie est nl_sponsors.json.
Programme du jour
Définit l'affichage du programme diffusion du jour à l'antenne.
- Les matchs du jour sont pré-remplis depuis le calendrier.
- Pour chaque match, sélectionne la chaîne dans le menu déroulant.
- Clique Envoyer le programme à Xpression.
Comme pour le calendrier, le JSON contient toujours 7 lignes minimum.
Playoff / Playout / Play-in
Gère le tableau des séries éliminatoires entièrement à la main.
Créer une série
- Choisis les équipes Home et Away dans les menus.
- Sélectionne le tour (Quart de finale, Demi-finale, Finale, Playout).
- Clique + Ajouter la série.
Saisir les scores
Pour chaque match d'une série, sélectionne le résultat dans la liste déroulante de chaque partie :
- Tiret : match pas encore joué
- Valeur personnalisée (ex : "Match 1") : tu peux configurer ces libellés dans Réglages
- Score (ex : 3-1) : saisis le score directement
Envoyer à Xpression
Clique Envoyer le Playoff à Xpression. Le JSON nl_playoff.json est mis à jour.
Studio (Compositing)
Gère l'habillage visuel du plateau studio — les overlays back (1920×1080) et front (1152×216) affichés dans Millumin.
Configurer
- Sélectionne les équipes Domicile et Visiteur.
- Choisis le mode d'affichage : AB (les deux logos), A (domicile seul), B (visiteur seul), Aucun.
- Pour chaque mode, configure les couches PNG : upload, opacité, position.
Publier
Clique ⬆ Publier pour appliquer la configuration dans Millumin. Les aperçus Back et Front se mettent à jour en temps réel.
Réglages
Configuration des chemins d'accès aux fichiers JSON exportés et des mappings d'équipes.
Chemins d'export
Chaque section de l'app a son fichier JSON de destination. Ces chemins pointent vers le kDrive partagé entre le Mac et la machine Xpression.
Les chemins sont déjà configurés. Ne les modifie que si le kDrive a changé d'emplacement ou si tu rajoutes une nouvelle machine.
Mapping des équipes
Associe le nom officiel de l'API au nom court utilisé dans l'interface.
| Colonne | Description | Exemple |
|---|---|---|
| Nom(s) API | Le ou les noms exacts renvoyés par l'API (sépare les variantes avec |) | SC Rapperswil-Jona Lakers | SCRJ Lakers |
| Nom court | Le nom affiché dans tous les menus de l'app | Rapperswil |
| Code | L'abréviation envoyée à Xpression pour les photos de joueurs | SCRJ |
Questions fréquentes
L'API affiche une erreur rouge — que faire ?
L'API de la National League est temporairement indisponible. Les données en cache restent utilisables. Réessaie dans quelques minutes en cliquant Recharger.
J'ai fermé le Terminal par accident
Relance l'app en double-cliquant sur Hockey Builder.app. Si l'app détecte que le serveur tourne déjà, elle ouvre juste le navigateur.
L'interface ne se charge pas (page blanche)
Vérifie que le Terminal est ouvert avec node server.js en cours d'exécution. Si non, ouvre un Terminal, va dans le dossier du projet et tape node server.js.
Mes données ont disparu
Toutes les données sont dans data/store.json. Si ce fichier a été supprimé par erreur, les données sont perdues. Pense à faire des sauvegardes régulières du dossier data/.
Xpression ne se met pas à jour
Vérifie que le kDrive est bien synchronisé sur les deux machines. Si le kDrive est déconnecté, les fichiers JSON ne sont pas transmis à la machine Xpression.
Un joueur n'apparaît pas dans l'API
Crée-le manuellement : dans Lower Thirds → Joueur, laisse le champ API sur "— Saisie manuelle —" et remplis les champs à la main. Le numéro est facultatif (utile pour les entraîneurs).