Smart Banners: de la web móvil a la aplicación

De un vistazo: Convierte a los visitantes de tu sitio web en usuarios de la aplicación móvil con los banners inteligentes.

wc2a.jpg

Artículos relacionados: Soluciones de atribución móvil de la web a la aplicación | Integración de la PBA con Smart Banners

banners inteligentes y la PBA?

Banners inteligentes

  • Muéstralos en el sitio web móvil de tu marca para aumentar las tasas de conversión de los usuarios con un alto nivel de intención.
  • Mide la calidad de las instalaciones de aplicaciones procedentes de los visitantes del sitio web móvil.
  • Permite una atribución móvil precisa de la campaña web a la aplicación para TODAS las fuentes de medios, incluidas las SRN.
  • Los Smart Banners pueden atribuir mediante la atribución de clics y el recuento de impresiones:

    • Clics: un usuario hace clic en los Smart Banners y procede a instalarlos.
    • Impresiones: cuando se carga el banner (el usuario ve el banner), envía un evento de recuento de impresiones a AppsFlyer. 

El flujo es el siguiente:

  1. Un usuario hace clic en un anuncio y se lo dirige al sitio web móvil del anunciante.
  2. Aparece un banner inteligente en el sitio web móvil del anunciante.
  3. El usuario hace clic en el Smart Banner y:
    • Si la aplicación no está instalada, se dirige al usuario a la tienda de aplicaciones para que instale la aplicación.
    • Si la aplicación está instalada y se han configurado enlaces universales, enlaces de aplicaciones y/o enlaces URI, la aplicación se inicia directamente.
  4. El usuario llega al contenido in-app, en el contexto de la promoción.
  5. El usuario se atribuye a la fuente de medios que mostró el anuncio original.

Alcance del trabajo

Quién debe participar

Marketer y desarrollador del sitio web

  • El desarrollador del sitio web solo tiene que introducir un fragmento de código en el HTML del sitio web.
  • Para el resto de acciones de configuración, solo se requiere al marketer.

Requisitos previos

  • Una cuenta de AppsFlyer con al menos una aplicación
  • Plantilla de OneLink que contiene las aplicaciones que se van a anunciar mediante Smart Banners
    Smart Banners requiere esto para dirigir a los visitantes de tu web móvil a las páginas correctas de la tienda de aplicaciones en función de los dispositivos que utilicen. 

Tiempo requerido

Aproximadamente 20 minutos.

Resultado

  • Se enviará a los visitantes del sitio web que hagan clic en el botón CTA (llamada a la acción) a la tienda de aplicaciones o página web correcta según los dispositivos.
  • Los usuarios de aplicaciones móviles que hacen clic en el botón CTA (llamada a la acción) pueden obtener un deep link a la aplicación.
  • Se atribuirá a los usuarios por el clic o la instalación a tus fuentes de medios propios.

 Ejemplo

Mark trabaja como marketer para el exitoso servicio de entrega de comida llamado "Feed Me".
Mark quiere convertir a los visitantes del sitio web móvil de Feed Me en usuarios de la aplicación. 

Para ello, Mark utiliza Smart Banners usando sus propios elementos visuales y textos.  

Los Smart Banners funcionan con tecnología OneLink. Cuando los visitantes del sitio web móvil hacen clic en el botón CTA (llamada a la acción), automáticamente los dirige a la tienda de aplicaciones o página de aterrizaje correspondiente, donde es fácil para ellos instalar la aplicación. Cuando los usuarios móviles existentes hacen clic en el botón CTA (llamada a la acción), se inicia la aplicación. 

AppsFlyer atribuye el clic/instalación a la fuente de medios y la campaña definidas por Mark

 ¡Importante!

Usa Smart Banner de AppsFlyer o el smart banner de la aplicación de Safari de iOS, pero no ambos. El uso de ambos puede causar problemas de visualización en tu sitio web móvil y generar discrepancias en la atribución.

Procedimientos

Completa los siguientes procedimientos para configurar un smart banner que:

  • Dirija a los usuarios desde tu sitio móvil, a través de un Smart Banner, a la tienda de aplicaciones o a la página de aplicaciones en función de su dispositivo.
  • Atribuya el clic o la instalación a tu propia fuente de medios mediante OneLink.

1. Configuración del sitio web

Para preparar tu sitio móvil para mostrar Smart Banners

  1. En el panel de control de AppsFlyer, ve a Engagement y enlaces profundos > Smart Banners
  2. Haz clic en Crear el lugar de trabajo del sitio web.

    SB_website_workplace_en-us.png

  3. Introduce un nombre para el lugar de trabajo del sitio web.
  4. Haz clic en Crear.
    Se abre el lugar de trabajo del sitio web. 
  5. Copia el fragmento de código del banner. 
  6. Envía el fragmento de código a tu desarrollador de front-end para que lo implemente en tu sitio web.
    Esta tarea rápida la realiza solo una vez por sitio web el desarrollador de front-end, que ya no interviene durante los siguientes pasos. 
  7. [opcional] Copia la Clave web. (Esta clave ya existe como parte del fragmento de código).
  8. Haz clic en Continuar.

2. Configuración del grupo de banners

Los Grupos de banners contienen uno o más banners. Desde aquí, puedes:

  • Seleccionar la plantilla de OneLink utilizada por el Grupo de banners, que contiene las aplicaciones móviles a las que redirigir a los visitantes de tu sitio web.
  • Configurar un esquema específico de deep linking
  • Definir tus reglas de targeting, programación, comportamiento y detalles de atribución utilizados por todos los banners del Grupo de banners.
  • Configurar qué páginas activan los banners del Grupo de banners cuando se visitan.

Para configurar un Grupo de banners nuevo:

  1. En el panel de control de AppsFlyer, ve a Engagement y enlaces profundos > Smart Banners
  2. En el lado izquierdo, haz clic en Agregar grupo de banners.
  3. Ingresa un nombre único para el nombre del grupo de banners.
    El nombre debe reflejar un tema general común entre los banners que se definan para el grupo de banners (por ejemplo, la aplicación anunciada).
  4. Selecciona la plantilla de OneLink para el Grupo de banners.
  5. [opcional] Configura el esquema URI para el grupo de banners como alternativa para los usuarios de enlaces universales y enlaces de aplicaciones de Android. Esto rara vez es necesario, ya que de forma predeterminada, el valor se toma de la plantilla de OneLink. Configura esto para el grupo de banners solo si necesitas un valor diferente al de la plantilla.
  6. Configura las Fuentes atribuidas para que se atribuyan con las instalaciones nuevas procedentes de este grupo de banners. Usa la siguiente tabla para elegir la mejor opción para el enlace personalizado.

    Opción Cuándo seleccionar Comentarios
    Usar parámetros UTM  Selecciona cuando la mayoría de los visitantes no orgánicos llegan al sitio web móvil desde fuentes con parámetros UTM. 
    • Nombre de la fuente de medios (pid) = UTM_Source 
    • Campaña (c) = UTM_campaign
    • Si UTM_source o UTM_campaign no están, los nombres estáticos se usan como alternativa.
    Usar parámetros del enlace entrante de atribución Selecciona cuando la mayoría de los visitantes no orgánicos llegan al sitio web móvil desde las redes de publicidad por clics que utilizan los enlaces de atribución de AppsFlyer. 
    • Todos los parámetros disponibles del enlace de atribución entrante de AppsFlyer se agregan al enlace del Smart Banner. 
    • Si existe un parámetro tanto en el enlace entrante de atribución de AppsFlyer como en el Smart Banner, el parámetro entrante tiene prioridad en el enlace personalizado final.
    Agregar otro parámetro de atribución  Si lo deseas, agrega datos de atribución adicionales relacionados con el sitio web. Esto permite un análisis granular de cada instalación.  Por ejemplo, para los sitios de comercio electrónico, crea enlaces personalizados idénticos para cada tipo de categoría de producto, que se diferencien por los valores de af_adset (por ejemplo: "af_adset=fruta"). 
    Usar parámetros de atribución predeterminados
    • Selecciona cuando la mayoría de los visitantes del sitio web móvil son orgánicos.
    • Selecciona cuando los visitantes no orgánicos no accedan al sitio web desde redes de publicidad por clics o desde fuentes con parámetros UTM.  
    Importante: La práctica recomendada es seleccionar parámetros de enlaces de atribución entrantes o UTM, ya que los parámetros de atribución predeterminados de Smart Banner se utilizan de todos modos en el enlace personalizado como alternativa si los nombres de la fuente de medios, campaña o canal no están disponibles.
  7. [Recomendado] ConfiguE el parámetro de atribución por defecto Nombre del canal para atribuir todas las instalaciones procedentes del Smart Banner al canal especificado. Esto te permite agregar información de varias fuentes de medios bajo el mismo canal en el reporte de cohortes, el panel de control general, el reporte de retención y más. 
  8. [Opcional] Configura el Comportamiento de desestimación, es decir, el tiempo mínimo permitido entre la desestimación de un banner del grupo por parte del usuario, hasta que el mismo banner se muestre otra vez al usuario. Selecciona una de las siguientes opciones:
    • Por tiempo: 1 hora, 1 día o 1 semana.
    • Próxima sesión: es decir, la sesión que tiene lugar en una pestaña o ventana diferente, después de que el usuario cierre el banner.
    • Nunca: el banner no se muestra de nuevo. 
      Nota
      • Si el usuario borra la caché del navegador o ve el sitio en modo de navegación privada, se perderá la configuración Comportamiento de desestimación.
      • El comportamiento de desestimación se aplica al banner que el usuario desestima; aún se pueden mostrar otros banners del grupo de banners. 
  9. [opcional] Configura la frecuencia máxima
    La frecuencia máxima determina cuántas veces se muestra el banner a un único usuario. Por ejemplo, si la frecuencia máxima está establecida en tres y un usuario visita el sitio cuatro veces, el usuario ve el banner en las primeras 3 visitas, pero no en la cuarta ni en las posteriores. La frecuencia máxima se puede deshabilitar. Selecciona un valor de frecuencia máxima o desactiva la frecuencia máxima.  
  10. [Opcional] Programa la activación del grupo de banners: empezar inmediatamente (por defecto) o configurar una campaña de tiempo limitado.
  11. [Opcional] Configura las Ubicaciones para las que se activa el grupo de banners.
    1. Selecciona En todo el mundo para mostrar este grupo de banners a todos los usuarios. Si es necesario, excluye a los visitantes procedentes de diferentes regiones, países o estados. 
    2. Selecciona la opción Elegir una ubicación específica para mostrar este grupo de banners a los usuarios de una o más ubicaciones específicas.
  12. [Opcional] Configura Mostrar en páginas, es decir, en qué páginas se puede mostrar el grupo de banners a los visitantes:
    • [Por defecto] Mostrar en todas las páginas del sitio web.
      Nota: Te recomendamos que definas al menos un grupo de banners para todas las páginas como alternativa.
    • Mostrar en páginas específicas: Especifica las condiciones de lo que la página o URL debe o no debe contener para mostrar los banners.  
      • Puedes elegir:
        • Página específica: especifica el host o la ruta de la página en la que se mostrará el banner. Las consultas ingresadas no se tendrán en cuenta. Ejemplo: http://www.example.com/path?query
        • URL: especifica la ruta y/o consulta, o la palabra clave en la ruta/consulta de las páginas en las que se mostrará el banner. Ejemplo: http://www.example.com/path?query
      • Se pueden agregar hasta 5 condiciones usando y/o.
      • Si hay un conflicto entre las condiciones, el banner no se mostrará. 
  13. Haz clic en Crear grupo de banners.
  14. [Opcional] Para volver a editar el grupo de banners, pasa el cursos por encima de Targeting y comportamiento y haz clic en Editar.

 Ejemplo

Mark es el marketer de un servicio de entrega de comida llamado "Feed Me". Decide crear una campaña para la venta de ciruelas de la aplicación. Mark decide usar un envío masivo de SMS, así como redes de publicidad y Google para la campaña.

En la preparación de la campaña de SMS, Mark:

  • Agrega parámetros de atribución únicos para usarlos en el enlace de la campaña para dirigir a los usuarios a la página de venta de ciruelas en el sitio móvil de Feed Me. El enlace incluye el parámetro del ID de anunciante (PID), con la URL de la página de venta de ciruelas: http://feedme.com/plums_link?pid=sms&c=plums.
  • Crea un Smart Banner (grupo de banners y banner) con fuentes atribuidas configuradas en Usar parámetros de enlaces de atribución entrantesque se activan para los usuarios que visitan las páginas en la web móvil que contienen "plums_link".

En preparación para la campaña usando una red de publicidad, Mark:

  • Proporciona a la red de publicidad un enlace de atribución único para usarlo en la campaña para dirigir a los usuarios a la página de venta de ciruelas en el sitio móvil Feed Me. El enlace incluye el parámetro URL de redirección (af_r), con la URL a la página de venta de ciruelas: http://feedme.com/plums_link. No se requieren parámetros adicionales
  • Usa el Smart Banner ya creado para la campaña de SMS.

En la preparación de la campaña mediante Google Ads, Mark:

  • Crea un duplicado del Smart Banner (grupo de banners y banner) con Fuentes atribuidas configuradas en Usar parámetros UTMque se activa para los usuarios que visitan páginas en la web móvil que contienen "plums_utm".

Las campañas empiezan a funcionar.

Los usuarios:

  • Ven el anuncio de la venta de ciruelas y hacen clic para acceder al sitio móvil de Feed Me.
  • Los clics de Google Ads y los demás clics llegan a la página de aterrizaje del enlace entrante, y el Smart Banner correspondiente se activa por página.
  • Ven el Smart Banner en el sitio móvil y hacen clic en él. 
  • Llegan a la aplicación Feed Me, la descargan y la instalan. 
  • Al iniciar la aplicación, son dirigidos a la venta de ciruelas.
  • Se atribuyen a las fuentes de medios correctas que los llevaron al sitio móvil de Feed Me.

3. Configuración del banner

Para crear un banner en un grupo de banners:

  1. Haz clic en Crear banner para acceder a la página Editar banners.
  2. Configura el Nombre del banner.
  3. Crea una creatividad de diseño:
    1. Haz clic en Diseñar creatividad para configurar la creatividad del banner.
      Se abre una ventana para elegir una plantilla de banner.

    2. Pasa el cursor por encima de una plantilla creativa y haz clic en Crear para acceder a la página de configuración de Crear creatividad.
    3. Personaliza todos los elementos en la creatividad del Smart Banner. Para hacerlo, selecciona los elementos por nombre o haz clic en ellos en la imagen de vista previa.  
      • Título
      • Párrafo
      • Estrellas de calificación
      • Botón Cerrar
      • Llamada a la acción
      • Logo de la aplicación
      • Fondo
      • Relleno del banner (para ajustar el tamaño del banner)
      • Para las imágenes, usa uno de los siguientes tipos de archivo: jpeg, jpg, png. 
        Nota: El formato webp no es compatible. 
        Las recomendaciones para las imágenes son:
        Tipo de plantilla Tamaño máximo del archivo de imagen DPI Proporción de imagen
        Estándar 300 KB 72 9:4 (horizontal)

        Mejorado

        9:4 (horizontal)
        Promocional 1:1
        Intersticial 9:16 (vertical)
    4. Haz clic en Revisar para revisar la creatividad del banner y probar su apariencia en diferentes dispositivos.
      Nota: Los banners pueden parecer ligeramente diferentes en las campañas activas en comparación con las imágenes de vista previa.
    5. Si se necesitan cambios, haz clic en Volver al editor.
    6. Haz clic en Hecho para volver a la página de configuración del banner.
  4. [Opcional] Agrega parámetros de atribución personalizados. Por ejemplo, ad_adset y af_ad.
    Nota: Los parámetros pid, c y channel no se pueden agregar al nivel banner, ya que pertenecen al nivel de grupo de banners. 
  5. Tras finalizar y guardar la creatividad nueva, el estado del banner pasa a activo. Usa el conmutador de Estado para cambiar entre los estados Activo y Pausado
  6. [Opcional] Para convertir el enlace de atribución de una URL de tipo de adquisición de usuarios en una URL de retargeting, agrega el parámetro personalizado is_retargeting=true.
  7. Haz clic en Guardar todo para guardar tu trabajo o en Guardar todo y cerrar para guardar tu trabajo y cerrar la página de configuración del banner.

4. Pruebas

Una vez que la creatividad está lista, es el momento de probarla antes de ponerla en marcha y activarla para tus usuarios.

Para probar una creatividad de banner inteligente:

Requisito previo: asegúrate de que el fragmento de código del Smart Banner esté integrado en tu sitio web.  

  1. En la página Probar creatividad, ingresa el enlace a tu página web en la que está integrado el SDK de Smart Banner (véase la siguiente pestaña).
  2. Haz clic en Generar.
  3. Copia el enlace generado y envíalo a tu dispositivo de prueba, o escanea el código QR con el dispositivo de prueba. El enlace o QR debe redirigirte a la página web y mostrar un banner con la creatividad.
  4. Haz clic en Editar creatividad para volver a la configuración de la creatividad, o haz clic en Hecho para guardar la creatividad.

Lógica de visualización del grupo de banners

AppsFlyer tiene en cuenta lo siguiente al determinar qué banner inteligente mostrar o si se muestran:

  • ¿Existen reglas (comportamiento de desestimación, frecuencia máxima, ubicaciones, mostrar en las páginas, etc.) configuradas para los grupos de anuncios?
  • ¿El usuario final cumple con las condiciones de las reglas y califica para ver un banner?

Si la respuesta a ambas preguntas es sí, es decir, hay reglas, y el usuario califica para ver un banner, AppsFlyer elige un banner para mostrar como se explica en la siguiente tabla.

Configuración del grupo de banners Qué banners se muestran Ejemplo
Grupo de banners individuales AppsFlyer divide uniformemente la visualización de todos los banners activos en todos tus grupos de banners entre todos los usuarios elegibles. 
  • Ejemplo 1: Hay 1 banner activo. Se muestra a todos los usuarios.
  • Ejemplo 2: Hay 2 banners. El 50 % de los usuarios ve el banner 1 y el otro 50 % ve el banner 2. 
  • Ejemplo 3: Hay 3 banners, 1/3 de los usuarios elegibles ven cada uno de los banners. 
  • Ejemplo 4: No hay banners activos. No se muestra nada.
Varios grupos de banners con reglas idénticas AppsFlyer divide uniformemente la visualización de todos los banners activos en todos tus grupos de banners entre todos los usuarios elegibles. 

Hay 2 grupos de banners (A y B), cada uno con 3 banners (con un total de 6 banners). 1/6 de los usuarios elegibles ven cada uno de los banners. 

Varios grupos de banners con varias reglas AppsFlyer divide uniformemente la visualización de todos los banners activos del grupo de banners con reglas que describen y coinciden más específicamente con los usuarios. Si los grupos de banners son igualmente específicos de diferentes formas, se muestran los banners de todos estos grupos de banners. 
  • Ejemplo 1: Hay 2 grupos de banners, A y B. El grupo de banners A está configurado para mostrarse en todo el mundo, y el grupo de banners B está configurado para mostrarse en Japón. El grupo de banners B es más específico, por lo que solo los banners de ese grupo se muestran a los usuarios de Japón. 
  • Ejemplo 2: Hay 2 grupos de banners, A y B. El grupo de banners A está configurado para mostrarse en todo el mundo, y el grupo de banners B está configurado para mostrarse en todos lados excepto en Ucrania. El grupo de banners B es más específico, por lo que solo los banners de ese grupo se muestran a los usuarios de todo el mundo (excepto a los usuarios de Ucrania). 
  • Ejemplo 3: Hay 2 grupos de banners, A y B. El grupo de banners A está configurado para mostrarse en Japón, y el grupo de banners B está configurado para mostrarse en abril. Ambos grupos de banners son igualmente específicos, pero de diferentes maneras. Por lo tanto, en Japón, en abril, se muestran banners de ambos grupos de banners, ya que ninguno de los dos tiene prioridad sobre el otro. 

Pruebas A/B del rendimiento de banners

Puedes realizar pruebas A/B del rendimiento de banners individuales. Para hacerlo, agrega parámetros de atribución personalizados a las creatividades de tu banner (paso 4 de la configuración del banner) y luego usa esos parámetros para comparar el rendimiento de cada banner.

Se puede agregar cualquier parámetro excepto pidcchannel, ya que pertenecen al nivel del grupo de banners. 

Recomendado: Configura el parámetro af_adset con un valor único en cada creatividad de banner. Luego, usa el reporte agregado de rendimiento en el panel de control general de AppsFlyer para comparar fácilmente el rendimiento, como se muestra en la siguiente imagen.

banner_performance.jpg

Limitaciones

Limitación Observaciones
Tabletas
  • Los banners inteligentes están diseñados para dispositivos móviles y es posible que sus resoluciones no estén optimizadas para tabletas con pantallas grandes.
  • Es posible que los navegadores de las tabletas no se reconozcan como dispositivos móviles.
Parámetros personalizados
  • Los siguientes caracteres especiales no están permitidos en los parámetros personalizados: ;, *, !, @, #, ?, $, ^, :, &, ~, `, =, +, ’, >, <, /
  • Si defines un parámetro utilizando uno de estos caracteres especiales, el parámetro no se guardará.
División de la visualización de banners AppsFlyer divide uniformemente la visualización de banners activos para los usuarios. No es posible seleccionar qué banners específicos mostrar más o menos. Por ejemplo, si hay 2 banners en un grupo, cada uno se muestra al 50 % de los usuarios. No se puede cambiar a una división de 70%-30%. 
Página específica Cuando configuras tu grupo de banners para mostrar banners en una página específica, la regla de banners solo aplica al host/ruta que ingreses. Si no hay una coincidencia perfecta (por ejemplo, si la página de tu sitio tiene cadenas adicionales no incluidas en la configuración de la regla), la regla no aplica.
¿Fue útil este artículo?