Passer au contenu principal
Les Messages In-App de type Bannière (IAMs) vous permettent de guider les utilisateurs sans bloquer l’interface de votre application. Vous affichez des messages courts et contextuels en haut ou en bas de l’écran pendant que les utilisateurs continuent d’interagir avec votre application. Vous utilisez généralement les IAMs de type bannière lorsque les utilisateurs ont besoin d’un contexte supplémentaire à un moment précis, comme la première fois qu’ils atteignent un écran ou qu’ils commencent un flux de travail important.
Les Messages In-App s’affichent uniquement lorsque leurs conditions de déclenchement sont remplies. Vous contrôlez exactement quand une bannière apparaît en définissant des déclencheurs depuis votre application.

​
Quand utiliser les IAMs de type bannière

Utilisez les IAMs de type bannière pour l’intégration lorsque vous souhaitez :
  • Expliquer un écran lorsque l’utilisateur y arrive
  • Guider les utilisateurs à travers des flux à plusieurs étapes
  • Mettre en évidence les actions que les utilisateurs doivent effectuer ensuite
  • Garder l’intégration visible mais non intrusive
Si vous avez besoin d’une visite guidée structurée sur plusieurs écrans, utilisez plutôt un IAM de type carte ou carrousel.

​
Exemple de flux d’intégration

Lorsqu’un utilisateur ouvre votre site ou application pour la première fois, une bannière supérieure l’accueille et l’encourage à explorer. Lorsque l’utilisateur appuie sur un produit pour voir les détails, une bannière inférieure le guide sur ce qu’il doit faire ensuite. Chaque bannière n’apparaît que lorsque l’utilisateur atteint l’écran concerné. Cette approche garantit que les utilisateurs ne voient les conseils que lorsqu’ils sont pertinents.

​
Exemple visuel : Intégration e-commerce

Voici comment les IAMs de type bannière guident les utilisateurs à travers une application e-commerce. Cet exemple utilise deux IAMs distincts, chacun avec une fermeture automatique de 3 secondes. Lorsque la première bannière se ferme, le déclencheur de la deuxième bannière s’active, créant un flux séquentiel fluide :

Bannière de bienvenue initiale

Bannière de bienvenue affichant 'Appuyez sur n'importe quel produit pour en savoir plus et commencer vos achats !'
Lorsque les utilisateurs ouvrent l’application pour la première fois, une bannière inférieure les encourage à explorer les produits.

Bannière de sélection de produit

Bannière produit affichant 'Vous consultez un produit ! Découvrez tous les détails et ajoutez-le à votre panier quand vous êtes prêt.'
Lorsqu’un utilisateur appuie sur un produit, une bannière fournit des conseils pour la vue détaillée du produit.

​
Prérequis

Avant de commencer, assurez-vous d’avoir :
  • Une application OneSignal active
  • Le SDK OneSignal installé dans votre application
  • La capacité de déclencher des événements ou d’appeler des méthodes depuis le code de votre application
  • Le consentement de l’utilisateur accordé pour le SDK OneSignal (requis pour les Messages In-App)

​
Créer un message in-app de type bannière

1

Naviguer vers les Messages In-App

Dans le tableau de bord OneSignal, allez dans Messages → In-App Messages et sélectionnez New In-App Message.
2

Choisir le type de bannière

Sous Message Type, choisissez Top ou Bottom.
3

Concevoir votre contenu

Incluez un titre court qui explique l’objectif de l’écran, un texte d’accompagnement optionnel si nécessaire, et un bouton optionnel pour guider l’action suivante.
4

Configurer les déclencheurs

Ajoutez un ou plusieurs déclencheurs de Message In-App qui définissent quand la bannière doit apparaître. Ajoutez optionnellement des conditions ou des limites pour contrôler la fréquence d’affichage du message.
5

Définir la durée d'affichage

Choisissez entre la fermeture automatique (la bannière disparaît après 3-10 secondes) ou fermable par l’utilisateur (la bannière reste jusqu’à ce que l’utilisateur appuie sur fermer).
6

Activer le message

Enregistrez et activez votre Message In-App de type bannière.
Utilisez les bannières supérieures pour un guidage à haute visibilité et les bannières inférieures pour des invites subtiles qui s’alignent avec les actions principales. Pour l’intégration, utilisez la fermeture automatique pour maintenir le flux en mouvement sans nécessiter d’action de l’utilisateur.
Évitez les longues explications. Les IAMs de type bannière ne sont pas conçus pour une intégration ou des tutoriels détaillés.

​
Déclencher la bannière depuis votre application

Vous déclenchez l’IAM de type bannière lorsque l’utilisateur atteint un écran spécifique ou effectue une action en utilisant les déclencheurs de Message In-App. Les déclencheurs sont des paires clé-valeur que vous définissez depuis le code de votre application. Lorsque les conditions de déclenchement correspondent aux règles d’affichage de l’IAM, la bannière s’affiche. 
// Déclencher lorsque l'utilisateur consulte le tableau de bord
OneSignal.addTrigger('dashboard_viewed', 'true');
Les déclencheurs persistent pendant la session sauf si vous les supprimez ou les mettez à jour. Assurez-vous que chaque déclencheur représente un moment d’intégration clair et intentionnel.

​
Supprimer les déclencheurs lorsqu’ils ne sont plus nécessaires

Pour empêcher les bannières de réapparaître involontairement, supprimez les déclencheurs lorsqu’ils ne sont plus nécessaires : 
// Supprimer le déclencheur après que l'utilisateur a terminé l'intégration
OneSignal.removeTrigger('dashboard_viewed');

​
Enchaîner les messages de bannière (optionnel)

Vous pouvez guider les utilisateurs à travers un flux en créant plusieurs IAMs, chacun avec son propre déclencheur. Configurez chaque bannière pour se fermer automatiquement après 3 secondes afin que la bannière suivante puisse apparaître. Supprimez le déclencheur précédent avant d’ajouter le suivant pour éviter le chevauchement des bannières.
Pour une intégration séquentielle fluide, créez un IAM par étape, configurez chacun pour se fermer automatiquement après 3 secondes, et enchaînez-les en supprimant le déclencheur précédent lors de l’ajout du suivant.

​
Exemple : Flux d’intégration e-commerce

  1. Chargement de la page → Déclencheur iam_welcome → Bannière : ”🎉 Bienvenue ! Explorez nos produits”
  2. L’utilisateur appuie sur un produit → Déclencheur iam_product_view → Bannière : ”👀 Appuyez sur ❤️ pour sauvegarder vos favoris”
  3. L’utilisateur ajoute au panier → Déclencheur iam_add_to_cart → Bannière : ”✅ Excellent choix ! Voir le panier à tout moment”
  4. L’utilisateur consulte le panier → Déclencheur iam_cart_view → Bannière : ”🛒 Vérifiez vos articles ici”
  5. L’utilisateur passe à la caisse → Déclencheur iam_checkout → Bannière : ”🎊 Merci pour votre commande !”
// Passer de l'étape 1 à l'étape 2
OneSignal.removeTrigger('iam_welcome');
OneSignal.addTrigger('iam_product_view', 'true');
Cela crée une intégration progressive sans submerger l’utilisateur.

​
Vérifier la configuration

La bannière n’apparaît que lorsque le déclencheur est activé et ne bloque pas l’interface de l’application.
Si la bannière n’apparaît pas :
  • Confirmez que la clé et la valeur du déclencheur correspondent exactement (sensible à la casse)
  • Vérifiez que l’IAM est Actif dans le tableau de bord
  • Vérifiez les Limites de Fréquence - l’IAM peut être limité en débit
  • Assurez-vous que l’utilisateur respecte les Règles de Ciblage (le cas échéant)
  • Vérifiez les journaux de la console pour les événements de déclencheur OneSignal
  • Vérifiez que le consentement pour les Messages In-App a été accordé (si requis)

​
Prochaines étapes

  • Annoncer de nouvelles fonctionnalités à l’aide des Messages In-App de type bannière
  • Créer une expérience d’intégration complète avec des IAMs de type carte ou carrousel
  • Segmenter les utilisateurs pour afficher différents messages d’intégration en fonction du niveau d’expérience
  • Tester A/B différents messages de bannière pour optimiser l’engagement