Эта страница переведена с помощью Cloud Translation API.

Ваш первый эксперимент с обменом сообщениями внутри приложения

1. Введение

Цели

В этой кодовой лаборатории вы проведете эксперимент по обмену сообщениями в приложении для многоплатформенного мобильного приложения для рекомендаций ресторанов на базе Flutter и Cloud Firestore .

После завершения вы сможете разрабатывать и реализовывать эксперименты с обменом сообщениями внутри приложения, чтобы эффективно повысить вовлеченность пользователей в любом приложении для iOS или Android, написав при этом минимальное количество кода.

Что вы узнаете

Как использовать обмен сообщениями внутри приложений Firebase (FIAM) в приложении Flutter
Как настроить внешний вид сообщений в приложении
Как разработать эксперимент по обмену сообщениями в приложении и реализовать его в своем приложении
Как интерпретировать результаты эксперимента по обмену сообщениями в приложении

Что бы вы хотели узнать из этой кодовой лаборатории?

Я новичок в этой теме, и мне нужен хороший обзор.

Я кое-что знаю по этой теме, но хочу освежить знания.

Я ищу пример кода для использования в моем проекте.

Я ищу объяснение чего-то конкретного.

Обмен сообщениями Firebase внутри приложения

Firebase In-App Messaging (FIAM) помогает вам привлекать пользователей, которые активно используют ваше приложение, отправляя им целевые и контекстуальные сообщения, которые подталкивают их к выполнению ключевых действий в приложении, таких как прохождение игрового уровня, покупка предмета или подписка на контент. .

A/B-тестирование Firebase

Программа Firebase A/B Testing (ABT) на базе Google Optimize помогает оптимизировать работу вашего приложения, упрощая запуск, анализ и масштабирование продуктовых и маркетинговых экспериментов. Это дает вам возможность протестировать изменения в пользовательском интерфейсе, функциях или кампаниях по вовлечению вашего приложения, чтобы увидеть, действительно ли они меняют ваши ключевые показатели (такие как доход и удержание), прежде чем вы их широко развернете.

Что вам нужно

Если вы не очень хорошо знакомы с Flutter или Firestore, сначала пройдите лабораторную работу по написанию кода Firebase для Flutter :

Вы можете запустить эту лабораторию кода, используя любое из следующих устройств:

Физическое устройство (Android или iOS), подключенное к вашему компьютеру и переведенное в режим разработчика.
Симулятор iOS. (Требуется установка инструментов Xcode ).
Эмулятор Андроид. (Требуется настройка в Android Studio ).

Помимо вышеперечисленного, вам также понадобится:

Браузер по вашему выбору, например Chrome.
IDE или текстовый редактор по вашему выбору, например Android Studio или VS Code, настроенный с помощью плагинов Dart и Flutter. VS Code рекомендуется использовать с Flutter.
Последняя стабильная версия Flutter (или бета-версия, если вам нравится жить на грани).
Учетная запись Google, например учетная запись Gmail, для создания проекта Firebase и управления им.
Пример кода Codelab. См. следующий шаг, чтобы узнать, как получить код.

2. Настройте

Получить код

Клонируйте репозиторий GitHub из командной строки:

git clone https://github.com/FirebaseExtended/codelab-friendlyeats-flutter.git friendlyeats-flutter

Пример кода будет клонирован в каталог friendlyeats-flutter . С этого момента убедитесь, что вы запускаете команды из этого каталога:

cd friendlyeats-flutter

Затем перейдите в каталог codelab и проверьте ветку fiam-abt :

git checkout fiam-abt

Эта ветка содержит весь код, необходимый для этой лаборатории кода, включая завершенную версию в папке done . Другие ветки в этом репозитории содержат код для создания приложения FriendlyEats, как показано в кодовой лаборатории Multi-platform Firestore Flutter . Для целей этой лаборатории мы удалили веб-интеграцию из этой ветки.

Импортируйте начальное приложение

Откройте или импортируйте каталог codelab-fiam-abt в предпочитаемую вами среду IDE. Этот каталог содержит начальный код для лаборатории кода, которая состоит из приложения для рекомендаций ресторанов. С помощью этой кодовой лаборатории вы проведете эксперимент по обмену сообщениями внутри приложения для пользователей этого приложения.

Создать проект Firebase

В консоли Firebase нажмите «Добавить проект » и назовите проект Firebase FriendlyEats . Запомните идентификатор вашего проекта Firebase (или щелкните значок «Изменить», чтобы установить предпочтительный идентификатор проекта).
Убедитесь, что Google Analytics включен для проекта, затем нажмите «Продолжить».
Нажмите Создать проект .

Поздравляем! Вы только что создали свой первый проект Firebase. Теперь вы можете нажать на имя проекта, чтобы войти в консоль.

Далее вы выполните настройку и включение необходимых служб с помощью консоли Firebase.

Включить анонимную аутентификацию

Хотя аутентификация не является целью этой лаборатории, важно иметь ту или иную форму аутентификации в вашем приложении. Вы будете использовать анонимный вход — это означает, что пользователь входит в систему автоматически, без соответствующего запроса.

Чтобы включить анонимный вход:

В консоли Firebase найдите «Аутентификация» на левой панели навигации.
Нажмите «Аутентификация» , затем нажмите «Начать» и выберите вкладку «Метод входа» (или перейдите непосредственно в консоль Firebase ).
Включите поставщика анонимного входа и нажмите «Сохранить» .

плата6c3ebdf904459.png

Включение анонимного входа позволяет приложению автоматически входить в систему ваших пользователей, когда они получают доступ к приложению. Дополнительные сведения см. в документации по анонимной аутентификации для Android и iOS .

Настройте Cloud Firestore

Приложение использует Cloud Firestore для сохранения и получения информации и рейтингов ресторанов.

Вот как настроить Cloud Firestore в вашем проекте Firebase:

На левой панели консоли Firebase разверните «Сборка» и выберите «База данных Firestore» .
Нажмите Создать базу данных .
Оставьте для идентификатора базы данных значение (default) .
Выберите местоположение для вашей базы данных, затем нажмите «Далее» .
Для реального приложения вам нужно выбрать местоположение, наиболее близкое к вашим пользователям.
Нажмите «Запустить в тестовом режиме» . Прочтите отказ от ответственности о правилах безопасности.
Позже в этой лабораторной работе вы добавите правила безопасности для защиты ваших данных. Не распространяйте и не публикуйте приложение без добавления правил безопасности для вашей базы данных.
Нажмите Создать .

3. Конфигурация Firebase для мобильных устройств

Большинство изменений кода, необходимых для включения поддержки Firebase, уже внесены в проект, над которым вы работаете. Однако, чтобы добавить поддержку мобильных платформ, вам необходимо:

Зарегистрируйте нужную платформу в проекте Firebase.
Загрузите файл конфигурации для конкретной платформы и добавьте его в код.

В каталоге верхнего уровня вашего приложения Flutter есть подкаталоги ios и android . В этих каталогах хранятся файлы конфигурации для конкретных платформ iOS и Android соответственно.

Настройка iOS

В консоли Firebase выберите «Настройки проекта» в верхней части левой панели навигации и нажмите кнопку iOS в разделе «Ваши приложения» на странице «Общие» .

Вы должны увидеть следующий диалог:

Важным значением, которое необходимо указать, является идентификатор пакета iOS. Вы получите идентификатор пакета, выполнив следующие три шага.

В инструменте командной строки перейдите в каталог верхнего уровня вашего приложения Flutter.
Запустите команду open ios/Runner.xcworkspace , чтобы открыть Xcode.

В Xcode щелкните Runner верхнего уровня на левой панели, чтобы отобразить вкладку «Общие» на правой панели, как показано. Скопируйте значение идентификатора пакета .

Вернитесь в диалоговое окно Firebase, вставьте скопированный идентификатор пакета в поле идентификатора пакета iOS и нажмите «Зарегистрировать приложение» .

Продолжая работать с Firebase, следуйте инструкциям, чтобы загрузить файл конфигурации GoogleService-Info.plist .
Вернитесь в Xcode. Обратите внимание, что в Runner есть подпапка, также называемая Runner (показана на предыдущем изображении).
Перетащите файл GoogleService-Info.plist (который вы только что скачали) в эту подпапку Runner .
В диалоговом окне, которое появляется в Xcode, нажмите «Готово» .
Вернитесь в консоль Firebase. На этапе настройки нажмите «Далее» , пропустите оставшиеся шаги и вернитесь на главную страницу консоли Firebase.

Вы закончили настройку приложения Flutter для iOS!

Настроить Android

В консоли Firebase выберите «Настройки проекта» в верхней части левой панели навигации и нажмите кнопку Android в разделе «Ваши приложения» на странице «Общие» .

Вы должны увидеть следующий диалог:

Важным значением является имя пакета Android . Вы получите имя пакета, выполнив следующие два шага:

В каталоге приложения Flutter откройте файл android/app/src/main/AndroidManifest.xml .
В элементе manifest найдите строковое значение атрибута package . Это значение представляет собой имя пакета Android (что-то вроде com.yourcompany.yourproject ). Скопируйте это значение.
В диалоговом окне Firebase вставьте скопированное имя пакета в поле имени пакета Android .
Для этой лаборатории кода вам не нужен сертификат подписи отладки SHA-1 . Оставьте это поле пустым.
Нажмите «Зарегистрировать приложение» .
Продолжая работать с Firebase, следуйте инструкциям, чтобы загрузить файл конфигурации google-services.json .
Перейдите в каталог приложения Flutter и переместите файл google-services.json (который вы только что скачали) в каталог android/app .
Вернитесь в консоль Firebase, пропустите оставшиеся шаги и вернитесь на главную страницу консоли Firebase.
Вся конфигурация Gradle уже зарегистрирована. Если ваше приложение все еще работает, закройте и пересоберите его, чтобы позволить gradle устанавливать зависимости.

Вы закончили настройку приложения Flutter для Android!

4. Запустите приложение локально

Вы готовы начать работу над своим приложением! Сначала запустите приложение локально. Теперь вы можете запустить приложение на любой платформе, которую вы настроили (и для которой у вас есть устройство и эмулятор).

Узнайте, какие устройства доступны с помощью следующей команды:

flutter devices

В зависимости от того, какие устройства доступны, вывод предыдущей команды выглядит примерно так:

Теперь запустите приложение локально с помощью следующей команды:

flutter run

Теперь вы должны увидеть свою копию FriendlyEats, подключенную к вашему проекту Firebase.

Приложение автоматически подключается к вашему проекту Firebase и автоматически регистрирует вас как анонимного пользователя.

5. Создайте и протестируйте свое первое сообщение.

Интегрируйте внутриигровые сообщения Firebase в свое приложение

Базовая интеграция обмена сообщениями в приложении полностью не требует кода, все, что вам нужно сделать, это добавить зависимость, и все готово! Добавьте следующую зависимость в файл pubspec.yaml

dependencies:
  # ...
  firebase_in_app_messaging: ^0.4.0
  # ...

Создайте сообщение в консоли Firebase.

Теперь, когда вы добавили FIAM в свое приложение, давайте составим сообщение, которое будет срабатывать при первом открытии вашего приложения.

Чтобы составить первое сообщение:

В разделе «Взаимодействие» консоли Firebase нажмите «Сообщения в приложении» .
Нажмите Создать свою первую кампанию на панели «Сообщения в приложении».

Давайте составим базовое модальное сообщение, чтобы убедиться, что интеграция работает. Не стесняйтесь настраивать сообщение так, как вам хочется: вы можете добавлять изображения, кнопки или менять цвета.

Обязательно выберите приложение, которое вы хотите протестировать. В зависимости от того, какой путь интеграции вы используете, у вас может быть iOS, Android или оба.

Мы хотим обеспечить срабатывание триггера сообщения при открытии приложения, поэтому здесь будет работать конфигурация планирования по умолчанию.

Как только планирование будет завершено, мы сможем опубликовать сообщение. Нажмите «Просмотреть», и вы должны увидеть что-то вроде следующего.

Посмотреть сообщение в вашем приложении

Теперь удалите и переустановите приложение, и при открытии вы должны увидеть созданное вами сообщение. Поздравляем, вы только что отправили свое первое сообщение в приложении! На следующем этапе вы узнаете, как добавить событие аналитики, чтобы инициировать сообщение внутри приложения на основе действий, которые ваши пользователи совершают в приложении.

6. Интегрируйте Firebase Analytics для расширенного запуска сообщений.

Интегрируйте Firebase Analytics в свое приложение

Чтобы понять, как пользователи взаимодействуют с нашим приложением, и вызвать сообщение внутри приложения в зависимости от их действий, мы теперь добавим событие Analytics, когда пользователь нажимает на ресторан.

Добавьте зависимость Firebase Analytics к Flutter в pubspec.yaml

dependencies:
  # ...
  firebase_analytics: ^1.0.1
  # ...

Импортируйте аналитику в home_page.dart

import 'package:firebase_analytics/firebase_analytics.dart';

Добавьте экземпляр Firebase Analytics в класс HomePage в home_page.dart

class HomePage extends StatefulWidget {
  static const route = '/';
  static FirebaseAnalytics analytics = FirebaseAnalytics();
  HomePage({Key key}) : super(key: key);
  @override
  _HomePageState createState() => _HomePageState();
}

Запустите событие аналитики, когда пользователь нажимает на карточку ресторана в home_page.dart

onRestaurantPressed: (id) async {
  await HomePage.analytics.logEvent(name: 'click_restaurant');
  Navigator.pushNamed(context,
                      RestaurantPage.route,
                      arguments: RestaurantPageArguments(id: id));
})

Отредактируйте свое сообщение, чтобы оно активировалось по событию аналитики.

Теперь, когда у нас есть событие «click_restaurant», давайте активировать наше сообщение в приложении на основе этого, а не того, когда пользователь открывает приложение.

В консоли Firebase вернитесь к сообщению в приложении и отредактируйте существующую кампанию.

Теперь измените раздел планирования, чтобы вызвать сообщение о новом событии.

Оттуда мы можем опубликовать наши изменения, нажав кнопку «Просмотреть».

Проверьте свой триггер в приложении

На этом этапе вы сможете запустить приложение с помощью

flutter run

И когда вы нажмете на ресторан, вы должны увидеть свое сообщение в приложении.

7. Создайте кампанию FIAM+ABT.

Начните с цели

Наше приложение Friendlyeats уже выглядит великолепно, но чтобы оно было полезным, нам нужно получить несколько отзывов. Они будут получены от пользователей Friendlyeats, поэтому давайте найдем способ побудить пользователей оставлять отзывы.

Сначала давайте определим наше событие конверсии

Поскольку мы хотим видеть, оставляют ли пользователи отзывы о ресторанах, давайте добавим аналитическое событие для измерения этого поведения.

Импортируйте Firebase Analytics, как и раньше, и добавьте экземпляр Analytics в RestaurantPage в restaurant_page.dart

class RestaurantPage extends StatefulWidget {
  static const route = '/restaurant';
  static FirebaseAnalytics analytics = FirebaseAnalytics();
  final String _restaurantId;
  RestaurantPage({Key key, @required String restaurantId})
      : _restaurantId = restaurantId,
        super(key: key);
  @override
  _RestaurantPageState createState() =>
      _RestaurantPageState(restaurantId: _restaurantId);
}

Теперь давайте вызовем событие в _onCreateReviewPressed , когда мы сохраним отзыв в restaurant_page.dart

 if (newReview != null) {
   // Log successful review
   await RestaurantPage.analytics.logEvent(name: 'review_success');
   // Save the review
   return data.addReview(restaurantId: _restaurant.id, review: newReview);
 }

Настройте A/B-тест в консоли Firebase

Теперь, когда мы знаем, как создавать кампании по обмену сообщениями в приложениях, пришло время подумать, какое поведение мы хотели бы поощрять в нашем приложении с помощью этих кампаний. Что касается FriendlyEats, мы бы хотели, чтобы больше людей оставляли отзывы, что сделало бы приложение более полезным! Есть несколько способов стимулировать это с помощью сообщений в приложении. Один из них — простое сообщение в приложении, которое просто сообщает пользователю, что ему следует оставить отзыв о ресторане, чтобы помочь улучшить приложение FriendlyEats. Другой способ — использовать сообщение внутри приложения, чтобы предложить какой-либо стимул за отзыв, например купон или код скидки для данного ресторана.

Оба подхода могут увеличить частоту оставления пользователями отзывов о ресторанах на FriendlyEats, и похоже, что предоставление купона может иметь еще больший эффект в этом случае. Но насколько более вероятно, что предоставление этого купона побудит пользователей написать отзыв? Стоит ли покупать купон вообще? Чтобы определить это, мы проведем эксперимент по обмену сообщениями в приложении! Мы можем использовать A/B-тестирование Firebase, чтобы случайным образом отображать пользователям одно из наших сообщений в приложении и измерять влияние, которое оно оказывает на поведение пользователей, что-то вроде клинического испытания. И что самое приятное, это можно сделать полностью через консоль Firebase, без необходимости кода!

Чтобы составить свой первый эксперимент по обмену сообщениями в приложении:

В разделе «Взаимодействие» консоли Firebase нажмите A/B-тестирование .
Нажмите «Создать эксперимент» и выберите, что вы хотите поэкспериментировать с обменом сообщениями в приложении . Это приведет вас к композитору эксперимента, показанному ниже.

Дайте эксперименту имя и необязательное описание.

На следующем этапе вы будете составлять различные сообщения внутри приложения, которые будете отправлять пользователям в вашем эксперименте. Первое сообщение внутри приложения, которое мы создадим, — это «базовый уровень» или контроль нашего эксперимента. Мы можем сделать это нашим простым сообщением «пожалуйста, сделайте обзор»:

Теперь, когда у нас есть базовый план, мы составим вариант — сообщение внутри приложения, которое предлагает пользователям код купона, чтобы побудить их оставить отзыв. Это не полностью видно на предварительном просмотре ниже, но заголовок сообщения — «Возьмите купон, оставьте отзыв!», а тело сообщения — «В следующий раз, когда вы будете в кафе Burrito, используйте код купона FRIENDLYEATS-15 на сайте Оформите заказ со скидкой 15 % и не забудьте после этого оставить отзыв!". Мы надеемся, что это вдохновит некоторых пользователей посетить Burrito Cafe!

кровать9182080bebb41.png

На следующем шаге мы настроим таргетинг на наше приложение и установим Exposure. Это процент подходящих пользователей (тех, которые удовлетворяют условиям таргетинга/триггера), которые увидят одно из сообщений в эксперименте. Мы можем просто установить это значение на 100% для этого примера, так как мы хотим, чтобы все пользователи видели либо базовый вариант, либо наш вариант купона. Если вы хотите иметь контрольную группу, в которой вообще не будет отображаться никаких сообщений в приложении, вы можете уменьшить этот процент воздействия.

Далее вы определите некоторые цели эксперимента. Это результат эксперимента, который мы хотели бы измерить. Мы установим это как аналитическое событие review_success , которое мы определили в предыдущем разделе, так как мы хотим увидеть, какое влияние наши различные сообщения в приложении оказывают на пользователей, оставляющих отзывы о ресторанах.
Для планирования мы позволим кампании начаться немедленно и установим click_restaurant в качестве условия запуска, чтобы пользователи видели одно из двух сообщений в приложении, когда они нажимают на ресторан.

Теперь осталось просмотреть наш эксперимент и нажать «Начать эксперимент» . Тогда мы можем сидеть сложа руки и ждать, пока поступят данные нашего эксперимента!

Проверьте сбор данных в режиме реального времени

Теперь, когда мы начали наш эксперимент, пользователи FriendlyEats будут случайным образом видеть одно из двух сообщений в приложении, которые мы составили, когда они нажимают на ресторан: либо базовое сообщение, либо вариантное сообщение. Это разделит наших пользователей на две группы в зависимости от того, какое сообщение они увидели. Затем мы можем просмотреть консоль Firebase (опять же в разделе A/B-тестирование), чтобы сравнить данные аналитики в реальном времени из обеих групп. Для поступления данных потребуется некоторое время, так как нам нужно дождаться, пока пользователи действительно увидят сообщения в приложении и начнут действовать соответствующим образом. Вот как могут выглядеть ваши результаты после получения достаточного количества данных:

В этом случае вариант значительно улучшился по сравнению с базовым вариантом, поэтому мы могли выбрать вариант «Развернуть» , который затем распространил бы сообщение внутри приложения с купоном для всех пользователей.

8. Поздравления

Поздравляем, вы успешно создали и провели свой первый эксперимент по обмену сообщениями в приложении. Теперь вы можете провести эксперимент в своем приложении и использовать результаты, чтобы повысить эффективность кампаний по обмену сообщениями внутри приложения.

Что дальше?

Посмотрите некоторые из этих кодовых лабораторий...

Дальнейшее чтение

Мы только что коснулись того, что можно сделать с помощью обмена сообщениями внутри приложений Firebase и A/B-тестирования Firebase. Ознакомьтесь с ними, если хотите узнать больше...

Справочная документация

Создавайте эксперименты с обменом сообщениями внутри приложения с помощью A/B-тестирования