Bu sayfa, Cloud Translation API ile çevrilmiştir.

İlk Uygulama İçi Mesajlaşma Denemeniz

1. Giriş

Gol sayısı

Bu codelab'de, Flutter ve Cloud Firestore tarafından desteklenen çok platformlu bir mobil restoran öneri uygulaması için uygulama içi mesajlaşma denemesi oluşturacaksınız.

Bu eğitimi tamamladığınızda, minimum miktarda kod yazarak herhangi bir iOS veya Android uygulamasının kullanıcı etkileşimini etkili bir şekilde artırmak için uygulama içi mesajlaşma denemeleri tasarlayıp uygulayabileceksiniz.

Neler öğreneceksiniz?

Flutter uygulamasında Firebase Uygulama İçi Mesajlaşma (FIAM) nasıl kullanılır?
Uygulama içi mesajlarınızın görünümünü özelleştirme
Uygulama içi mesajlaşma denemesi tasarlama ve uygulamanıza uygulama
Uygulama içi mesajlaşma denemesinin sonuçlarını yorumlama

Bu kod laboratuvarından ne öğrenmek istiyorsunuz?

Konuya yeni başladım ve konuya genel bir bakış istiyorum.

Bu konu hakkında bilgi sahibiyim ancak konuyu tekrar gözden geçirmek istiyorum.

Projemde kullanabileceğim örnek kod arıyorum.

Belirli bir konuyla ilgili açıklama arıyorum.

Firebase Uygulama İçi Mesajlaşma

Firebase Uygulama İçi Mesajlaşma (FIAM), uygulamanızı aktif olarak kullanan kullanıcılara temel uygulama içi işlemleri (ör. bir oyun seviyesini tamamlama, bir öğe satın alma veya içeriğe abone olma) tamamlamaya yönlendirecek hedeflenen ve bağlamsal mesajlar göndererek kullanıcılarla etkileşim kurmanıza yardımcı olur.

Firebase A/B Testi

Google Optimize tarafından desteklenen Firebase A/B Testi (ABT), ürün ve pazarlama denemelerini çalıştırmayı, analiz etmeyi ve ölçeklendirmeyi kolaylaştırarak uygulama deneyiminizi optimize etmenize yardımcı olur. Uygulamanızın kullanıcı arayüzü, özellikleri ve etkileşim kampanyalarındaki değişiklikleri test ederek bu değişikliklerin işe yarayıp yarayamadığını görebilirsiniz.

İhtiyacınız olanlar

Flutter veya Firestore hakkında bilginiz yoksa önce Flutter için Firebase codelab'i tamamlayın:

Bu kod laboratuvarını aşağıdaki cihazlardan herhangi birini kullanarak çalıştırabilirsiniz:

Bilgisayarınıza bağlı ve geliştirici moduna ayarlanmış fiziksel bir cihaz (Android veya iOS).
iOS simülasyon aracı. (Xcode araçlarının yüklenmesi gerekir).
Android emülatörü. (Android Studio'da kurulum gerekir).

Yukarıdakilere ek olarak şunlara da ihtiyacınız vardır:

Chrome gibi tercih ettiğiniz bir tarayıcı.
Dart ve Flutter eklentileriyle yapılandırılmış Android Studio veya VS Code gibi tercih ettiğiniz bir IDE ya da metin düzenleyici. Flutter ile birlikte kullanmak için VS Code önerilir.
Flutter'ın en son kararlı sürümü (veya yenilikleri takip ediyorsanız beta sürümü).
Firebase projenizi oluşturmak ve yönetmek için Gmail hesabı gibi bir Google Hesabı.
Codelab'in örnek kodu. Kodu nasıl alacağınızı öğrenmek için sonraki adıma bakın.

2. Ayarları yapma

Kodu alma

GitHub deposunu komut satırından klonlayın:

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

Örnek kod, friendlyeats-flutter dizinine klonlanır. Bundan sonra komutları şu dizinden çalıştırın:

cd friendlyeats-flutter

Ardından codelab dizinine geçin ve fiam-abt dalına göz atın:

git checkout fiam-abt

Bu dal, done klasöründeki tamamlanmış sürüm de dahil olmak üzere bu codelab için gerekli tüm kodu içerir. Bu depoda bulunan diğer dallar, Çok platformlu Firestore Flutter codelab'de gösterildiği gibi FriendlyEats uygulamasını oluşturmaya yönelik kod içerir. Bu codelab için bu daldaki web entegrasyonunu kaldırdık.

Başlangıç uygulamasını içe aktarma

codelab-fiam-abt dizinini açın veya tercih ettiğiniz IDE'ye aktarın. Bu dizin, bir restoran önerisi uygulamasından oluşan codelab'in başlangıç kodunu içerir. Bu codelab aracılığıyla, bu uygulamanın kullanıcıları için bir uygulama içi mesajlaşma denemesi oluşturacaksınız.

Firebase projesi oluşturma

Firebase konsolunda Proje ekle'yi tıklayın ve Firebase projesini FriendlyEats olarak adlandırın. Firebase projenizin proje kimliğini hatırlayın (veya tercih ettiğiniz proje kimliğini ayarlamak için Düzenle simgesini tıklayın).
Proje için Google Analytics'in etkinleştirildiğinden emin olduktan sonra Devam'ı tıklayın.
Proje oluştur'u tıklayın.

Tebrikler! İlk Firebase projenizi oluşturdunuz. Artık konsola girmek için projenin adını tıklayabilirsiniz.

Ardından, Firebase konsolunu kullanarak gerekli hizmetleri yapılandırma ve etkinleştirme adımlarını uygularsınız.

Anonymous Auth'u etkinleştirme

Bu codelab'in odak noktası kimlik doğrulama olmasa da uygulamanızda bir tür kimlik doğrulama olması önemlidir. Anonim giriş'i kullanacaksınız. Bu, kullanıcının istem gösterilmeden sessizce oturum açtığı anlamına gelir.

Anonim giriş'i etkinleştirmek için:

Firebase konsolunda, sol gezinme çubuğunda Kimlik doğrulama'yı bulun.
Kimlik doğrulama'yı, ardından Başlayın'ı tıklayın ve Oturum açma yöntemi sekmesini seçin (veya doğrudan Firebase konsoluna gidin).
Anonymous oturum açma sağlayıcısını etkinleştirin ve Kaydet'i tıklayın.

Anonim giriş'i etkinleştirmek, uygulamaya erişen kullanıcılarınızın sessizce oturum açmasına olanak tanır. Daha fazla bilgi edinmek için Android ve iOS için anonim kimlik doğrulama belgelerine bakın.

Cloud Firestore'u ayarlama

Uygulama, restoran bilgilerini ve puanlarını kaydetmek ve almak için Cloud Firestore'u kullanır.

Cloud Firestore'u Firebase projenizde ayarlamak için:

Firebase konsolunun sol panelinde Derleme'yi genişletin ve ardından Firestore veritabanı'nı seçin.
Create database'i (Veritabanı oluştur) tıklayın.
Veritabanı Kimliği'ni (default) olarak bırakın.
Veritabanı için bir konum seçip Sonraki'yi tıklayın.
Gerçek bir uygulama için kullanıcılarınıza yakın bir konum seçmeniz gerekir.
Test modunda başlat'ı tıklayın. Güvenlik kurallarıyla ilgili sorumluluk reddi beyanını okuyun.
Bu kod laboratuvarının ilerleyen bölümlerinde, verilerinizin güvenliğini sağlamak için güvenlik kuralları ekleyeceksiniz. Veritabanınıza Güvenlik Kuralları eklemeden bir uygulamayı dağıtmayın veya herkese açık olarak göstermeyin.
Oluştur'u tıklayın.

3. Mobil cihazlara özel Firebase yapılandırması

Firebase desteğini etkinleştirmek için gereken kod değişikliklerinin çoğu, üzerinde çalıştığınız projeye zaten eklenmiştir. Ancak mobil platformlar için destek eklemek istiyorsanız:

İstediğiniz platformu Firebase projesine kaydetme
Platforma özgü yapılandırma dosyasını indirip koda ekleyin.

Flutter uygulamanızın üst düzey dizininde ios ve android adlı alt dizinler vardır. Bu dizinlerde sırasıyla iOS ve Android için platforma özel yapılandırma dosyaları bulunur.

iOS'i yapılandırma

Firebase konsolunda, sol gezinme çubuğunun üst kısmındaki Proje Ayarları'nı seçin ve Genel sayfasındaki Uygulamalarınız bölümündeki iOS düğmesini tıklayın.

Aşağıdaki iletişim kutusunu görürsünüz:

Sağlanması gereken önemli değer iOS paket kimliğidir. Sonraki üç adımı uygulayarak paket kimliğini alırsınız.

Komut satırı aracında, Flutter uygulamanızın üst düzey dizinine gidin.
Xcode'u açmak için open ios/Runner.xcworkspace komutunu çalıştırın.

Xcode'da, sağ bölmede Genel sekmesini göstermek için sol bölmede üst düzey Runner'ı tıklayın. Bundle Identifier (Grup Tanımlayıcısı) değerini kopyalayın.

Firebase iletişim kutusuna geri dönün, kopyalanan paket tanımlayıcıyı iOS paket kimliği alanına yapıştırın ve Uygulamayı kaydet'i tıklayın.

Firebase'de devam ederek yapılandırma dosyasını GoogleService-Info.plist indirme talimatlarını uygulayın.
Xcode'a geri dönün. Runner klasörünün Runner adlı bir alt klasörüne (önceki resimde gösterilmiştir) sahip olduğunu unutmayın.
Az önce indirdiğiniz GoogleService-Info.plist dosyasını bu Runner alt klasörüne sürükleyin.
Xcode'da görünen iletişim kutusunda Bitir'i tıklayın.
Firebase konsoluna geri dönün. Kurulum adımında Sonraki'yi tıklayın, kalan adımları atlayın ve Firebase konsolunun ana sayfasına geri dönün.

Flutter uygulamanızı iOS için yapılandırmayı tamamladınız.

Android'i yapılandırma

Firebase Konsolu'nda, sol gezinme çubuğunun üst kısmındaki Proje Ayarları'nı seçin ve Genel sayfasındaki Uygulamalarınız bölümünde Android düğmesini tıklayın.

Aşağıdaki iletişim kutusunu görürsünüz :

Sağlanması gereken önemli değer Android paket adıdır. Aşağıdaki iki adımı uyguladığınızda paket adını alırsınız:

Flutter uygulama dizininizde android/app/src/main/AndroidManifest.xml dosyasını açın.
manifest öğesinde package özelliğinin dize değerini bulun. Bu değer, Android paket adıdır (com.yourcompany.yourproject gibi). Bu değeri kopyalayın.
Firebase iletişim kutusunda, kopyalanan paket adını Android paket adı alanına yapıştırın.
Bu codelab için Hata ayıklama imza sertifikası SHA-1'e ihtiyacınız yoktur. Bu alanı boş bırakın.
Uygulama Kaydet'i tıklayın.
Firebase'de devam ederek google-services.json yapılandırma dosyasını indirme talimatlarını uygulayın.
Flutter uygulama dizininize gidin ve yeni indirdiğiniz google-services.json dosyasını android/app dizinine taşıyın.
Firebase konsoluna geri dönüp kalan adımları atlayıp Firebase konsolunun ana sayfasına dönün.
Tüm Gradle yapılandırması zaten check in yapılmıştır. Uygulamanız hâlâ çalışıyorsa gradle'in bağımlılıkları yüklemesine izin vermek için uygulamayı kapatıp yeniden oluşturun.

Android için Flutter uygulamanızı yapılandırmayı tamamladınız.

4. Uygulamanızı yerel olarak çalıştırma

Artık uygulamanız üzerinde çalışmaya hazırsınız. Öncelikle uygulamayı yerel olarak çalıştırın. Artık yapılandırdığınız (ve cihaz ve emülatörünüz olan) herhangi bir platformda uygulamayı çalıştırabilirsiniz.

Aşağıdaki komutu kullanarak hangi cihazların kullanılabileceğini öğrenin:

flutter devices

Mevcut cihazlara bağlı olarak, önceki komutun çıkışı şöyle görünür:

Ardından, aşağıdaki komutu kullanarak uygulamayı yerel olarak çalıştırın:

flutter run

Artık FriendlyEats kopyanızı Firebase projenize bağlı olarak görebilirsiniz.

Uygulama, Firebase projenize otomatik olarak bağlanır ve sizi anonim kullanıcı olarak sessizce oturum açar.

5. İlk mesajınızı oluşturun ve test edin

Firebase uygulama içi mesajlaşmayı uygulamanıza entegre etme

In-App Messaging temel entegrasyonu tamamen kodsuzdur. Tek yapmanız gereken bağımlılığı eklemek ve işe koyulmaya hazır olmaktır. pubspec.yaml dosyanıza aşağıdaki bağımlılık ekleyin

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

Firebase Konsolu'nda mesaj oluşturma

FIAM'ı uygulamanıza eklediğinize göre, uygulamanız ilk açıldığında tetiklenecek bir mesaj oluşturalım.

İlk mesajınızı oluşturmak için:

Firebase konsolunun Etkileşim bölümünde Uygulama İçi Mesajlaşma'yı tıklayın.
Uygulama İçi Mesajlaşma bölmesinde İlk kampanyanızı oluşturun'u tıklayın.

Entegrasyonun çalıştığından emin olmak için temel bir modal mesaj oluşturalım. Mesajınızı dilediğiniz şekilde özelleştirebilirsiniz. Resim, düğme ekleyebilir veya renkleri değiştirebilirsiniz.

Test etmek istediğiniz uygulamayı hedeflediğinizden emin olun. Hangi entegrasyon yolunu izlediğinize bağlı olarak iOS, Android veya her ikisi de olabilir.

Mesajın uygulama açıldığında tetiklendiğinden emin olmak istiyoruz. Bu nedenle, varsayılan planlama yapılandırması burada işe yarayacaktır.

Planlama tamamlandığında mesajı yayınlayabiliriz. "İncele"yi tıklayın. Aşağıdakine benzer bir sayfa görürsünüz.

Mesajı uygulamanızda görüntüleme

Şimdi uygulamanızı kaldırıp yeniden yükleyin. Uygulamayı açtığınızda oluşturduğunuz mesajı görürsünüz. Tebrikler, ilk uygulama içi mesajınızı gönderdiniz. Sonraki adımda, kullanıcılarınızın uygulamada gerçekleştirdiği işlemlere göre bir uygulama içi mesajı tetiklemek için nasıl analiz etkinliği ekleyeceğinizi öğreneceksiniz.

6. Gelişmiş mesaj tetikleme için Firebase Analytics'i entegre etme

Firebase Analytics'i uygulamanıza entegre edin.

Kullanıcıların uygulamamızla nasıl etkileşimde bulunduğunu anlamak ve işlemlerine göre bir uygulama içi mesajı tetiklemek için kullanıcı bir restoranı tıkladığında gerçekleşecek bir Analytics etkinliği ekleyeceğiz.

pubspec.yaml sürümünde Flutter'a Firebase Analytics bağımlılığını ekleme

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

Analytics'i home_page.dart'e aktarma

import 'package:firebase_analytics/firebase_analytics.dart';

home_page.dart dosyasında HomePage sınıfına bir Firebase Analytics örneği ekleyin

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

Kullanıcı home_page.dart'te bir restoran kartını tıkladığında bir Analytics etkinliği tetikleme

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

Analytics etkinliğinde tetiklenecek şekilde mesajınızı düzenleme

"click_restaurant" etkinliğimiz olduğuna göre uygulama içi mesajımızı kullanıcı uygulamayı açtığında değil, bu etkinliğe göre tetikleyelim.

Firebase Console'da Uygulama İçi Mesaj'a geri dönün ve mevcut kampanyanızı düzenleyin.

Şimdi planlama bölümünü, mesajı yeni etkinlikten tetikleyecek şekilde değiştirin.

Buradan "incele" düğmesini tıklayarak değişikliklerimizi yayınlayabiliriz.

Tetikleyicinizi uygulamada test etme

Bu aşamada uygulamanızı şu şekilde çalıştırabilirsiniz:

flutter run

Bir restoranı tıkladığınızda uygulama içi mesajınızı görürsünüz.

7. FIAM+ABT kampanyası oluşturma

Hedef belirleme

Friendlyeats uygulamamız şimdiden harika görünüyor ancak yararlı olması için bazı yorumlara ihtiyacımız var. Bu yorumlar, Friendlyeats kullanıcılarından alınacaktır. Bu nedenle, kullanıcıları yorum bırakmaya teşvik etmenin bir yolunu bulalım.

Öncelikle dönüşüm etkinliğimizi tanımlayalım

Kullanıcıların restoranları inceleyip incelemediğini görmek istediğimizden bu davranışı ölçmek için bir analiz etkinliği ekleyelim.

Firebase Analytics'i eskisi gibi içe aktarın ve restaurant_page.dart dosyasında RestaurantPage sınıfına bir Analytics örneği ekleyin.

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);
}

Şimdi restaurant_page.dart'da bir yorum kaydettiğimizde _onCreateReviewPressed'da bir etkinlik tetikleyelim.

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

Firebase Konsolu'nda A/B Testi'ni yapılandırma

Uygulama içi mesajlaşma kampanyalarını nasıl oluşturacağımızı öğrendiğimize göre, bu kampanyalar aracılığıyla uygulamamızda ne tür bir davranışı teşvik etmek istediğimizi düşünmenin zamanı geldi. FriendlyEats'in daha kullanışlı olması için daha fazla kullanıcının yorum bırakmasını isteriz. Uygulama içi mesajlar kullanarak bunu teşvik etmenin birkaç yolu vardır. Bunlardan biri, kullanıcıya FriendlyEats uygulamasının iyileştirilmesine yardımcı olmak için restorana yorum vermesi gerektiğini söyleyen basit bir uygulama içi mesajdır. Diğer bir yöntem ise, yorum göndermek için belirli bir restorana kupon veya indirim kodu gibi bir tür teşvik sunmak üzere uygulama içi mesaj kullanmaktır.

Her iki yaklaşım da kullanıcıların FriendlyEats'ta restoranlar için yorum yapma sıklığını artırabilir. Bu durumda kupon sunmanın daha da güçlü bir etki yaratabileceği anlaşılıyor. Ancak bu kuponu sunmanın, kullanıcıların yorum yazma olasılığını ne kadar artıracağını düşünüyorsunuz? Kuponun maliyeti buna değer mi? Bunu belirlemek için uygulama içi mesajlaşma denemesi yapacağız. Firebase A/B Testi'ni kullanarak uygulama içi mesajlarımızdan birini kullanıcılara rastgele gösterebilir ve bunun kullanıcı davranışı üzerindeki etkisini klinik bir deneme gibi ölçebiliriz. En iyisi de bu işlemin kod kullanmadan tamamen Firebase konsolu üzerinden yapılabilmesidir.

İlk uygulama içi mesajlaşma denemenizi oluşturmak için:

Firebase konsolunun Etkileşime Geçin bölümünde A/B Testi'ni tıklayın.
Deneme oluştur'u tıklayın ve Uygulama İçi Mesajlaşma ile deneme yapmak istediğinizi seçin. Bu işlem sizi aşağıda gösterilen deneme derleyicisine yönlendirir.

Denemenize bir ad ve isteğe bağlı bir açıklama ekleyin.

Sonraki adımda, denemenizdeki kullanıcılara göndereceğiniz farklı uygulama içi mesajları oluşturursunuz. Oluşturacağımız ilk uygulama içi mesaj, "temel çizgi" veya denememiz için kontrol grubudur. Bu mesajı, "lütfen yorum yapın" mesajımız olarak kullanabiliriz:

Referans noktamız olduğu için şimdi bir varyant oluşturacağız. Bu varyant, kullanıcılara yorum bırakmaları için kupon kodu sunan uygulama içi mesajdır. Aşağıdaki önizlemede tam olarak görünmese de mesaj başlığı "Kupon alın, yorum bırakın!", mesaj metni ise "Bir sonraki sefer Burrito Cafe'ye gittiğinizde ödeme sırasında FRIENDLYEATS-15 kupon kodunu kullanarak siparişinizden% 15 indirim alın. Ayrıca, deneyiminizi yorum olarak paylaşmayı unutmayın." Bu sayede bazı kullanıcıların Burrito Cafe'yi ziyaret etmesini umuyoruz.

Bir sonraki adımda uygulamamızı hedefleyecek ve gösterimi ayarlayacağız. Bu, denemedeki mesajlardan birini görecek uygun kullanıcıların (hedefleme/tetikleme koşullarını karşılayan kullanıcılar) yüzdesidir. Tüm kullanıcıların referans değeri veya kupon varyantımızı görmesini istediğimiz için bu örnekte bu değeri% 100 olarak ayarlayabiliriz. Hiçbir uygulama içi mesaj gösterilmeyen bir kontrol grubunuz olsun istiyorsanız bu gösterim yüzdesini azaltabilirsiniz.

Ardından, deneme için bazı hedefler tanımlayacaksınız. Bu, ölçmek istediğimiz denemenin sonucudur. Farklı uygulama içi mesajlarımızın restoran yorumları bırakan kullanıcılar üzerindeki etkisini görmek istediğimizden bunu önceki bölümde tanımladığımız review_success analiz etkinliği olarak ayarlayacağız.
Planlama için kampanyanın hemen başlamasına izin vereceğiz ve click_restaurant'yi tetikleyici koşul olarak ayarlayacağız. Böylece kullanıcılar bir restoranı tıkladıklarında iki uygulama içi mesajdan birini görecekler.

Artık denemeyi incelemek ve Denemeyi başlat'ı tıklamak kaldı. Ardından, arkanıza yaslanıp denememizden elde edilen verilerin gelmesini bekleyebilirsiniz.

Veri toplamayı anlık olarak kontrol etme

Denememizi başlattık. FriendlyEats kullanıcıları, bir restoranı tıkladıklarında oluşturduğumuz iki uygulama içi mesajdan birini rastgele görecekler. Bu mesajlar referans mesajı veya varyant mesajıdır. Bu işlem, kullanıcılarımızı gördükleri mesaja göre iki gruba ayırır. Ardından, her iki gruptaki canlı analiz verilerini karşılaştırmak için Firebase konsoluna (yine A/B Testi bölümünde) bakabiliriz. Kullanıcıların uygulama içi mesajları gerçekten görmesini ve buna göre hareket etmesini beklememiz gerektiğinden verilerin gelmesi biraz zaman alır. Yeterli veri toplandıktan sonra sonuçlarınız aşağıdaki gibi görünebilir:

Bu durumda, varyant temel değere kıyasla önemli ölçüde iyileşme gösterdi. Bu nedenle, Varyantı kullanıma sun'u seçmeyi tercih ettik. Bu işlem, kupon içeren uygulama içi mesajı tüm kullanıcılara sunar.

8. Tebrikler

Tebrikler, ilk uygulama içi mesajlaşma denemenizi başarıyla oluşturdunuz ve çalıştırdınız. Artık kendi uygulamanızda bir deneme çalıştırabilir ve sonuçları uygulama içi mesajlaşma kampanyalarınızı daha etkili hale getirmek için kullanabilirsiniz.

Sırada ne var?

Bu codelab'lerden bazılarına göz atın...

Daha fazla bilgi

Firebase Uygulama İçi Mesajlaşma ve Firebase A/B Testi ile neler yapılabileceğinin sadece bir kısmını ele aldık. Daha fazla bilgi edinmek için şu makalelere göz atın...

Referans dokümanları

A/B Testi ile Uygulama İçi Mesajlaşma Deneyleri Oluşturma