Uruchamianie kampanii Google Ads z wykorzystaniem zdarzeń niestandardowych Google Analytics i Flutter

1. Wprowadzenie

Ostatnia aktualizacja: 25.01.2021

Co utworzysz

Z tego ćwiczenia w Codelabs dowiesz się, jak wdrażać zdarzenia niestandardowe w GA4F i uruchamiać kampanie zachęcające do działania w aplikacji Google Ads na platformę Flutter.

Użyjemy domyślnej aplikacji Flutter z prostym widżetem licznika. Będziemy reklamować naszą aplikację potencjalnym użytkownikom, którzy prawdopodobnie klikną widżet licznika.

bdbf1fc3cbf49ac7.png

Czego się nauczysz

  • Jak zainicjować GA4F (Google Analytics dla Firebase) w Flutter
  • Tworzenie zdarzeń niestandardowych i ich parametrów
  • Jak importować zdarzenia z Firebase do Google Ads
  • Jak uruchamiać kampanie zachęcające do działania ze zdarzeniami niestandardowymi

Czego potrzebujesz

  • Android Studio 3.6 lub nowszy
  • Xcode (na potrzeby iOS)
  • Konto Firebase
  • Konto Google Ads

2. Rozpocznij nowy projekt Flutter

Utworzenie prostej aplikacji Flutter na podstawie szablonu. Na potrzeby tego ćwiczenia z programowania zmodyfikujesz tę aplikację początkową.

Uruchom Android Studio.

  1. Jeśli nie masz otwartych projektów, kliknij Uruchom nową aplikację Flutter na stronie powitalnej. W przeciwnym razie wybierz Plik > Nowe > Nowy projekt Flutter.
  2. Jako typ projektu wybierz Flutter Application (Aplikacja Flutter) i kliknij Next (Dalej).
  3. Sprawdź, czy ścieżka pakietu SDK Flutter określa lokalizację pakietu SDK. (Jeśli pole tekstowe jest puste, wybierz Zainstaluj SDK).
  4. Wpisz nazwę projektu i kliknij Dalej.
  5. Użyj domyślnej nazwy pakietu sugerowanej przez Android Studio i kliknij Dalej.
  6. Kliknij Zakończ.
  7. Poczekaj, aż Android Studio zainstaluje pakiet SDK i utworzy projekt.

3. Tworzenie i konfigurowanie projektu Firebase

Aby zacząć korzystać z Firebase, musisz utworzyć i skonfigurować projekt Firebase.

Tworzenie projektu Firebase

  1. Zaloguj się w Firebase.

W konsoli Firebase kliknij Dodaj projekt (lub Utwórz projekt) i nadaj projektowi Firebase nazwę Firebase-Flutter-Ads lub inną dowolną nazwę.

e9a8e1b1c7c52125.png

  1. Klikaj opcje tworzenia projektów. Zaakceptuj warunki korzystania z Firebase, jeśli pojawi się taka prośba. Musisz włączyć Google Analytics w tym projekcie, ponieważ potrzebujesz zdarzeń Google Analytics do śledzenia zdarzeń związanych z działaniami i analizowania konwersji.

e58151a081f0628.png

Więcej informacji o projektach Firebase znajdziesz w artykule Omówienie projektów Firebase.

4. Konfiguracja Firebase dla danej platformy (Android)

3e5b8f1b6ca538c4.png

Skonfiguruj Androida

  1. W konsoli Firebase w panelu nawigacyjnym po lewej stronie kliknij Przegląd projektu, a potem w sekcji „Rozpocznij od dodania Firebase do aplikacji” kliknij przycisk Android.

Okno dialogowe pojawi się na następnym ekranie.

3b7d3b33d81fe8ea.png

  1. Najważniejszą wartością jest nazwa pakietu na Androida, którą otrzymasz w następnym kroku.
  1. W katalogu aplikacji Flutter otwórz plik android/app/src/main/AndroidManifest.xml.
  2. W elemencie manifest znajdź wartość w postaci ciągu znaków atrybutu package. Ta wartość to nazwa pakietu na Androida (np. com.yourcompany.yourproject). Skopiuj tę wartość.
  3. W oknie Firebase wklej nazwę skopiowanego pakietu w polu Android package name.
  4. Nie jest nam potrzebny klucz SHA-1, chyba że planujesz użyć logowania przez Google lub linków dynamicznych Firebase (pamiętaj, że nie są one częścią tego ćwiczenia). Jeśli planujesz importować dane in_app_purchase z Google Play, trzeba będzie skonfigurować klucz później.
  5. Kliknij Zarejestruj aplikację.
  6. Przechodząc dalej w Firebase, postępuj zgodnie z instrukcjami, aby pobrać plik konfiguracyjny google-services.json.

52f08aa18c8d59d0.png

  1. Przejdź do katalogu aplikacji Flutter, a następnie przenieś do niego plik google-services.json (właśnie pobrany) do katalogu android/app.
  2. Z powrotem w konsoli Firebase pomiń pozostałe kroki i wróć na stronę główną konsoli Firebase.
  3. Na koniec potrzebujesz wtyczki do Gradle usług Google, aby odczytać plik google-services.json wygenerowany przez Firebase.
  4. W IDE lub edytorze otwórz android/app/build.gradle i dodaj ten wiersz jako ostatni wiersz w pliku:
apply plugin: 'com.google.gms.google-services'
  1. Otwórz android/build.gradle i w tagu buildscript dodaj nową zależność:
buildscript { 
   repositories {
      // ...
   }
   dependencies {
      // ...
      Classpath 'com.google.gms:google-services:4.3.3'
   }
}
  1. Jeśli aplikacja nadal działa, zamknij ją i skompiluj ponownie, aby umożliwić Gradle instalowanie zależności.

Konfiguracja aplikacji Flutter na Androida została zakończona. W przypadku iOS zapoznaj się z tym ćwiczeniem z programowania ( Poznaj Firebase dla Flutter).

5. Konfigurowanie Firebase Analytics w technologii Flutter

W tym kroku zaczniesz używać pakietu Firebase Analytics o nazwie firebase_analytics, który zawiera funkcje Firebase Analytics.

Plik pubspec zarządza zasobami aplikacji Flutter. W programie pubspec.yaml dołącz firebase_analytics: ^6.2.0 (firebase_analytics w wersji 6.2.0 lub nowszej) do listy zależności :

dependencies: 
   flutter: 
      sdk: flutter 
   cupertino_icons: ^0.1.2 
   firebase_analytics: ^6.2.0   # add this line

Podczas wyświetlania specyfikacji wydawcy w widoku edytora Android Studio kliknij Get Packages (Pobierz pakiety). Spowoduje to pobranie pakietu do projektu. W konsoli powinien pojawić się ten komunikat:

flutter packages get 
Running "flutter packages get" in startup_namer... 
Process finished with exit code 0

Wykonanie Pub get powoduje też automatyczne wygenerowanie pliku pubspec.lock z listą wszystkich pakietów pobranych do projektu i numerami ich wersji.

W aplikacji lib/main.dart zaimportuj nowy pakiet:

import 'package:firebase_analytics/firebase_analytics.dart';

W klasie MyApp zainicjuj obiekt FirebaseAnalytics, wywołując konstruktor.

class MyApp extends StatelessWidget {
 static FirebaseAnalytics analytics = FirebaseAnalytics();
   ...
}

Teraz możesz uruchomić logi zdarzeń niestandardowych.

6. Rejestrowanie zdarzeń niestandardowych za pomocą Firebase Analytics

Gdyby wygenerować nowy szablon w aplikacji Flutter, zobaczysz zmienną _counter i metodę _incrementCounter() w domyślnej klasie State. Chcesz rejestrować zdarzenia niestandardowe, gdy przycisk zwiększania liczby zostanie kliknięty więcej niż 5 razy przez zbyt entuzjastycznych użytkowników. Później uruchomimy kampanię promującą aplikację, aby przyciągnąć potencjalnych zainteresowanych użytkowników,

Najpierw chcemy przekazać obiekty analityczne zainicjowane do widżetu Stateful. Zaczynamy od dodania parametru Analytics do konstruktora MyHomePage.

MyHomePage({Key key, this.title, this.analytics}) : super(key: key);

Dodasz też parametr Analytics przy wywołaniu konstruktora.

home: MyHomePage(
   title: 'Flutter Demo Home Page',
   analytics: analytics,
),

Teraz możesz łatwo rejestrować zdarzenia za pomocą metody logEvent(). Dodaj metodę i zwiększ zmienną _counter.

void _incrementCounter() {
 setState(() {
   _counter++;

   //add this
   if(_counter > 5) { 
     widget.analytics.logEvent(name: "clicked_counter"); 
   }

 });
}

Teraz aplikacja może uruchamiać niestandardowy dziennik zdarzeń.

Możesz też użyć gotowych metod uruchamiania zdarzeń.

f0742c956977df1d.png

Teraz wszystko jest gotowe. W Android Studio uruchom plik „main.dart”.

(Opcjonalnie) Wysyłanie dodatkowych informacji do Firebase Analytics za pomocą parametrów

Dodatkowe informacje możesz przesłać za pomocą parametrów. Parametry niestandardowe można rejestrować na potrzeby raportowania w raportach Analytics. Można ich też używać jako filtrów w definicjach list odbiorców, które można stosować w poszczególnych raportach. Jeśli Twoja aplikacja jest połączona z projektem BigQuery, w BigQuery znajdują się też parametry niestandardowe (zobacz BigQuery Export dla Firebase).

Ustawiamy tutaj wartość _counter jako parametr.

void _incrementCounter() {
 setState(() {
   _counter++;

   if(_counter > 5) {
     widget.analytics.logEvent(name: "clicked_counter", parameters: {'count' : _counter});
   }
 });
}

Sprawdzanie i debugowanie zdarzeń

Zapisane zdarzenia pojawią się w konsoli Firebase po kilku godzinach. Wystarczy, że klikniesz kartę Zdarzenia w sekcji Analytics dostępnej w konsoli Firebase. Możesz też sprawdzić wartości w wydarzeniu clicked_counter, klikając je.

32b01a1412ab2ba5.png

Oznacz clicked_counter jako konwersję, przesuwając przełącznik Oznacz jako konwersję w prawo.

e6b420a73db88f03.png

Jeśli zdarzenie znajduje się na karcie Konwersja, oznacza to, że zostało ono oznaczone jako konwersja. Google Ads będzie teraz mógł importować to zdarzenie z Firebase.

Do debugowania użyj Firebase DebugView. Więcej informacji znajdziesz w artykule Zdarzenie debugowania.

7. Importowanie zdarzeń analitycznych do Google Ads

Po zakończeniu konfiguracji Firebase-Flutter możesz uruchomić kampanie promujące aplikacje ze zdarzeniami działania. Zacznij od połączenia Firebase z Google Ads. Dzięki połączeniu Firebase z Google Ads kampanie promujące aplikacje mogą importować zdarzenia Firebase. Ten proces pomaga też Google Ads ulepszać kampanie promujące aplikacje, ponieważ dostarcza więcej informacji o ich odbiorcach.

  1. Otwórz Ustawienia Firebase, klikając przycisk obok Przeglądu projektu.
  2. Na karcie Integracje zobaczysz Google Ads i przycisk Połącz. Kliknij kolejno Połącz i Dalej.

b711bf2e94fa0895.png

  1. Wybierz konto Google Ads.

To już koniec działania Firebase.

Przejdź do Google Ads.

  1. Zaloguj się i wybierz Narzędzia Ustawienia > Pomiary > Konwersje, aby importować zdarzenia niestandardowe jako konwersje.
  2. Aby dodać nowe działania powodujące konwersję, kliknij przycisk +.

73cec8d2e80eab03.png

  1. Wybierz Usługi w Google Analytics 4 (Firebase) i kliknij Dalej.

4b1d8f6a712b2ac6.png

  1. Możesz wyświetlić wszystkie zdarzenia Analytics, które są oznaczone jako konwersje. Znajdź zaimplementowane wcześniej zdarzenie clicked_counter.

ba1bbe6b2924fac8.png

  1. Sprawdź działanie, kliknij Importuj,a następnie kliknij Dalej.

ab35e341dff32e48.png

Po ustawieniu clicked_counter jako działania powodującego konwersję możesz uruchomić kampanie zachęcające do działania kierowane na użytkowników, którzy prawdopodobnie będą uruchamiać zdarzenia clicked_counter więcej niż 5 razy.

8. Uruchomienie kampanii zachęcających do działania w aplikacji z zaimportowanymi zdarzeniami

  1. Przejdź na kartę kampanii bieżącego konta i rozpocznij nową kampanię, klikając przycisk +. Kliknij kolejno [Nowa kampania] i Dalej.
  2. Uruchom kampanię promującą aplikację z opcją Instalacje aplikacji.

af98c44d1476558.png

  1. Znajdź aplikację, wpisując jej nazwę, nazwę pakietu lub wydawcę.
  2. W sekcji Określanie stawek wybierz z menu Działania w aplikacji.
  3. Na wyświetlonej liście odszukaj zdarzenie niestandardowe. Ustaw Docelowy koszt działania i podaj dodatkowe opcje.

885956ad00592eb3.png

  1. Dokończ konfigurowanie ustawień kampanii.

9. Gratulacje

Gratulujemy! Udało Ci się zintegrować Firebase z Google Ads. Pomoże Ci to zwiększyć skuteczność kampanii za pomocą zdarzeń zaimportowanych z Firebase.

Wiesz już

  • Jak skonfigurować Firebase Analytics na potrzeby Flutter
  • Jak rejestrować zdarzenia niestandardowe za pomocą Firebase Analytics w aplikacji Flutter.
  • Jak importować zdarzenia i używać ich w kampaniach zachęcających do działania.