AdMob+Firebase 102 Unity: Ajusta el comportamiento de tu app sin actualizarla

1. Introducción

Supongamos que necesitas ajustar los valores de algunos parámetros en tu app después de publicarla en Play Store. Por lo general, debes volver a publicar una versión nueva de tu app y los usuarios también deben actualizarla en sus teléfonos.

En general, la actualización de la app funcionará si quieres confirmar un cambio duradero en ella. Sin embargo, ¿qué sucede si vas a ajustar el valor de algunos parámetros de tu app con frecuencia? ¿O qué sucede si quieres realizar algunos experimentos para encontrar la configuración óptima de la app?

En estos casos, la actualización de la app no funcionaría bien. Esto se debe a que la actualización tarda un tiempo en propagarse por completo a los usuarios. Además, es bastante difícil ejecutar los experimentos en varias versiones de la app.

Además, ¿cómo puedes determinar si el recorrido del usuario de la app funciona según lo previsto? Puedes confiar en los comentarios de los usuarios en Play Console. Sin embargo, es posible que no sea lo suficientemente precisa como para tomar una decisión clara.

Qué aprenderás

  • Cómo crear un embudo en Google Analytics para Firebase
  • Cómo usar Firebase Remote Config
  • Cómo ejecutar Firebase A/B Testing

Requisitos

  • Unity 2018.4.4f1 o una versión posterior
  • Xcode 10 o una versión posterior (para compilar el destino para iOS)
  • Una Cuenta de Google
  • Un dispositivo de prueba con Android 5.0 o versiones posteriores y un cable USB para conectarlo, o un emulador de Android que ejecute un AVD(dispositivo virtual Android) con una imagen del sistema que admita Play Store o las APIs de Google
  • Un dispositivo iOS o un simulador que ejecute iOS 8.0 o versiones posteriores

¿Cómo calificarías tu nivel de experiencia con AdMob?

Principiante Intermedio Avanzado

¿Cómo calificarías tu nivel de experiencia con Firebase?

Principiante Intermedio Avanzado

2. Configura el entorno de desarrollo

Descarga el código

Haz clic en el siguiente botón para descargar todo el código de este codelab:

Descargar código fuente

Descomprime el archivo zip descargado. Esto descomprimirá una carpeta raíz llamada admob-firebase-codelabs-unity-master.

… o clona el repositorio de GitHub desde la línea de comandos.

$ git clone https://github.com/googlecodelabs/admob-firebase-codelabs-unity

El repositorio contiene cuatro carpetas de la siguiente manera:

  • android_studio_folder.png101-base: Código inicial que compilarás en este codelab
  • android_studio_folder.png101-complete_and_102-base: Código completo para este codelab y código inicial para el codelab 102
  • android_studio_folder.png102-complete: Código completo para el codelab 102

Prepara los archivos requeridos

El Awesome Drawing Quiz usa varios códigos de código abierto, que son necesarios para compilar y ejecutar el proyecto.

Abre la terminal y muévete al directorio raíz del repositorio. Luego, ejecuta ./gradlew :prepareThirdPartyFiles (gradlew.bat :prepareThirdPartyFiles en Windows) desde la terminal para copiar los archivos necesarios en el proyecto.

Cómo importar la app de inicio

Inicia Unity y elige "Abrir" en la pantalla de bienvenida. Luego, selecciona el directorio 101-complete_and_102-base del código que descargaste.

Ahora deberías tener el proyecto abierto en Unity.

Agrega el complemento Google Mobile Ads Unity

Para publicar anuncios de AdMob en la app de Unity, debes agregar el complemento de Google Mobile Ads Unity al proyecto.

  1. Descarga el paquete Google Mobile Ads Unity Plugin 3.18.1. (Ten en cuenta que este codelab podría no ser compatible con la otra versión del complemento).
  2. En el proyecto de Unity Awesome Drawing Quiz En el proyecto, ve a Assets > Import Package > Custom Package.
  3. Importa GoogleMobileAds.unitypackage al proyecto que descargaste.

También debes configurar el ID de la aplicación de AdMob. En el editor de Unity, selecciona Assets > Google Mobile Ads > Settings en el menú.

44fc84fe88235c1f.png

Para habilitar AdMob, haz clic en la casilla de verificación Habilitado en la sección Google AdMob. Luego, ingresa el ID de la app de AdMob de la siguiente manera:

  • Android: ca-app-pub-3940256099942544~3048611032
  • iOS: ca-app-pub-3940256099942544~2753522596

a6ad7402d4daf330.png

Agrega archivos de configuración de Firebase al proyecto de Unity

  1. En la pantalla de descripción general del proyecto Awesome Drawing Quiz, haz clic en el ícono de configuración. 9bacb5ada7cbaaf6.png
  2. En la pestaña General, selecciona cada app para Android y iOS para descargar los archivos google-service.json (para Android) y GoogleService-Info.plist (para iOS).
  3. Transfiere ambos archivos de configuración a la carpeta android_studio_folder.pngAssets del proyecto de Unity.

704aa8e97df63c4e.png

Agrega el SDK de Firebase Analytics

  1. Descarga el SDK de Firebase Unity 5.5.0 y descomprímelo en el lugar que prefieras. (omite este paso si ya descargaste el SDK)
  2. Abre el proyecto de Unity Awesome Drawing Quiz y ve a Assets > Import Package > Custom Package.
  3. En el SDK que descomprimiste, importa el SDK de Firebase Analytics (dotnet4/FirebaseAnalytics.unitypackage).
  4. En la ventana Import Unity package, haz clic en Import.

3. Abre el proyecto de Firebase desde la consola.

Antes de continuar con el siguiente paso, abre el proyecto desde Firebase console que creaste en el paso "Configura el proyecto de Firebase" del Codelab de AdMob y Firebase 101.

e0a028059c9e00cb.png

4. Crea un embudo de eventos de la aplicación

Es posible que hayas agregado algunos eventos de la aplicación para hacer un seguimiento de la actividad del usuario dentro de la aplicación. Si lees el informe de cada evento de la aplicación, puedes obtener los detalles asociados al evento, como los recuentos totales, los recuentos promedio por usuario, los datos demográficos, etcétera.

Sin embargo, ¿qué sucede si deseas ver el porcentaje de finalización de una serie de eventos en lugar de enfocarte en un evento específico? En Google Analytics para Firebase, puedes usar el embudo para visualizar y optimizar el porcentaje de respuesta de una serie de eventos de la aplicación.

Crea un embudo

Para crear un embudo, siga estos pasos:

  1. Ve a Firebase console y selecciona el proyecto Awesome Drawing Quiz que creaste anteriormente.
  2. Haz clic en Embudos.
  3. Haga clic en EMBUDO NUEVO.
  4. Ingrese un nombre y una descripción para el embudo.
  5. Seleccione los dos primeros eventos que desea usar como pasos en el embudo.
  6. Para cada paso adicional, haga clic en AGREGAR OTRO EVENTO y seleccione un evento.
  7. Haz clic en CREAR.

Sigue los pasos anteriores para crear los siguientes embudos:

#1 Funnel name: Tasa de éxito del nivel Events: level_start, level_successd3bc78ef61a261d7.png

#2 Nombre del embudo: Tasa de finalización de anuncios recompensados Eventos: ad_reward_prompt, ad_reward_impression, ad_reward45c9542dfa663014.png

Nº 3 Nombre del embudo: Tasa de finalización del juego Eventos: game_start, game_completedab25e8501746d5f.png

Cómo ver el análisis de embudo

Una vez que hayas creado algunos embudos, podrás acceder a ellos en el menú Embudos de Firebase console. Si haces clic en el nombre del embudo en la lista, puedes ver el análisis detallado de cada embudo.

620c0e84587c8ad4.png

Por ejemplo, haz clic en Tasa de éxito del nivel. Se mostrarán los detalles del embudo de la siguiente manera:

c889f9b6ece15847.png

En la captura de pantalla anterior, puedes ver el porcentaje de usuarios que completaron un nivel (activaron el evento level_success) después de comenzar un nivel (activaron el evento level_start). Aquí puedes ver que el 46.2% de los usuarios completaron el nivel.

Una vez que hagas clic en Cantidad de eventos, se mostrarán las métricas basadas en la cantidad de eventos de la siguiente manera:

d044fb7b07e6e0d9.png

Según las métricas de la captura de pantalla anterior, hubo 116 intentos (se activó el evento level_start) y 57 superaciones (se activó el evento level_success) durante el período.

Dado que la tasa de finalización basada en los eventos(49.1%) es ligeramente más alta que la tasa basada en el usuario(46.2%), puedes decir que hay algunas personas que tienen un mejor rendimiento que las demás.

5. Integra Remote Config en la app

Dado que puedes obtener algunas estadísticas sobre tu aplicación en función de los eventos de la aplicación y el embudo, es posible que desees optimizarla. Por lo general, esto incluye un ajuste preciso del valor del parámetro en la aplicación. Para modificar el valor de esos parámetros, deberás actualizar la aplicación para que los cambios se puedan aplicar a los usuarios.

Con Remote Config en Firebase, puedes ajustar esos valores sin una actualización de la app, lo que significa que puedes cambiar el comportamiento de la app sin molestar a los usuarios obligándolos a descargar la actualización.

En este codelab, aprenderás a hacer que el importe de la recompensa (cantidad de letras que se divulgarán después de mirar un anuncio de video recompensado) se pueda ajustar sin actualizar la app con Remote Config.

Agrega el SDK de Firebase Remote Config

  1. Descarga el SDK de Firebase Unity 5.5.0 y descomprímelo en el lugar que prefieras.
  2. Abre el proyecto de Unity Awesome Drawing Quiz y ve a Assets > Import Package > Custom Package.
  3. En el SDK que descomprimiste, importa el SDK de Remote Config (dotnet4/FirebaseRemoteConfig.unitypackage).
  4. En la ventana Import Unity package, haz clic en Import.

Import Firebase.RemoteConfig

Modifica Main.cs para permitirte usar el tipo de Firebase.RemoteConfig sin tener que usar el nombre completo.

Scenes/Main.cs

...

using AwesomeDrawingQuiz.Game;

// TODO: Import Firebase.RemoteConfig (102)
using Firebase.RemoteConfig;

namespace AwesomeDrawingQuiz.Scene {
    ...
}

Inicializa y recupera valores de Remote Config

Modifica el método InitAndFetchRemoteConfig() en Main.cs para inicializar la instancia de Remote Config de la siguiente manera. Ten en cuenta que GameSettings.KEY_REWARD_AMOUNT contiene el nombre del parámetro en Remote Config. (Declararás este campo pronto en este codelab)

Scenes/Main.cs

private Task InitAndFetchRemoteConfig() {
    // TODO: Initialize and Fetch values from the Remote Config (102)
    Dictionary<string, object> defaults = new Dictionary<string, object>();
    defaults.Add(GameSettings.KEY_REWARD_AMOUNT, 1);
    FirebaseRemoteConfig.SetDefaults(defaults);

    if (Debug.isDebugBuild) {
        ConfigSettings config = new ConfigSettings();
        config.IsDeveloperMode = true;
        FirebaseRemoteConfig.Settings = config;
        return FirebaseRemoteConfig.FetchAsync(System.TimeSpan.Zero);
    } else {
        return FirebaseRemoteConfig.FetchAsync();
    }
}

Verás que la instancia de FirebaseRemoteConfig está configurada para recuperar los valores más recientes del servidor en el modo de depuración para ayudar en el proceso de desarrollo. (IsDeveloperMode = true y FetchAsync(System.TimeSpan.Zero))

Activa los valores recuperados de Remote Config

Cuando recuperes correctamente los valores de Remote Config, debes activarlos para que estén disponibles en la app. Modifica el método ActivateRemoteConfigValues() de la siguiente manera.

Scenes/Main.cs

private void ActivateRemoteConfigValues() {
    // TODO: Activate fetched Remote Config values (102)
    FirebaseRemoteConfig.ActivateFetched();
}

Modifica el método Start()

Para que la app recupere y active el valor de Remote Config cuando se inicie, modifica el método Start() en el archivo Main.cs de la siguiente manera.

Scenes/Main.cs

void Start () {
    ...
    Firebase.FirebaseApp.CheckAndFixDependenciesAsync().ContinueWith(task => {
        ...
    }).ContinueWith(task => { 
        // TODO: Call InitAndFetchRemoteConfig() (102)
        InitAndFetchRemoteConfig();
    }).ContinueWith(task => {
        // TODO: Call ActivateRemoteConfigValues() (102)
        ActivateRemoteConfigValues();

        // Enable 'Start a game' button
        UnityMainThreadDispatcher.Instance()
            .Enqueue(() => buttonStartGame.interactable = true);
    });
    #else
    QuizAnalytics.SetScreenName(QuizAnalytics.SCREEN_MAIN);

    // TODO: Call InitAndFetchRemoteConfig() (102)
    InitAndFetchRemoteConfig().ContinueWith(task => {
        // TODO: Call ActivateRemoteConfigValues() (102)
        ActivateRemoteConfigValues();
    });
    #endif
}

Recupera el importe de la recompensa de Remote Config

Modifica la clase GameSettings para recuperar el importe de la recompensa de Remote Config.

Game/GameSettings.cs

// TODO: Import Firebase.RemoteConfig (102)
using Firebase.RemoteConfig;

namespace AwesomeDrawingQuiz.Game {
    public class GameSettings {

        ...
        
        // TODO: Apply reward amount from the Remote Config (102)
        public const string KEY_REWARD_AMOUNT = "reward_amount";

        public static GameSettings Instance {
            get {
                return instance;
            }
        }

        ...

        public int RewardAmount {
            get {
                // TODO: Apply reward amount from the Remote Config (102)
                return (int) FirebaseRemoteConfig.GetValue(KEY_REWARD_AMOUNT).LongValue;
            }
            private set { }
        }
    }
}

Crea un parámetro de Remote Config desde la consola

A continuación, crearás un nuevo parámetro de Remote Config para el importe de la recompensa, de modo que puedas ajustar su valor sobre la marcha.

Para crear un parámetro nuevo, ve a Firebase console y, luego, selecciona el proyecto Awesome Drawing Quiz que creaste anteriormente. Haz clic en el botón Remote Config -> ADD YOUR FIRST PARAMETER.

7f52617141c53726.png

Nombra el parámetro como reward_amount y establece su valor predeterminado en 1. Luego, haz clic en el botón Agregar parámetro.

cbc771fd1685b29c.png

Haz clic en el botón Publicar cambios para que el cambio esté disponible para los usuarios.

d6a6aa4a60e06ee9.png

6. Cómo cambiar el comportamiento de la app con Remote Config

Ahora se puede configurar la cantidad de la recompensa en el Awesome Drawing Quiz en Firebase console sin tener que actualizar el código de la app.

En esta sección, cambiarás el importe de la recompensa de 1 a 2 para que la app revele dos caracteres más como pista después de mirar un anuncio recompensado.

Actualiza el valor predeterminado del parámetro reward_amount

Ve a Firebase console y, luego, selecciona el proyecto Awesome Drawing Quiz que creaste anteriormente. Haz clic en Remote Config y, luego, en reward_amount en la lista. A continuación, cambia el valor predeterminado a 2 y, luego, haz clic en el botón Actualizar.

9a9bd8a26a39bfe3.png

Haz clic en el botón Publicar cambios para que el cambio esté disponible para los usuarios.

d6a6aa4a60e06ee9.png

Verifica el cambio de comportamiento de la app

Para confirmar el cambio de comportamiento de la app, vuelve a ejecutar el proyecto. Una vez que termines de mirar un anuncio recompensado, notarás que la app ahora revela dos letras como recompensa, tal como lo configuramos en la consola de Remote Config.

Antes de mirar un anuncio recompensado

Se revelaron dos letras adicionales como recompensa.

7. Crea el experimento para optimizar el importe de la recompensa

Ahora puedes cambiar el importe de la recompensa sin tener que publicar una actualización de la app. Sin embargo, ¿cómo puedes determinar la cantidad que cambiaste y que es buena para la app?

Con Firebase A/B Testing, puedes ejecutar experimentos para optimizar la experiencia general del usuario de la app sin necesidad de actualizarla ni crear una herramienta independiente para ejecutar y hacer un seguimiento del rendimiento de cada experimento.

Diseña el experimento

Antes de crear un experimento nuevo, debes establecer un objetivo o una meta claros para el experimento. Asegúrate de revisar la siguiente lista de tareas antes de crear un experimento nuevo.

  • Qué: ¿Qué deseas optimizar? (p.ej., dificultad del juego, visibilidad o sincronización del anuncio, etc.)
  • Por qué: ¿Cuál es tu objetivo comercial para ejecutar el experimento? (p.ej., para maximizar los ingresos publicitarios, aumentar la retención, etc.)
  • Quién: ¿Quiénes son los sujetos del experimento? (p. ej., Todos los usuarios, Público de usuarios específicos, etcétera)

En este codelab, crearás un experimento para optimizar el valor del importe de la recompensa y maximizar la participación diaria de los usuarios en el Awesome Drawing Quiz.

Crea el experimento

Abre el proyecto Awesome Drawing Quiz desde Firebase console. Selecciona el menú Pruebas A/B y, luego, haz clic en el botón Crear experimento.

Selecciona Remote Config para crear un experimento de Remote Config.

f38a85328ab54e7e.png

Nombra el experimento como "Cantidad de la recompensa", como se muestra en la siguiente captura de pantalla.

15d552adb61c0b08.png

Configura las opciones de segmentación. En este codelab, segmentarás el 100% de los usuarios del Awesome Drawing Quiz.

61b316741a63050f.png

Dado que el objetivo principal del experimento es encontrar un valor óptimo que maximice la participación diaria de los usuarios, selecciona la métrica Participación diaria de los usuarios como métrica principal para hacer un seguimiento.

694641b57d90ff65.png

Por último, configura el grupo de control y el grupo de variantes para determinar qué grupo tiene un mejor rendimiento. Selecciona reward_amount en el grupo de control y deja su valor sin cambios. En el caso del grupo de variantes, asígnale el nombre "Menos recompensa" y, luego, cambia el valor de reward_amount a 1.

10ed7f5b06858519.png

Con esta configuración, las personas del grupo de "Menos recompensa" recibirán una letra como recompensa, mientras que las personas del grupo de control recibirán dos letras como recompensa. Como resultado, verás cómo la cantidad de recompensa afecta a los usuarios.

Una vez que hagas clic en el botón Revisar, verás un resumen del experimento como el siguiente.

ae6477ce79f6265d.png

Ejecuta el experimento

Haz clic en el botón Iniciar experimento para ejecutarlo. Ten en cuenta que no podrás cambiar la configuración del experimento una vez que comience.

7131bf9b4fa74fa5.png

8. Administra el experimento

Cómo ver el progreso del experimento

Puedes verificar el progreso del experimento en el menú A/B Testing de Firebase console, que se verá como la siguiente captura de pantalla. Ten en cuenta que también puedes ver la cantidad de usuarios que participan en el experimento en los últimos 30 minutos en la tarjeta.

8a7009bdd8871d95.png

Una vez que hagas clic en el experimento de la lista, podrás ver sus detalles. Hasta que el experimento pueda declarar un líder (es decir, la variante con el mejor rendimiento), verás el mensaje "Es demasiado pronto para declarar un líder".

a4e7ca3e3f4711cd.png

Una vez que el experimento se haya ejecutado durante un tiempo, comenzará a mostrar los datos recopilados hasta el momento en la sección Resumen de la mejora. Puedes comparar el rendimiento de cada variante para ver cuál funciona mejor. En la siguiente captura de pantalla, se muestra un ejemplo de la sección Resumen de mejoras.

e2d00fc27c053fd3.png

En la tabla que se encuentra debajo de la sección Resumen de la mejora, puedes consultar los detalles de las métricas objetivo del experimento, así como las métricas adicionales que se registran en el experimento. En la siguiente captura de pantalla, se muestra un ejemplo de la sección de detalles de las métricas.

c3859d642f85cc52.png

Implementa el líder para todos los usuarios

Después de que el experimento se ejecute por un tiempo suficiente para encontrar una variante líder o ganadora, puedes implementarlo para el 100% de los usuarios. Una vez que A/B Testing encuentre una variante ganadora clara, te recomendará que la implementes para todos los usuarios.

86cb6a6c07516634.png

Sin embargo, incluso si el experimento no declaró una variante ganadora clara, puedes implementar una variante en todos los usuarios.

En la pantalla de detalles del experimento, haz clic en el menú contextual ( 73afe611adf58774.png) y, luego, en Implementar variante.

374e1c72be1d0656.png

Elige una variante para lanzar a todos los usuarios y, luego, haz clic en el botón Revisar en Remote Config para revisar los cambios antes de realizar uno en Remote Config.

e176f6e6a72c754.png

Después de confirmar que el borrador no tiene ningún problema, haz clic en el botón Publicar cambios para que el cambio esté disponible para todos los usuarios.

d65d545620ce93f6.png

9. Todo listo

Completaste el codelab de AdMob y Firebase 102 para Unity. Puedes encontrar el código completo de este codelab en la carpeta android_studio_folder.png102-complete.