Smart Displays et applications publiées
Sur cette page
Un Smart Display est un écran qui affiche une application hébergée par votre Agent IA. Comme c'est l'agent qui exécute l'application, il peut modifier ce qu'affiche l'écran à mesure que les choses évoluent autour de lui : le coup de feu du déjeuner au comptoir, un visiteur qui ouvre la porte d'entrée, le hall d'un hôtel qui se remplit, une salle d'attente bondée, des membres qui arrivent pour un défi de fréquentation. Décrivez ce que vous voulez en langage courant. L'agent crée l'application et la tient à jour, et vous la diffusez sur vos écrans comme n'importe quel autre contenu.


Figure 1 : Un Smart Display dans l'espace d'entraînement d'une salle de sport. L'agent recompte les enregistrements d'arrivée toutes les quelques minutes et indique leur rang aux membres qui viennent d'arriver. Le club et les membres sont fictifs.
Vous gardez le contrôle : chaque application se trouve dans votre Library, où vous pouvez la prévisualiser, voir où elle est utilisée, et la modifier ou la supprimer.
Écrans intelligents
Un Smart Display utilise une Agent: Published App : une application web créée par votre Agent IA, qui s'exécute en direct sur l'appareil Agent IA de votre installation. Les écrans affichent l'application en direct : lorsque l'agent modifie ce qu'elle affiche, l'écran change aussi. Personne n'a rien à republier.
L'agent tient l'application à jour de l'une des deux façons suivantes :
- Selon un planning. Une automatisation s'exécute toutes les quelques minutes pendant les heures qui comptent. Grâce à sa connexion à Performance Hub, l'agent lit ce dont il a besoin, comme les enregistrements d'arrivée, les événements de porte ou les comptages des caméras, et met à jour l'application. Chaque exécution consomme des dépenses IA : ne vérifiez donc qu'aussi souvent que nécessaire.
- Lorsqu'un événement se produit. Un événement sur votre site, comme le badge d'un visiteur qui ouvre la porte d'entrée, incite l'agent à mettre à jour l'application. L'écran change peu après l'événement, et l'agent ne fait rien entre-temps. Consultez l'accueil de chaque visiteur dans le hall d'un bureau.
Un Smart Display ne peut utiliser que ce que l'agent peut lire. Son accès MCP doit inclure l'installation et les fonctionnalités dont l'application a besoin, comme Door & Gate Access pour les événements de porte ou CCTV pour les enregistrements d'arrivée et les comptages des caméras. Consultez Connexion à Performance Hub.
Deux façons pour une application d'atteindre vos écrans
| Agent: Published App (Smart Display) | On-Device Web App | |
|---|---|---|
| Qui la crée | Votre Agent IA | Vous, un développeur ou tout agent IA connecté via MCP |
| Où elle s'exécute | Sur votre appareil Agent IA, affichée en direct sur les écrans | Sur chaque écran (les écrans la téléchargent) |
| S'adapte en continu | Oui : l'agent la modifie à mesure que les choses évoluent sur votre site | Non : elle diffuse les mêmes fichiers jusqu'à la publication d'une nouvelle version |
| Données de votre installation | Oui, tout ce que l'agent peut lire | Non : uniquement des données publiques, comme la météo |
| En cas de coupure d'Internet ou de l'agent | Ignorée jusqu'au retour de l'agent | Continue d'être diffusée |
| Versions et retour arrière | Gérés par l'agent | Oui, dans la Library |
| Modules nécessaires | Display Screens, Agent IA et Custom Apps | Display Screens |
Votre agent peut aussi créer une On-Device Web App pour vous, mais une fois publiée, elle ne peut plus s'adapter. Elle diffuse les mêmes fichiers sur chaque écran jusqu'à ce que quelqu'un publie une nouvelle version, et elle ne peut pas utiliser les données de votre installation. Seule une Agent: Published App continue d'évoluer avec ce qui se passe autour de l'écran.
Choisissez un Smart Display lorsque l'écran doit réagir à votre site : qui est arrivé, le niveau d'affluence ou ce qui vient de se passer. Choisissez une On-Device Web App pour un contenu qui reste identique ou n'a besoin que de données publiques, et qui doit continuer d'être diffusé hors ligne.
Exemples de Smart Displays
Chaque exemple ci-dessous est une configuration réelle : ce à quoi l'écran réagit, ce qu'il affiche, comment l'agent le tient à jour et ce dont vous avez besoin. Les entreprises et les personnes sont fictives.
Classement d'un défi de fréquentation qui accueille les membres à leur arrivée
Un espace de coworking, une bibliothèque universitaire ou une salle de sport organise un défi de fréquentation pour le mois. Son agent héberge, pour les écrans devant lesquels passent les membres, un classement qui ordonne les membres selon leurs visites du mois et souhaite la bienvenue aux participants du défi lorsqu'ils sont près de l'écran. Dans les figures, une salle de sport organise un défi de fréquentation d'octobre sur les écrans de son espace d'entraînement.
- Réagit à : qui se trouve près de l'écran. L'agent le sait grâce à la reconnaissance faciale de Performance Hub, aux enregistrements d'arrivée récents, ou aux deux, selon la configuration de votre site. Chaque participant au défi qui se trouve près de l'écran reçoit une étiquette Just in et une carte indiquant son rang. Dans les figures, la salle de sport utilise les enregistrements d'arrivée des 30 dernières minutes.
- Affiche : les meilleurs membres par nombre de visites, avec uniquement le prénom et l'initiale du nom, les jours restants du défi et le prix à gagner.
- Reste à jour : toutes les 5 minutes pendant les heures d'ouverture, l'agent recompte les enregistrements d'arrivée du mois avec
insights_checkins, vérifie qui se trouve près de l'écran et met à jour l'application. - Ce qu'il vous faut : CCTV avec AI Insights & People, avec la reconnaissance faciale activée sur les caméras proches de l'écran, les enregistrements d'arrivée de votre système de gestion des membres, ou les deux, ainsi qu'une liste des membres qui ont accepté de participer au défi.


Figure 2 : Demandez le classement à votre Agent IA. Il crée l'application, l'ouvre à côté de la conversation et recompte les enregistrements d'arrivée toutes les 5 minutes. La conversation est un exemple.


Figure 3 : Le même classement sur un écran en mode portrait
Confidentialité. N'incluez que les membres qui ont donné leur accord, n'affichez pas plus que le prénom et l'initiale du nom, et n'affichez jamais d'informations d'adhésion ou de santé.
Menu de restauration rapide qui réagit au coup de feu du déjeuner
Un restaurant de restauration rapide demande à son agent un menu pour l'écran situé au-dessus du comptoir. Le menu change au fil de la journée et, lorsque le comptoir est très fréquenté, fait remonter en tête les articles les plus rapides à préparer.
- Réagit à : l'heure de la journée et l'affluence au comptoir : le nombre de personnes comptées par la caméra du comptoir depuis le début de l'heure, comparé à une heure normale.
- Affiche : le petit-déjeuner jusqu'à 11 h, le déjeuner jusqu'à 15 h, puis le menu de l'après-midi. En cas d'affluence, une bannière Ready in under 3 minutes avec les articles rapides à préparer, et une étiquette Quick sur ces articles dans le menu.
- Reste à jour : toutes les 5 minutes, l'agent consulte les comptages des caméras de la journée dans AI Insights & People et met à jour l'application. Les prix et les temps de préparation proviennent d'un fichier de menu que vous fournissez à l'agent.
- Ce qu'il vous faut : CCTV avec AI Insights & People, avec une caméra couvrant le comptoir.


Figure 4 : L'agent crée le menu et l'ouvre à côté de la conversation. Il n'utilise que des comptages anonymes. La conversation est un exemple.


Figure 5 : Le résultat au-dessus du comptoir pendant le coup de feu du déjeuner
Accueil de chaque visiteur dans le hall d'un bureau
Un bureau remet à chaque visiteur un badge Door & Gate Access valable pendant la durée de sa visite. Lorsque le badge d'un visiteur ouvre la porte d'entrée, l'écran du hall l'accueille par son prénom en indiquant la personne qui le reçoit, la salle de réunion et l'itinéraire, puis revient au message d'accueil habituel au bout d'une minute.
- Réagit à : l'ouverture de la porte d'entrée par le badge du visiteur.
- Affiche : « Hi Priya, great to see you », le nom et l'équipe de la personne qui le reçoit, la salle et l'heure de la réunion, et un itinéraire étape par étape.
- Reste à jour : un workflow déclenche le message d'accueil lorsque le badge du visiteur ouvre la porte d'entrée. L'agent associe la personne de l'événement de porte à la liste des visiteurs du jour, que l'accueil tient à jour et transmet à l'agent avec, pour chaque visiteur, la personne qui le reçoit, la salle et l'itinéraire. Les événements de porte ne contiennent ni noms, ni hôtes, ni salles : la liste est donc toujours nécessaire.
- Ce qu'il vous faut : Door & Gate Access et une liste des visiteurs du jour.


Figure 6 : L'agent crée l'écran d'accueil et l'ouvre à côté de la conversation. La conversation est un exemple.


Figure 7 : Le résultat sur l'écran en mode portrait du hall
La même configuration peut accueillir votre propre équipe. Par exemple, elle peut souhaiter un joyeux anniversaire à un membre de l'équipe lorsqu'il arrive le jour de son anniversaire, à partir d'une liste d'anniversaires des personnes qui y ont consenti. La date de naissance est une information personnelle : n'incluez que les personnes qui ont donné leur accord, et n'affichez pas plus que le prénom.
Pensez à qui peut voir l'écran. Toute personne présente dans le hall peut voir un message d'accueil. N'affichez pas plus que le prénom, et n'affichez jamais d'informations privées comme des données de santé, d'adhésion ou de ressources humaines.
Panneau de salle d'attente avec les temps d'attente en direct
Une clinique ou un centre de services affiche le temps d'attente actuel, afin que les personnes qui attendent sachent à quoi s'attendre.
- Réagit à : le nombre approximatif de personnes qui attendent, d'après les comptages anonymes de la caméra couvrant la zone d'attente, et les arrivées issues des enregistrements, lorsque votre site les enregistre.
- Affiche : un temps d'attente approximatif et le nombre approximatif de personnes qui attendent, les heures d'ouverture, et un message rassurant en cas d'affluence.
- Reste à jour : toutes les quelques minutes, l'agent lit les derniers comptages et arrivées et calcule le temps d'attente à partir de la durée type d'une visite que vous lui indiquez.
- Ce qu'il vous faut : CCTV avec AI Insights & People, avec une caméra couvrant la zone d'attente.
Un exemple de ce qu'affiche l'écran en cas d'affluence :
Environ 25 minutes
Environ 7 personnes en attente
Nous sommes plus sollicités que d'habitude ce matin. Merci de votre patience : nous vous appellerons dès que nous serons prêts.
N'affichez jamais d'informations sur les patients ou les clients. Le panneau n'affiche que des totaux, jamais de noms ni de motifs de visite.
Panneau de hall d'hôtel qui suit le déroulement de la journée
Un hôtel ou un lieu d'accueil présente le programme à ses clients, en fonction de l'heure de la journée et de l'affluence dans le hall.
- Réagit à : l'heure de la journée et l'affluence dans le hall, d'après les comptages anonymes de la caméra du hall.
- Affiche : les informations d'enregistrement et les identifiants Wi-Fi l'après-midi, les événements du soir et les disponibilités du restaurant en soirée, et les horaires du petit-déjeuner et les rappels de départ le matin. Lorsque le hall est très fréquenté, les informations d'enregistrement et les identifiants Wi-Fi passent en premier, afin que les clients qui arrivent les trouvent rapidement.
- Reste à jour : toutes les quelques minutes, l'agent lit les comptages du hall et met à jour l'application. Les événements et les disponibilités du restaurant proviennent de listes ou de systèmes auxquels vous donnez accès à l'agent.
- Ce qu'il vous faut : CCTV avec AI Insights & People pour les comptages du hall. Sans CCTV, le panneau change tout de même selon l'heure de la journée.
Un exemple de ce qu'affiche l'écran à 18 h :
Ce soir au Demo Harbour Hotel
Jazz au salon, de 19 h à 22 h
Harbour Grill : tables disponibles à partir de 20 h 30. Réservez à la réception.
Petit-déjeuner demain à partir de 6 h 30 au Harbour Grill.
Signalétique de centre commercial qui s'adapte au public
Un centre commercial demande à son agent une signalétique pour l'atrium qui choisit la promotion en fonction de la répartition par âge et par genre des clients situés près des panneaux.
- Réagit à : la répartition par âge et par genre des clients situés près des panneaux au cours des 5 dernières minutes, sous forme de comptages agrégés anonymes : totaux par tranche d'âge (18-24, 25-34, 35-44, 45-54 et 55+) et par genre. Aucune personne n'est jamais identifiée ni suivie.
- Affiche : une promotion destinée aux familles, aux étudiants ou aux seniors, ou une promotion générale, avec l'horloge et le programme du jour, et rien sur les personnes à proximité.
- Reste à jour : toutes les 5 minutes, l'agent lit les données démographiques issues des données de vision par ordinateur de l'installation dans AI Insights & People et, chaque fois que la promotion doit changer, actualise l'application.
- Ce qu'il vous faut : CCTV avec AI Insights & People dans l'installation.


Figure 8 : L'agent crée l'application et l'ouvre à côté de la conversation. Il n'utilise que des comptages anonymes, jamais des personnes individuelles. La conversation est un exemple.


Figure 9 : Le résultat sur un écran en mode paysage. Il affiche la promotion, jamais rien sur les personnes à proximité.


Figure 10 : La même application sur un écran en mode portrait
Confidentialité. N'utilisez que des comptages agrégés, respectez la législation sur la protection de la vie privée qui s'applique à vous, et informez les clients que des caméras et une mesure d'audience sont utilisées.
Consignes de sécurité en cas d'urgence
N'importe quel site peut faire basculer ses écrans sur des consignes de sécurité en cas d'urgence, puis revenir à la normale une fois la situation terminée.
- Réagit à : le déclencheur choisi par votre site, par exemple un confinement ou une évacuation lancé par votre site, et la fin de cet événement.
- Affiche : les consignes que vous avez préparées pour cet événement, à la place de tout le reste sur les écrans que vous choisissez. Lorsque l'événement se termine, les écrans reviennent à leur contenu habituel.
- Reste à jour : les écrans que vous choisissez basculent sur vos consignes lorsque le déclencheur choisi se produit, et reviennent à la normale lorsque l'événement se termine. Votre agent peut vous aider à rédiger les consignes et à mettre cela en place.
- Ce qu'il vous faut : Display Screens, et des consignes convenues avec la personne responsable de la sécurité sur votre site.
Préparez les consignes sous forme d'image ou d'On-Device Web App plutôt que d'Agent: Published App, afin qu'elles s'affichent même si l'agent est hors ligne. Convenez de ce qu'affichent les écrans, et de quels écrans l'affichent, avec la personne responsable de la sécurité sur votre site, et testez-le avec elle.
Tenez les alarmes silencieuses à l'écart des écrans publics. Les alarmes Duress sont silencieuses : elles ne doivent donc pas piloter les écrans visibles du public. Une prise de contrôle déclenchée par une alarme Duress n'a de sens que sur des écrans situés dans des zones privées non accessibles au public, comme un bureau administratif.
Agent : Applications publiées
Une Agent: Published App est une application web créée par votre Agent IA, qui s'exécute en direct sur l'appareil Agent IA de votre installation. Comme elle s'exécute sur l'agent, elle peut avoir sa propre partie serveur et se mettre à jour d'elle-même. Les écrans l'affichent en direct depuis l'agent.
Créer une application au cours d'une conversation
Demandez à votre Agent IA l'écran que vous souhaitez, en précisant son emplacement et ce à quoi il doit réagir. L'agent crée l'application et l'ouvre à côté de la conversation pour que vous puissiez la vérifier. Par exemple :
- « Crée un classement pour notre défi de fréquentation d'octobre à partir des enregistrements d'arrivée, et tiens-le à jour toutes les quelques minutes pendant les heures d'ouverture. »
- « Fais un menu pour le comptoir qui passe du petit-déjeuner au déjeuner à 11 h et met en avant les articles rapides à préparer en cas d'affluence. »
- « Fais un écran d'accueil pour le hall qui salue chaque visiteur lorsque son badge ouvre la porte d'entrée. »
Un écran d'entraînement dans l'espace d'entraînement d'une salle de sport
Une salle de sport demande à son agent un écran d'entraînement en mode portrait pour son espace d'entraînement. Il affiche deux postes, l'un au-dessus de l'autre : un test de référence au ski erg et des abdominaux, chacun avec son objectif et une courte vidéo de démonstration en boucle. Entre les deux se trouve un grand minuteur de rounds, avec l'intensité cible au centre.


Figure 11 : Demandez un écran d'entraînement à votre Agent IA. Il crée l'application et l'ouvre à côté de la conversation. La conversation est un exemple.


Figure 12 : Le résultat sur un écran en mode portrait dans l'espace d'entraînement
Publier une application depuis votre Agent IA
Dans Agent IA → Published apps, choisissez Publish to Performance Hub et renseignez les champs suivants :
| Paramètre | Rôle |
|---|---|
| Name | Jusqu'à 60 caractères |
| Icon et Description | La façon dont l'application est présentée dans la liste. La description peut comporter jusqu'à 300 caractères. |
| Support email | La personne à contacter au sujet de l'application |
| Health checks & auto-repair | Activé par défaut. L'agent redémarre ou répare l'application si elle cesse de fonctionner. |
| Allow on display screens | Désactivé par défaut. Activez-le pour permettre l'affichage de l'application sur les écrans. Le paramètre affiche l'avertissement suivant : « Anyone near those screens can see it, so only allow apps without private information. » |
| Audience | Qui peut utiliser l'application : Only me (testing), Specific people, This facility (par défaut), Selected facilities, Whole brand ou Entire organisation. Elle ne peut jamais être plus large que votre propre accès, et les audiences au niveau de la marque ou de l'organisation nécessitent un accès au niveau de l'organisation. |
Depuis le même onglet, vous pouvez utiliser Pause et Resume, Edit, Unpublish, Transfer ownership et Show on screens.
L'afficher sur les écrans
- Dans Display Screens, ouvrez la Library et cliquez sur Add content → Agent: Published App.
- Choisissez l'application. Chaque application éligible est présentée avec une image, et un badge Hors ligne si l'agent est hors ligne.
- Donnez-lui un Name et, si vous le souhaitez, des Tags et une valeur Show for (seconds), puis cliquez sur Add to library.
- Publiez-la sur des écrans, ou ajoutez-la à une playlist.


Figure 13 : Ajouter une Agent: Published App à la Library. Choisissez l'application, donnez-lui un nom et cliquez sur Add to library. Les images des applications qui ne font pas partie de cet exemple sont floutées.


Figure 14 : Une Agent: Published App dans la Library. L'aperçu est une image de l'application en direct, prise par le Performance Hub. Where it is used liste les écrans et les plannings qui l'affichent. Le club et les membres sont fictifs.
Les aperçus, comme Preview landscape, Preview portrait et l'aperçu de la playlist, ne peuvent pas afficher l'application en direct : ils affichent donc le texte de substitution « Shown live on the screen ».
Prérequis
- Le module Agent IA, pour publier l'application.
- Le module Custom Apps (AI Agent: Published Apps) dans l'installation, pour l'afficher sur les écrans.
- L'application doit être active, avoir Allow on display screens activé et avoir une audience qui inclut l'installation.
Quand les écrans ignorent une application d'agent
Les écrans passent à l'élément suivant tant qu'une application d'agent :
- est en pause ou dépubliée,
- n'est pas autorisée sur les écrans d'affichage,
- a une audience qui n'inclut pas l'installation,
- se trouve dans une installation qui ne dispose pas du module Custom Apps, ou
- est inaccessible parce que l'agent est hors ligne.
Si une application est définitivement dépubliée, retirez-la de vos playlists et de vos plannings.
Applications Web sur appareil
Une On-Device Web App est un ensemble statique de fichiers HTML, CSS et JavaScript. Les écrans la téléchargent et la diffusent depuis leur propre stockage : elle continue donc d'être diffusée en cas de coupure Internet. Elle convient aux contenus qui n'ont pas besoin de réagir à votre site, par exemple :
- Toute entreprise dotée d'un accueil : un panneau de bienvenue à la réception avec votre logo, la date et l'heure, et un bandeau d'actualités. Bureaux, cliniques, salles de sport, hôtels, écoles et showrooms peuvent tous l'utiliser. Consultez Exemple : un panneau de bienvenue à la réception.
- Hôtellerie et restauration : un menu qui passe du petit-déjeuner au déjeuner puis au dîner à heures fixes.
- Commerce de détail : une promotion en vitrine qui fait défiler les offres spéciales de la semaine.
- Éducation : un panneau d'affichage de campus avec les événements et les rappels du jour.


Figure 15 : Reception Welcome Sign, une On-Device Web App, sur un écran en mode paysage. L'horloge, la date et le message d'accueil utilisent le fuseau horaire de l'installation. Le badge Preview n'apparaît que dans les aperçus, pas sur les écrans réels. Acme Demo Co. est fictive, et les titres de cette capture d'écran sont des exemples.


Figure 16 : La même application sur un écran en mode portrait
Exemple : un panneau de bienvenue à la réception
Le Reception Welcome Sign accueille les personnes à votre réception avec votre logo, la date et l'heure, et un bandeau d'actualités. Il convient à toute entreprise dotée d'une réception ou d'une entrée.
- Diffusé depuis l'écran : le logo, l'arrière-plan, la police, l'horloge, la date et le message d'accueil font tous partie de l'application : ils continuent donc de fonctionner sans Internet. L'horloge suit le fuseau horaire de l'installation.
- Une seule partie utilise Internet : le bandeau d'actualités. Par défaut, il affiche les titres de la rubrique « In the news » de Wikipédia, avec mention de la source à l'écran. Il peut à la place lire n'importe quel flux RSS qui autorise les requêtes intersites, par exemple un flux d'actualités transmis par votre propre relais.
- Gère l'absence de connexion : le bandeau se masque lorsque l'écran est hors ligne ou lorsque les titres ne peuvent pas être chargés, et réapparaît lorsque l'écran est de nouveau en ligne. Tout le reste est diffusé depuis la copie locale de l'écran.
- Personnalisez-le : téléchargez le panneau depuis Pour les développeurs ci-dessous, remplacez
logo.svgetbackground.jpg, et modifiez le texte d'accueil et les paramètres d'actualités dansconfig.js, ou désactivez le bandeau. Téléversez-le ensuite : Library → Add content → On-Device Web App → Choose ZIP → Publish app.


Figure 17 : Lorsque les titres ne peuvent pas être chargés, ou que l'écran est hors ligne, le panneau masque le bandeau et continue d'afficher tout le reste. Le bandeau réapparaît dès que les titres se chargent à nouveau.
Pour les développeurs : comment le panneau est conçu
Télécharger le Reception Welcome Sign (ZIP, 134 KB)
| Fichier | Rôle |
|---|---|
index.html | La page. Charge le Display App SDK, config.js et app.js. |
config.js | Texte d'accueil, message de salutation, fuseau horaire de secours et paramètres d'actualités |
app.js | Horloge, date et message de salutation dans le fuseau horaire de l'installation, et bandeau d'actualités |
style.css | Mise en page pour les écrans en mode paysage et portrait |
logo.svg, background.jpg, source-sans-3.woff2 | Logo, arrière-plan et police, stockés dans l'application |
README.txt, OFL.txt | Comment personnaliser le panneau, et la licence de la police |
L'application lit le fuseau horaire et les paramètres régionaux de l'installation depuis PHDisplay.onInit(ctx). Si le SDK ne peut pas être chargé, par exemple lorsque l'écran démarre hors ligne, elle utilise timeZone dans config.js ou le fuseau horaire propre à l'écran.
Le bandeau est la seule partie qui récupère des données en direct. Le Display App SDK, facultatif, est chargé depuis l'hôte d'applications de Performance Hub. Tant que l'écran est hors ligne, le bandeau n'envoie aucune requête et reste masqué, et l'événement online du navigateur recharge les titres :
function loadNews() {
clearTimeout(nextTimer);
if (navigator.onLine === false) {
hideTicker();
return; // the 'online' event loads it again
}
if (loading) return;
loading = true;
var load = news.source === 'rss' ? rssHeadlines : wikipediaHeadlines;
load()
.then(function (headlines) {
failures = 0;
showTicker(headlines.slice(0, news.maxHeadlines || 8));
schedule(news.refreshMinutes || 15);
})
.catch(function () {
hideTicker();
// ... schedules the next try
})
.then(function () { loading = false; });
}
window.addEventListener('offline', function () { clearTimeout(nextTimer); hideTicker(); });
window.addEventListener('online', function () { failures = 0; loadNews(); });
Pour utiliser une autre source d'actualités, définissez source: 'rss' et rssUrl dans config.js avec un flux qui autorise les requêtes intersites (il envoie un en-tête Access-Control-Allow-Origin), par exemple un flux d'actualités transmis par votre propre relais. Vérifiez que les conditions d'utilisation du flux autorisent son affichage sur vos écrans. Pour désactiver le bandeau, définissez enabled: false sous news.
Il existe deux façons d'en ajouter une :
- Demandez à un agent IA de la créer et de la publier.
- Ajoutez-la vous-même : Library → Add content → On-Device Web App, puis téléversez un ZIP, un dossier ou des fichiers. Consultez Ajouter du contenu.


Figure 18 : Demandez un écran à votre Agent IA. Il crée l'application, l'ouvre à côté de la conversation pour que vous puissiez la vérifier, et l'ajoute à votre Library Display Screens en tant qu'On-Device Web App, prête à être diffusée sur un écran. La conversation est un exemple.
Pour publier une On-Device Web App, l'agent :
- Lit les recommandations relatives aux applications Display Screens, afin que l'application s'adapte à un écran et respecte les règles ci-dessous.
- Publie l'application dans votre Library. Au cours de la même étape, il peut la publier sur des écrans ou des groupes, la planifier ou prendre le contrôle des écrans.
- Vérifie son travail à l'aide d'une capture d'écran de l'application rendue.
- Revient à une version antérieure si vous le demandez.
Tout agent IA connecté via MCP peut le faire si son accès inclut la fonctionnalité Display Screens, y compris votre Agent IA. Consultez les outils MCP de Display Screens et Créer une clé MCP. Votre agent vous demande une confirmation avant d'agir sur plusieurs écrans à la fois.


Figure 19 : Filtrez la Library sur On-Device Web Apps pour voir toutes les applications de l'installation. Les miniatures des applications qui ne font pas partie de cet exemple sont floutées.
La diffuser sur des écrans
Pour diffuser vous-même une application sur des écrans, ouvrez-la dans la Library et cliquez sur Publier. Dans Show on screens, choisissez tous les écrans de l'installation ou des écrans individuels, puis choisissez When : Always (default), Scheduled ou Take over now. Consultez Publier du contenu.


Figure 20 : Afficher le Reception Welcome Sign sur l'écran Reception Lobby
Versions
Chaque publication crée une nouvelle version qui ne change jamais. Ouvrez l'application dans la Library pour voir ses Versions : la version actuelle porte la mention Live, et Make live sur n'importe quelle version antérieure permet de revenir à celle-ci. Sous Publish a new version, déposez un ZIP, un dossier ou des fichiers pour téléverser vous-même une nouvelle version.
Lorsqu'une nouvelle version est publiée, le Performance Hub affiche « New version published. Screens update within a few seconds. ». Après Make live, il confirme quelle version est active, par exemple « Version 4 is now live ». La modification atteint tous les écrans qui affichent l'application.


Figure 21 : Le Reception Welcome Board dans la Library : son aperçu, Preview landscape et Preview portrait, et quatre versions, dont v4 active et Make live sur les versions antérieures
Utilisez Preview landscape et Preview portrait pour ouvrir l'application au format de l'écran et vérifier qu'elle s'affiche correctement avant de la publier sur des écrans.
Fonctionnement
- Hors ligne : les écrans conservent une copie de l'application, qui continue donc d'être diffusée sans Internet. Tout ce que l'application charge depuis Internet est indisponible tant qu'un écran est hors ligne.
- Données en direct : uniquement depuis des API HTTPS publiques qui autorisent les requêtes cross-origin.
- Isolée : l'application s'exécute dans un bac à sable, séparée du Performance Hub, sans accès à votre session Performance Hub.
Limites
| Limite | Valeur |
|---|---|
| Taille totale | 10 MB |
| Nombre de fichiers | 200 |
| Taille d'un fichier | 5 MB |
| Longueur du chemin d'un fichier | 200 caractères |
| Types de fichiers | html, htm, css, js, mjs, json, svg, png, jpg, jpeg, webp, gif, woff, woff2, txt, map |
| Durée d'affichage dans une playlist | 5 à 3 600 secondes |
Recommandations de conception
- Remplir l'écran sans défilement : 1920 × 1080 pour les écrans en mode paysage, 1080 × 1920 pour les écrans en mode portrait.
- Texte de grande taille : corps de texte d'au moins 32 px, titres d'au moins 64 px.
- Contraste élevé, afin que l'écran soit lisible depuis l'autre bout de la pièce.
- Pas de connexion, de formulaires ni d'effets de survol. Personne n'interagit avec un écran.
- Peu gourmande en ressources processeur, afin de fonctionner de manière fluide sur le lecteur.
- Gère l'absence de connexion, par exemple lorsqu'une API publique qu'elle utilise est inaccessible.
- Utilise le fuseau horaire de l'installation pour les horloges et les heures.
Ces recommandations conviennent aussi aux Smart Displays.
Pour les développeurs : le Display App SDK
Les applications peuvent, si elles le souhaitent, utiliser le Display App SDK pour obtenir des informations sur l'écran sur lequel elles s'exécutent et pour signaler leur état.
| Appel | Ce qu'il fournit |
|---|---|
PHDisplay.onInit(ctx) | S'exécute au démarrage de l'application. ctx inclut l'écran (id, nom, orientation, largeur, hauteur), l'installation (id, nom, fuseau horaire), les paramètres régionaux, la marque (nom, logoUrl, primaryColor), l'élément (id, durationSec) et indique s'il s'agit d'un aperçu |
onVisible, onHidden | S'exécutent lorsque l'application est affichée ou masquée à l'écran |
ready(), done(), error() | Signalent l'état de l'application à l'écran |
durationSec est la durée d'affichage de l'élément, de 5 à 3 600 secondes.
Pages associées
- Ajouter du contenu : téléverser vous-même une On-Device Web App
- Publier du contenu : diffuser une application sur des écrans
- Fonctionnalités de l'Agent IA : ce que votre agent peut faire d'autre
- Automatisations de l'Agent IA : tenir un Smart Display à jour selon un planning
- Door & Gate Access et AI Insights & People : arrivées, événements de porte et comptages des caméras auxquels un Smart Display peut réagir
- Dépannage : une application ne s'affiche pas sur un écran