Push com carrossel de imagens no iOS

Mostre várias coisas em um só push

O push com carrossel coloca um conjunto de imagens dentro de uma única notificação iOS e deixa o usuário deslizar por elas. A Pushwoosh fornece a extensão de conteúdo de notificação que o renderiza, e o carrossel sai da mesma campanha, segmento e Jornada que qualquer outro push.

Três iPhones agrupados, cada um mostrando uma notificação push expandida aberta numa galeria de imagens deslizável: produtos de moda no primeiro, destinos de viagem no segundo e personagens de jogo no terceiro

Mais de 80.000 empresas confiam na Pushwoosh para escalar o engajamento

O recurso, por completo

Um push simples carrega uma linha de texto. Um push enriquecido adiciona uma imagem. Um push com carrossel carrega um conjunto de imagens que o usuário de iPhone percorre depois de puxar a notificação para baixo, cada slide com sua própria legenda e seu próprio destino ao toque.

Banner recolhido

Antes de expandir, a notificação parece qualquer outro push: um título, uma linha de texto e no máximo uma miniatura.

Galeria expandida

Um toque longo ou puxar para baixo abre a galeria. O usuário desliza para a esquerda e para a direita por todo o conjunto de imagens.

Legenda por slide

Cada imagem pode ter o próprio texto, então um preço, um tamanho ou uma data de partida acompanha a imagem a que pertence.

Ação de toque por slide

Tocar num slide abre a tela por trás dele, então cada item faz deep link para a própria página, e não para uma tela compartilhada.

Controles de paginação

O app registra uma categoria de notificação cujas ações avançam para o próximo slide e voltam para o anterior, além do gesto de deslizar.

Seu próprio layout

Um view controller no seu app renderiza a galeria, então fonte, cores e espaçamento seguem o seu design, e não um template fixo.

Onde o carrossel fica entre uma imagem e uma página inteira

Quando você temEnvieOnde aparece
Uma linha de textoUm push simplesO banner
Uma imagem ou GIFUm push com rich mediaA notificação expandida
Várias imagens para percorrerUm push com carrossel de imagensA notificação expandida, depois de puxar para baixo
Layout, formulários ou vídeoUma página Rich MediaUma tela cheia no app, aberta ao tocar
Quando você tem
1 / 4
Uma linha de texto
Onde aparece
O banner
Quando você tem
2 / 4
Uma imagem ou GIF
Onde aparece
A notificação expandida
Quando você tem
3 / 4
Várias imagens para percorrer
Envie
Um push com carrossel de imagens
Onde aparece
A notificação expandida, depois de puxar para baixo
Quando você tem
4 / 4
Layout, formulários ou vídeo
Envie
Uma página Rich Media
Onde aparece
Uma tela cheia no app, aberta ao tocar

O trabalho que ele faz, dentro de uma jornada

Uma Jornada, vários formatos

O carrossel é um atributo de uma mensagem que você já envia. A audiência, o gatilho, o segmento e o perfil do cliente continuam onde estão, e o formato muda a aparência da mensagem quando ela chega.

Você cria o carrossel na mesma Jornada do Cliente do seu push, in-app, email e web push. A integração e a audiência são as que você já tem.

Um carrinho abandonado, trabalhado de ponta a ponta

Um cliente adiciona três itens e sai — cena clássica em véspera de Black Friday. Um push silencioso pré-carrega os dados dos produtos em segundo plano, invisível para o usuário, e o push com carrossel vem em seguida com esses três itens, um por slide.

O cliente desliza até o par de tênis, toca e cai na página daquele produto. Se o push não for aberto, a mesma Jornada continua com uma mensagem in-app na próxima abertura e um email no dia seguinte.

Para que usar

O carrossel vale a configuração quando a mensagem tem mais de uma coisa visual a dizer. Para uma única imagem de destaque, um push com rich media faz o mesmo trabalho com uma implementação bem mais leve.

MomentoO que o carrossel levaO que o usuário faz
E-commerce: carrinho abandonadoOs itens que ficaram no carrinho, um por slideDesliza até o que ainda quer e toca para ir à página do produto
Marketplaces: uma busca salva encontra resultadosVários anúncios novos, cada um com seu preçoPercorre os anúncios e abre o que merece uma olhada mais de perto
Delivery de comida: uma janela de promoçãoPratos em alta ou novidades do cardápioPassa pelo conjunto e pede a partir do slide em que parou
Viagens: queda de tarifaVários destinos ou ofertas num só envioDesliza até a viagem que combina e abre a tarifa
Eventos: a programação do fim de semanaVários shows ou artistas, cada um com sua dataEscolhe uma noite e cai na página do ingresso
Jogos mobile: um lançamento de conteúdoNovos personagens, skins e pacotes de ofertasVê o lançamento inteiro antes de abrir a loja
Apps de criadores: reengajamentoNovos templates e pacotes de conteúdo desde a última visitaEncontra algo que vale a volta
Momento
1 / 7
E-commerce: carrinho abandonado
O que o carrossel leva
Os itens que ficaram no carrinho, um por slide
O que o usuário faz
Desliza até o que ainda quer e toca para ir à página do produto
Momento
2 / 7
Marketplaces: uma busca salva encontra resultados
O que o carrossel leva
Vários anúncios novos, cada um com seu preço
O que o usuário faz
Percorre os anúncios e abre o que merece uma olhada mais de perto
Momento
3 / 7
Delivery de comida: uma janela de promoção
O que o carrossel leva
Pratos em alta ou novidades do cardápio
O que o usuário faz
Passa pelo conjunto e pede a partir do slide em que parou
Momento
4 / 7
Viagens: queda de tarifa
O que o carrossel leva
Vários destinos ou ofertas num só envio
O que o usuário faz
Desliza até a viagem que combina e abre a tarifa
Momento
5 / 7
Eventos: a programação do fim de semana
O que o carrossel leva
Vários shows ou artistas, cada um com sua data
O que o usuário faz
Escolhe uma noite e cai na página do ingresso
Momento
6 / 7
Jogos mobile: um lançamento de conteúdo
O que o carrossel leva
Novos personagens, skins e pacotes de ofertas
O que o usuário faz
Vê o lançamento inteiro antes de abrir a loja
Momento
7 / 7
Apps de criadores: reengajamento
O que o carrossel leva
Novos templates e pacotes de conteúdo desde a última visita
O que o usuário faz
Encontra algo que vale a volta
O formato é metade do trabalho. A outra metade é o que você coloca nele

50 notificações push que valem a pena copiar, com o texto e o criativo que fizeram cada uma funcionar.

Veja os exemplos

Cobertura de plataformas e técnica

O suporte a carrossel varia entre sistemas operacionais. A última coluna mostra onde o formato é o próprio push e onde o push só carrega um payload que o seu app renderiza.

RecursoiOSAndroidWebEntregue por
Galeria deslizável com várias imagensiOS 10+––Uma notification content extension no seu app, renderizando o payload do push
Ações de paginação na notificaçãoiOS 10+––Uma categoria de notificação que o app registra ao iniciar
Legenda e ação de toque por slideiOS 10+––O código da sua extensão, lendo o payload
Imagem única na notificação expandidaiOS 10+Android 4.1+, uma imagem grandeChromeO próprio push
Botões de ação na notificaçãoiOS 10+, até 4AndroidChromeO próprio push
Vitrine em tela cheia com layout e formuláriosSimSim–Uma página Rich Media aberta ao tocar
Recurso
1 / 6
Galeria deslizável com várias imagens
iOS
iOS 10+
Android
–
Web
–
Entregue por
Uma notification content extension no seu app, renderizando o payload do push
Recurso
2 / 6
Ações de paginação na notificação
iOS
iOS 10+
Android
–
Web
–
Entregue por
Uma categoria de notificação que o app registra ao iniciar
Recurso
3 / 6
Legenda e ação de toque por slide
iOS
iOS 10+
Android
–
Web
–
Entregue por
O código da sua extensão, lendo o payload
Recurso
4 / 6
Imagem única na notificação expandida
iOS
iOS 10+
Android
Android 4.1+, uma imagem grande
Web
Chrome
Entregue por
O próprio push
Recurso
5 / 6
Botões de ação na notificação
iOS
iOS 10+, até 4
Android
Android
Web
Chrome
Entregue por
O próprio push
Recurso
6 / 6
Vitrine em tela cheia com layout e formulários
iOS
Sim
Android
Sim
Web
–
Entregue por
Uma página Rich Media aberta ao tocar

Segurança e hospedagem

A Pushwoosh roda em hardware próprio nos EUA e na Alemanha, em conformidade com GDPR.

ISO 27001:2022 CertifiedISO 27001 CertifiedGDPR CompliantData Privacy FrameworkHIPAA CompliantSOC 2 Type 2 CertifiedOWASP Compliant

Como funciona

O carrossel é uma implementação de desenvolvedor. O primeiro passo é uma tarefa de engenharia feita uma única vez; depois disso, o marketing cria e agenda o carrossel como qualquer outro push.

  1. Configure a extensão uma vez (desenvolvedor)

    Adicione um target Notification Content Extension ao seu app, inclua o view controller de carrossel de exemplo da Pushwoosh e registre a categoria do carrossel ao iniciar. Ela fica ao lado da service extension que o rich push de imagem única já usa.

  2. Crie a mensagem (sem código ou via API)

    Monte o push no Control Panel ou pela Messages API, anexe as imagens e defina a categoria correspondente. Cada slide é baixado no recebimento, então hospede as imagens numa CDN e mantenha cada uma leve.

  3. Orquestre (sem código)

    Envie para o mesmo segmento, pela mesma Jornada do Cliente que o resto da sua mensageria. Deep links, dados personalizados e personalização funcionam exatamente como num push simples.

Limites que vale conhecer

O formato é específico. Estes são os limites.

  • Só iOS. A notificação expandida do Android mostra uma única imagem grande e não tem equivalente de galeria — vale lembrar num mercado Android-first como o Brasil.
  • Montar um carrossel é trabalho de desenvolvedor. A Pushwoosh fornece o código da extensão e a convenção de payload; o Control Panel cria a mensagem em torno disso.
  • A configuração exige uma notification content extension própria, além da service extension que o rich push já requer.
  • A galeria só aparece depois de um toque longo ou de puxar para baixo. Até lá, o banner mostra uma única linha e no máximo uma miniatura.
  • Cada slide é baixado no recebimento. Mantenha cada imagem leve, hospede tudo numa CDN e envie poucos slides em vez de muitos.
  • O relatório de entrega vê o push, e os deslizes acontecem no dispositivo. Você mede o engajamento por slide com seus próprios eventos no app.

Mostre várias coisas em um só push

Um conjunto de imagens para o usuário percorrer entrega o item que ele realmente queria, e não aquele que você tentou adivinhar. Fale com nosso time sobre push com carrossel, ou comece a construir no plano gratuito.