Saltar al contenido principal
Los Mensajes In-App de Banner (IAMs) te permiten guiar a los usuarios sin bloquear la interfaz de tu aplicación. Muestras mensajes cortos y contextuales en la parte superior o inferior de la pantalla mientras los usuarios continúan interactuando con tu aplicación. Normalmente usas IAMs de banner cuando los usuarios necesitan contexto adicional en un momento específico, como la primera vez que llegan a una pantalla o inician un flujo de trabajo clave.
Los Mensajes In-App solo se muestran cuando se cumplen sus condiciones de activación. Controlas exactamente cuándo aparece un banner configurando activadores desde tu aplicación.

Cuándo usar IAMs de banner

Usa IAMs de banner para incorporación cuando quieras:
  • Explicar una pantalla cuando el usuario llega a ella
  • Guiar a los usuarios a través de flujos de múltiples pasos
  • Destacar acciones que los usuarios deben tomar a continuación
  • Mantener la incorporación visible pero no intrusiva
Si necesitas un recorrido estructurado de múltiples pantallas, usa un IAM de tarjeta o carrusel en su lugar.

Ejemplo de flujo de incorporación

Cuando un usuario abre tu sitio o aplicación por primera vez, un banner superior le da la bienvenida y lo invita a explorar. Cuando el usuario toca un producto para ver los detalles, un banner inferior lo guía sobre qué hacer a continuación. Cada banner aparece solo cuando el usuario llega a la pantalla relevante. Este enfoque asegura que los usuarios vean orientación solo cuando es relevante.

Ejemplo visual: Incorporación de e-commerce

Así es como los IAMs de banner guían a los usuarios a través de una aplicación de e-commerce. Este ejemplo usa dos IAMs separados, cada uno con cierre automático de 3 segundos. Cuando el primer banner se cierra, se activa el activador del segundo banner, creando un flujo secuencial fluido:

Banner de bienvenida inicial

Banner de bienvenida mostrando '¡Toca cualquier producto para saber más y comenzar a comprar!'
Cuando los usuarios abren la aplicación por primera vez, un banner inferior los invita a explorar productos.

Banner de selección de producto

Banner de producto mostrando '¡Estás viendo un producto! Revisa todos los detalles y agrégalo al carrito cuando estés listo.'
Cuando un usuario toca un producto, un banner proporciona orientación para la vista de detalles del producto.

Requisitos previos

Antes de comenzar, asegúrate de tener:
  • Una aplicación OneSignal activa
  • SDK de OneSignal instalado en tu aplicación
  • La capacidad de activar eventos o llamar métodos desde el código de tu aplicación
  • Consentimiento del usuario otorgado para el SDK de OneSignal (requerido para Mensajes In-App)

Crear un mensaje in-app de banner

1

Navegar a Mensajes In-App

En el panel de OneSignal, ve a Messages → In-App Messages y selecciona New In-App Message.
2

Elegir tipo de banner

En Message Type, elige Top o Bottom.
3

Diseñar tu contenido

Incluye un título corto que explique el propósito de la pantalla, texto de apoyo opcional si es necesario, y un botón opcional para guiar la siguiente acción.
4

Configurar activadores

Agrega uno o más activadores de Mensaje In-App que definen cuándo debe aparecer el banner. Opcionalmente agrega condiciones o límites para controlar con qué frecuencia se muestra el mensaje.
5

Establecer duración de visualización

Elige entre cierre automático (el banner desaparece después de 3-10 segundos) o cerrable por el usuario (el banner permanece hasta que el usuario toca cerrar).
6

Activar el mensaje

Guarda y activa tu Mensaje In-App de banner.
Usa banners superiores para orientación de alta visibilidad y banners inferiores para indicaciones sutiles que se alinean con acciones primarias. Para incorporación, usa cierre automático para mantener el flujo en movimiento sin requerir acción del usuario.
Evita explicaciones largas. Los IAMs de banner no están diseñados para incorporación o tutoriales detallados.

Activar el banner desde tu aplicación

Activas el IAM de banner cuando el usuario llega a una pantalla específica o completa una acción usando activadores de Mensaje In-App. Los activadores son pares de clave-valor que configuras desde el código de tu aplicación. Cuando las condiciones del activador coinciden con las reglas de visualización del IAM, se muestra el banner.
// Activar cuando el usuario ve el dashboard
OneSignal.addTrigger('dashboard_viewed', 'true');
Los activadores persisten durante la sesión a menos que los elimines o actualices. Asegúrate de que cada activador represente un momento de incorporación claro e intencional.

Eliminar activadores cuando ya no sean necesarios

Para evitar que los banners reaparezcan involuntariamente, elimina los activadores cuando ya no sean necesarios:
// Eliminar activador después de que el usuario complete la incorporación
OneSignal.removeTrigger('dashboard_viewed');

Encadenar mensajes de banner (opcional)

Puedes guiar a los usuarios a través de un flujo creando múltiples IAMs, cada uno con su propio activador. Configura cada banner para cerrarse automáticamente después de 3 segundos para que el siguiente banner pueda aparecer. Elimina el activador anterior antes de agregar el siguiente para evitar superposición de banners.
Para una incorporación secuencial fluida, crea un IAM por paso, configura cada uno para cerrarse automáticamente después de 3 segundos, y encadénalos eliminando el activador anterior al agregar el siguiente.

Ejemplo: Flujo de incorporación de e-commerce

  1. Carga la página → Activador iam_welcome → Banner: ”🎉 ¡Bienvenido! Explora nuestros productos”
  2. Usuario toca producto → Activador iam_product_view → Banner: ”👀 Toca ❤️ para guardar favoritos”
  3. Usuario agrega al carrito → Activador iam_add_to_cart → Banner: ”✅ ¡Gran elección! Ver carrito en cualquier momento”
  4. Usuario ve carrito → Activador iam_cart_view → Banner: ”🛒 Revisa tus artículos aquí”
  5. Usuario finaliza compra → Activador iam_checkout → Banner: ”🎊 ¡Gracias por tu pedido!”
// Moverse del paso 1 al paso 2
OneSignal.removeTrigger('iam_welcome');
OneSignal.addTrigger('iam_product_view', 'true');
Esto crea una incorporación progresiva sin abrumar al usuario.

Verificar la configuración

El banner aparece solo cuando se activa el activador y no bloquea la interfaz de la aplicación.
Si el banner no aparece:
  • Confirma que la clave y el valor del activador coinciden exactamente (sensible a mayúsculas)
  • Verifica que el IAM esté Activo en el panel
  • Revisa los Límites de Frecuencia - el IAM puede estar limitado por tasa
  • Asegúrate de que el usuario cumple las Reglas de Segmentación (si las hay)
  • Revisa los registros de la consola para eventos de activador de OneSignal
  • Verifica que se haya otorgado el consentimiento de Mensajes In-App (si es requerido)

Próximos pasos

  • Anunciar nuevas funcionalidades usando Mensajes In-App de banner
  • Crear una experiencia de incorporación completa con IAMs de tarjeta o carrusel
  • Segmentar usuarios para mostrar diferentes mensajes de incorporación basados en nivel de experiencia
  • Prueba A/B diferentes mensajes de banner para optimizar el engagement