Anúncios nativos

Publicidade nativa é um tipo de anúncio em que o layout pode ser definido na individualidade do aplicativo. Esta funcionalidade permite alterar o estilo visual dos anúncios e seu posicionamento, considerando as especificidades do design do aplicativo.

Os anúncios nativos aprimoram a experiência geral de exibição dos anúncios, permitindo que você mostre mais anúncios sem perder o engajamento dos usuários. A longo prazo, isso lhe permite maximizar as receitas publicitárias.

A renderização de anúncios é realizada com ferramentas nativas da plataforma, o que melhora o desempenho e a qualidade dos anúncios.

Aparência

Este guia mostrará como integrar anúncios nativos em aplicativos iOS. Além de exemplos de código e instruções, contém recomendações específicas aos formatos e links para recursos adicionais.

Pré-requisito

1. Siga os passos de integração do SDK descritos em Início rápido.
2. Primeiro, é preciso inicializar o SDK de publicidade.
3. Certifique-se de estar usando a última versão do Yandex Mobile Ads SDK e, caso esteja usando mediação, a última versão do build unificado.

Implementação

Principais passos para integrar anúncios nativos:

• Crie e configure um NativeAdLoader.
• Carregar o anúncio.
• Passar configurações adicionais se você estiver usando Adfox.
• Renderizar o anúncio carregado.

Especificidades da integração de anúncios nativos

1. Todas as chamadas para métodos do Yandex Mobile Ads SDK devem ser feitas a partir do thread principal.

2. Aconselhamos enfaticamente a não tentar carregar outro anúncio imediatamente após um erro de carregamento. Com completion handlers, isso corresponde ao caso .failure. Com swift concurrency, ao bloco catch. Caso precise tentar de novo, limite o número de tentativas. Isso ajuda a evitar que ocorram infindáveis solicitações sem sucesso quando houver problemas na rede.

3. Recomendamos manter uma referência forte ao anúncio e seu carregador durante todo o ciclo de vida da tela na qual ocorre a interação com o anúncio.

4. O tamanho do contêiner do anúncio deve ser baseado no conteúdo do anúncio.

   Após o anúncio terminar de carregar, você precisa renderizar todos os seus ativos. Você pode obter a lista de ativos de anúncios disponíveis a partir do objeto de publicidade NativeAd.

5. Anúncios com vídeo costumam ter um CTR mais alto e por isso gerar mais receita. Para exibir anúncios em vídeo, o tamanho do contêiner do anúncio e o componente MediaView devem ter pelo menos 300 × 160 dp (píxeis independente de densidade).

6. Recomendamos usar um layout que inclua todos os componentes possíveis. Na prática, esses layouts resultam em taxas de conversão mais altas.

Carregamento de anúncios

Para carregar seus anúncios nativos, crie um objeto NativeAdLoader.

Os parâmetros de solicitação de anúncios são configurados através do objeto da classe AdRequest. Para fazer uma solicitação, é preciso informar a ID do seu bloco de anúncios. Também é possível personalizar a segmentação e outros parâmetros para aumentar a qualidade e relevância dos anúncios. Os parâmetros de carregamento de imagem podem ser informados usando NativeAdOptions. Para saber mais, consulte Segmentação de anúncios.

Para carregar um anúncio, use o método loadAd(with:options:completion:) com um completion handler ou o método loadAd(with:options:) com suporte swift concurrency.

O exemplo a seguir mostra como carregar anúncios nativos a partir do View Controller:

final class CustomNativeViewController: UIViewController {
    private var adLoader: NativeAdLoader?

    override func viewDidLoad() {
        adLoader = NativeAdLoader()
    }

    private func loadNativeAd() async {
        let request = AdRequest(adUnitID: "R-M-XXXXX-YY")
        let options = NativeAdOptions()
        do {
            let ad = try await adLoader?.loadAd(with: request, options: options)
            // Notifica que um anúncio nativo foi carregado
        } catch {
            // Notifica que o anúncio não carregou
        }
    }
}

final class CustomNativeViewController: UIViewController {
    private var adLoader: NativeAdLoader?

    override func viewDidLoad() {
        adLoader = NativeAdLoader()
    }

    private func loadNativeAd() {
        let request = AdRequest(adUnitID: "R-M-XXXXX-YY")
        let options = NativeAdOptions()
        adLoader?.loadAd(with: request, options: options) { [weak self] result in
            switch result {
            case .success(let ad):
                // Notifica que um anúncio nativo foi carregado
                break
            case .failure:
                // Notifica que o anúncio não carregou
                break
            }
        }
    }
}

Renderização de anúncios

Após o anúncio terminar de carregar, você precisa renderizar todos os seus ativos. Você pode obter a lista de ativos de anúncios disponíveis a partir do objeto de publicidade NativeAd.

Configuração manual do layout de anúncios nativos

Este método permite criar um layout personalizado para seus anúncios nativos e definir o posicionamento relativo entre eles. O anúncio pode incluir ativos obrigatórios e opcionais para exibição. Veja a lista completa em Ativos de anúncios nativos.

Para configurar o layout dos seus anúncios nativos manualmente:

1. Crie um view personalizado para a classe NativeAdView.

2. Configure o posicionamento de elementos personalizados responsáveis pela renderização de ativos.

3. Vincule esses elementos personalizados às propriedades NativeAdView correspondentes:

   final class CustomNativeAdView: NativeAdView {
       // ...
   
       init() {
           super.init(frame: CGRect())
           setupUI()
           bindAssets()
       }
   
       private func bindAssets() {
           titleLabel = customTitleLabel
           domainLabel = customDomainLabel
           warningLabel = customWarningLabel
           sponsoredLabel = customSponsoredLabel
           feedbackButton = customFeedbackButton
           callToActionButton = customCallToActionButton
           mediaView = customMediaView
           priceLabel = customPriceLabel
           reviewCountLabel = customReviewCountLabel
           ratingView = customRatingView
           bodyLabel = customBodyLabel
           iconImageView = customIconImageView
       }
   
       private func setupUI() {
       // ...
       }
   }
   

   Observação

   Se você não vincular um elemento personalizado à propriedade NativeAdView para o componente obrigatório, o anúncio não será exibido.

4. Após o anúncio carregar com sucesso, vincule sua view personalizada ao objeto NativeAd para exibi-lo. Para fazer isso, chame o método bind(with adView: YMANativeAdView) para o objeto NativeAd:

   final class NativeCustomViewController: UIViewController, NativeAdDelegate {
       private let adView = NativeCustomAdView()
   
       // ...
   
       private lazy var adLoader: NativeAdLoader = {
           let adLoader = NativeAdLoader()
           return adLoader
       }()
   
       override func viewDidLoad() {
           super.viewDidLoad()
           setupUI()
           loadNativeAd()
       }
   
       private func loadNativeAd() {
           let request = AdRequest(adUnitID: "demo-native-app-yandex")
           let options = NativeAdOptions()
           adLoader.loadAd(with: request, options: options) { [weak self] result in
               if case .success(let ad) = result {
                   self?.bindNativeAd(ad)
               }
           }
       }
   
       private func bindNativeAd(_ ad: NativeAd) {
           ad.delegate = self
           do {
               try ad.bind(with: adView)
           } catch {
               // ...
           }
       }
   
       private func setupUI() {
       // ...
       }
   }
   
   

Carregamento de vários anúncios

O Yandex Mobile Ads SDK oferece a opção de carregar vários anúncios em uma única solicitação (até nove anúncios).

1. Crie uma instância da classe NativeBulkAdLoader para obter anúncios nativos.

2. Crie um AdRequest com a ID do seu bloco de anúncio e utilize NativeAdOptions para configurações adicionais, como parâmetros de imagem.

3. Convoque o método loadAds(with:adsCount:options:completion:) para carregar anúncios.

let request = AdRequest(adUnitID: AdUnitID)
let options = NativeAdOptions()
let adLoader = NativeBulkAdLoader()

do {
    let ads = try await adLoader.loadAds(with: request, adsCount: adsCount, options: options)
    // Manipulando cada objeto NativeAd separadamente
} catch {
    // Erro de carregamento
}

let request = AdRequest(adUnitID: AdUnitID)
let options = NativeAdOptions()
let adLoader = NativeBulkAdLoader()

adLoader.loadAds(with: request, adsCount: adsCount, options: options) { result in
    switch result {
    case .success(let ads):
        // Manipulando cada objeto NativeAd separadamente
        break
    case .failure:
        break
    }
}

Teste da integração de anúncios nativos

Uso de blocos de anúncios de demonstração para teste de anúncios

Use anúncios de teste para verificar sua integração de anúncios nativos e o próprio aplicativo.

Para garantir que anúncios de teste sejam retornados para cada solicitação de anúncio, criamos um ID especial de posicionamento de anúncios de demonstração para ajudar você a testar sua integração de anúncios.

Demonstração de adUnitId para anúncios combinatórios: demo-native-content-yandex.

Demonstração adUnitId para anúncios de aplicativos móveis: demo-native-app-yandex.

Teste da integração de anúncios

Você pode testar sua integração de anúncios usando a ferramenta Console nativa.

Para ver logs detalhados, convoque o método enableLogging da classe YandexAds.

YandexAds.enableLogging()

Para ver os logs do SDK, acesse a ferramenta Console e defina Subsystem = com.mobile.ads.ads.sdk. Você também pode filtrar logs por categoria e nível de erro.

Se você estiver tendo problemas para integrar anúncios, receberá um relatório detalhado sobre os problemas e recomendações de como corrigi-los.

Indicador de integração correta de anúncios nativos

Se houver algum erro na integração de anúncios nativos, o indicador aparecerá por cima do anúncio no modo simulador. Clique no indicador para ver a mensagem de depuração, que deve indicar a causa raiz do problema. Ao clicar novamente no indicador, a mensagem é ocultada.

Para ativar o indicador para dispositivos reais também, passe o valor DeviceTypeHardware | DeviceTypeSimulator no método enableVisibilityErrorIndicatorForDeviceType:.

YandexAds.enableVisibilityErrorIndicator(for: [.hardware, .simulator])

Para desativar o indicador, passe o valor DeviceTypeNone no método enableVisibilityErrorIndicatorForDeviceType:.

YandexAds.enableVisibilityErrorIndicator(for: [])

Recursos adicionais

• Link para GitHub.