Personnalisez votre image de marque

Vous pouvez adapter l’apparence de l’écran, de la borne et de la page de ticket client à l’identité visuelle de votre organisation. L’image de marque s’applique à toute l’organisation. Les changements enregistrés apparaissent immédiatement sur chaque appareil appairé, sans mise à jour de l’application.

La vidéo ci-dessous montre l’écran, la borne et la page de ticket avec plusieurs identités visuelles. Le logo, les couleurs, les polices et l’arrondi changent ensemble. Les fonctionnalités restent identiques.

Ce que vous pouvez personnaliser

Ouvrez Paramètres → Image de marque dans le panneau Admin :

Logo — une URL d’image hébergée. Il apparaît dans le pied de page de la page de ticket client et de la borne, et — sur l’écran — au-dessus du titre « En cours de service ».
Taille du logo — un multiplicateur de taille (0,8–1,6×, par défaut 1.0) qui agrandit ou réduit votre logo sur les écrans client, borne et affichage.
Couleurs primaire et secondaire — les deux couleurs de marque principales utilisées sur les boutons, en-têtes et accents.
Couleur d’accentuation — utilisée pour les états de survol et les anneaux de focus interactifs.
Couleur de mise en évidence — utilisée pour les icônes, les libellés et les statuts, jamais pour les boutons ou les liens.
Couleur du flash d’appel — la couleur du flash plein écran que l’écran affiche lorsqu’un ticket est appelé (voir Sons de notification pour le comportement du flash lui-même).
Couleurs de texte, de fond, de surface et de bordure — le reste de la palette qui garde chaque écran lisible face aux couleurs de marque choisies.
Arrondi des coins — de vif (0) à entièrement arrondi, appliqué de manière cohérente aux cartes, boutons et panneaux.
Polices de la marque — une liste ordonnée de trois polices Google Fonts au maximum. La première est la police principale. Les suivantes fournissent les caractères absents des précédentes. Utilisez les commandes haut et bas pour modifier l’ordre. Vous pouvez ajouter un filtre de système d’écriture, comme latin, grec, japonais, coréen ou chinois, afin d’afficher les polices qui prennent en charge les langues activées. Un message signale les systèmes non couverts. Laissez la liste vide pour utiliser la police Jonot par défaut, Inter. Chaque écran charge uniquement les polices nécessaires.
Échelle de police — un multiplicateur de taille (0,85–1,5×) pour les organisations qui souhaitent une typographie plus grande ou plus compacte partout.

Le panneau Admin affiche un aperçu de l’écran, de la borne et de la page de ticket pendant vos modifications. Vous pouvez vérifier chaque changement avant de l’enregistrer.

Téléverser votre logo

Jonot affiche l’image entière sans ajouter ni supprimer d’espace autour. Ajoutez les marges voulues au fichier avant de le téléverser.

Fond transparent. Un logo sur un fond uni affichera ce fond comme une boîte sur chaque surface.
Utilisez un logo horizontal ou carré. Ces formes s’adaptent bien au pied de page et à la zone principale de l’écran. Un logo très haut devient petit, car il doit tenir dans la largeur disponible.
Format : PNG, JPEG, ou WebP. Les téléversements SVG sont rejetés.
Taille : 1 Mo maximum.
Résolution : au moins 400 × 160 px (ou le rapport d’aspect équivalent pour une marque carrée) afin que le logo reste net aux tailles plus grandes que permet le contrôle Taille du logo.

Après le téléversement, utilisez le réglage Taille du logo (0,8–1,6×, par défaut 1.0) pour ajuster sa taille. L’aperçu se met à jour immédiatement.

Comment les changements se propagent

Les changements enregistrés apparaissent sur chaque écran et borne appairés, ainsi que sur chaque page de ticket client ouverte pour votre organisation. Vous n’avez pas besoin de vider un cache, de mettre à jour une application ni de recharger une page de ticket déjà ouverte.

Portée à l’échelle de l’organisation

L’image de marque est définie au niveau de l’organisation et s’applique à chaque établissement. Vous ne pouvez pas définir une identité différente pour chaque établissement.

Guides associés

Personnaliser l’écran — surcharges de texte de l’écran et flash d’appel.
Sons de notification — la couleur du flash d’appel se trouve dans la même page de paramètres Image de marque.