Pular para o conteúdo principal
As Mensagens In-App de Banner (IAMs) permitem que você guie os usuários sem bloquear a interface do seu aplicativo. Você exibe mensagens curtas e contextuais no topo ou na parte inferior da tela enquanto os usuários continuam interagindo com seu aplicativo. Você normalmente usa IAMs de banner quando os usuários precisam de contexto extra em um momento específico, como a primeira vez que chegam a uma tela ou iniciam um fluxo de trabalho importante.
As Mensagens In-App são exibidas apenas quando suas condições de gatilho são atendidas. Você controla exatamente quando um banner aparece definindo gatilhos do seu aplicativo.

Quando usar IAMs de banner

Use IAMs de banner para onboarding quando você quiser:
  • Explicar uma tela quando o usuário chega nela
  • Guiar os usuários através de fluxos de várias etapas
  • Destacar ações que os usuários devem tomar em seguida
  • Manter o onboarding visível, mas não intrusivo
Se você precisa de um passo a passo estruturado com várias telas, use um IAM de card ou carrossel em vez disso.

Exemplo de fluxo de onboarding

Quando um usuário abre seu site ou aplicativo pela primeira vez, um banner no topo dá as boas-vindas e incentiva a exploração. Quando o usuário toca em um produto para ver os detalhes, um banner na parte inferior o guia sobre o que fazer em seguida. Cada banner aparece apenas quando o usuário chega à tela relevante. Esta abordagem garante que os usuários vejam orientação apenas quando for relevante.

Exemplo visual: Onboarding de e-commerce

Veja como IAMs de banner guiam os usuários através de um aplicativo de e-commerce. Este exemplo usa dois IAMs separados, cada um com fechamento automático de 3 segundos. Quando o primeiro banner fecha, o gatilho para o segundo banner é ativado, criando um fluxo sequencial suave:

Banner de boas-vindas inicial

Banner de boas-vindas exibindo 'Toque em qualquer produto para saber mais e começar a comprar!'
Quando os usuários abrem o aplicativo pela primeira vez, um banner na parte inferior os incentiva a explorar produtos.

Banner de seleção de produto

Banner de produto exibindo 'Você está visualizando um produto! Confira todos os detalhes e adicione ao carrinho quando estiver pronto.'
Quando um usuário toca em um produto, um banner fornece orientação para a visualização de detalhes do produto.

Pré-requisitos

Antes de começar, certifique-se de ter:
  • Um aplicativo OneSignal ativo
  • SDK OneSignal instalado em seu aplicativo
  • A capacidade de disparar eventos ou chamar métodos do código do seu aplicativo
  • Consentimento do usuário concedido para o SDK OneSignal (necessário para Mensagens In-App)

Criar uma mensagem in-app de banner

1

Navegar para Mensagens In-App

No painel do OneSignal, vá para Messages → In-App Messages e selecione New In-App Message.
2

Escolher tipo de banner

Em Message Type, escolha Top ou Bottom.
3

Projetar seu conteúdo

Inclua um título curto que explique o propósito da tela, texto de suporte opcional se necessário, e um botão opcional para guiar a próxima ação.
4

Configurar gatilhos

Adicione um ou mais gatilhos de Mensagem In-App que definem quando o banner deve aparecer. Opcionalmente, adicione condições ou limites para controlar com que frequência a mensagem é exibida.
5

Definir duração de exibição

Escolha entre fechamento automático (banner desaparece após 3-10 segundos) ou fechável pelo usuário (banner permanece até o usuário tocar em fechar).
6

Ativar a mensagem

Salve e ative sua Mensagem In-App de banner.
Use banners no topo para orientação de alta visibilidade e banners na parte inferior para prompts sutis que se alinham com ações primárias. Para onboarding, use fechamento automático para manter o fluxo em movimento sem exigir ação do usuário.
Evite explicações longas. IAMs de banner não são projetados para onboarding ou tutoriais detalhados.

Disparar o banner do seu aplicativo

Você dispara o IAM de banner quando o usuário chega a uma tela específica ou completa uma ação usando gatilhos de Mensagem In-App. Gatilhos são pares de chave-valor que você define do código do seu aplicativo. Quando as condições do gatilho correspondem às regras de exibição do IAM, o banner é exibido.
// Disparar quando o usuário visualiza o dashboard
OneSignal.addTrigger('dashboard_viewed', 'true');
Os gatilhos persistem durante a sessão, a menos que você os remova ou atualize. Certifique-se de que cada gatilho represente um momento de onboarding claro e intencional.

Remover gatilhos quando não forem mais necessários

Para evitar que banners reapareçam involuntariamente, remova os gatilhos quando não forem mais necessários:
// Remover gatilho após o usuário completar o onboarding
OneSignal.removeTrigger('dashboard_viewed');

Encadear mensagens de banner (opcional)

Você pode guiar os usuários através de um fluxo criando múltiplos IAMs, cada um com seu próprio gatilho. Defina cada banner para fechar automaticamente após 3 segundos para que o próximo banner possa aparecer. Remova o gatilho anterior antes de adicionar o próximo para evitar sobreposição de banners.
Para onboarding sequencial suave, crie um IAM por etapa, defina cada um para fechar automaticamente após 3 segundos, e encadeie-os removendo o gatilho anterior ao adicionar o próximo.

Exemplo: Fluxo de onboarding de e-commerce

  1. Página carrega → Gatilho iam_welcome → Banner: ”🎉 Bem-vindo! Explore nossos produtos”
  2. Usuário toca no produto → Gatilho iam_product_view → Banner: ”👀 Toque em ❤️ para salvar favoritos”
  3. Usuário adiciona ao carrinho → Gatilho iam_add_to_cart → Banner: ”✅ Ótima escolha! Veja o carrinho a qualquer momento”
  4. Usuário visualiza carrinho → Gatilho iam_cart_view → Banner: ”🛒 Revise seus itens aqui”
  5. Usuário finaliza compra → Gatilho iam_checkout → Banner: ”🎊 Obrigado pelo seu pedido!”
// Mover da etapa 1 para a etapa 2
OneSignal.removeTrigger('iam_welcome');
OneSignal.addTrigger('iam_product_view', 'true');
Isso cria onboarding progressivo sem sobrecarregar o usuário.

Verificar a configuração

O banner aparece apenas quando o gatilho é acionado e não bloqueia a interface do aplicativo.
Se o banner não aparecer:
  • Confirme que a chave e o valor do gatilho correspondem exatamente (sensível a maiúsculas/minúsculas)
  • Verifique se o IAM está Ativo no painel
  • Verifique os Limites de Frequência - o IAM pode estar com limite de taxa
  • Certifique-se de que o usuário atende às Regras de Segmentação (se houver)
  • Verifique os logs do console para eventos de gatilho do OneSignal
  • Verifique se o consentimento para Mensagens In-App foi concedido (se necessário)

Próximos passos

  • Anunciar novos recursos usando Mensagens In-App de banner
  • Criar uma experiência de onboarding completa com IAMs de card ou carrossel
  • Segmentar usuários para mostrar diferentes mensagens de onboarding com base no nível de experiência
  • Testar A/B diferentes mensagens de banner para otimizar o engajamento