Membangun aplikasi Google Chat Dialogflow CX yang memahami dan merespons dengan bahasa alami

Halaman ini menjelaskan cara membuat aplikasi Google Chat yang dapat memahami dan merespons dengan bahasa alami menggunakan Dialogflow. Panduan ini menggunakan Dialogflow CX, yang memiliki integrasi langsung dengan Google Chat. Anda juga dapat menggunakan Dialogflow ES untuk membangun aplikasi Google Chat Dialogflow ES dengan mengikuti panduan Google Chat Dialogflow ES.

Misalnya, pertimbangkan aplikasi Chat yang membantu orang menyewa mobil. Pengguna dapat menulis, "Saya ingin menyewa mobil". Aplikasi Chat mungkin merespons dengan pertanyaan seperti "Di mana Anda ingin mengambil kendaraan?" yang memulai percakapan seperti manusia dengan pengguna. Dalam percakapan ini, aplikasi Chat memahami dan merespons dengan ucapan manusia saat memesan penyewaan mobil.

Ini hanyalah salah satu contoh. Aplikasi Chat Dialogflow berguna dalam semua jenis interaksi. Jika memerlukan ucapan manusia yang alami, aplikasi ini memerlukan aplikasi Chat Dialogflow. Agen bawaan membantu Anda memulai dengan cepat, dan menunjukkan kemampuan Dialogflow, seperti:

  • Pesan penerbangan
  • Menjadwalkan janji temu dokter
  • Pesan pengantaran makanan
  • Menjawab pertanyaan tentang katalog produk retail, seperti apakah item tersedia dalam warna lain
  • Halaman pemilihan agen Dialogflow siap pakai.
    Gambar 1. Memilih agen siap pakai untuk aplikasi Chat Dialogflow.
  • Menguji agen di Dialogflow CX.
    Gambar 2. Menguji agen di Dialogflow CX untuk memastikan logika dan konfigurasi agen berfungsi sebagaimana mestinya. Diagram ini menunjukkan serangkaian halaman topik yang berurutan yang berkaitan dengan langkah-langkah tertentu dalam percakapan, seperti menetapkan lokasi pengambilan dan pengembalian untuk mobil sewaan, serta mengonfigurasi logika yang menghubungkannya. Percakapan diuji di simulator.
  • Mengonfigurasi aplikasi Chat Dialogflow.
    Gambar 3. Mengonfigurasi aplikasi Chat untuk memproses respons menggunakan agen Dialogflow CX di halaman konfigurasi Chat API di konsol Google Cloud.
  • Menguji aplikasi Chat Dialogflow CX
    Gambar 4. Melakukan percakapan tentang pemesanan mobil sewaan dengan aplikasi Chat Dialogflow di Google Chat.

Tujuan

  • Siapkan lingkungan Anda.
  • Buat dan deploy agen Dialogflow CX.
  • Buat dan deploy aplikasi Chat yang didukung oleh agen Dialogflow CX.
  • Uji aplikasi Chat.

Prasyarat

Arsitektur

Diagram berikut menunjukkan arsitektur aplikasi Chat yang dibangun dengan Dialogflow:

Arsitektur aplikasi Chat yang diimplementasikan dengan Dialogflow.

Dalam diagram sebelumnya, pengguna yang berinteraksi dengan aplikasi Chat Dialogflow memiliki alur informasi berikut:

  1. Pengguna mengirim pesan di Chat ke aplikasi Chat, baik di pesan langsung maupun di ruang Chat.
  2. Agen virtual Dialogflow, yang berada di Google Cloud, menerima dan memproses pesan untuk menghasilkan respons.
  3. Atau, menggunakan webhook Dialogflow, agen Dialogflow dapat berinteraksi dengan layanan pihak ketiga eksternal, seperti sistem manajemen project atau alat ticketing.
  4. Agen Dialogflow mengirimkan respons kembali ke layanan aplikasi Chat di Chat.
  5. Respons akan dikirim ke ruang Chat.

Menyiapkan lingkungan

Sebelum menggunakan Google API, Anda harus mengaktifkannya di project Google Cloud. Anda dapat mengaktifkan satu atau beberapa API dalam satu project Google Cloud.
  1. Di Konsol Google Cloud, aktifkan Google Chat API dan Dialogflow API.

    Aktifkan API

  2. Pastikan Anda mengaktifkan API di project Cloud yang benar, lalu klik Berikutnya.

  3. Pastikan Anda mengaktifkan API yang benar, lalu klik Aktifkan.

Buat agen Dialogflow CX

Agen Dialogflow CX adalah agen virtual yang menangani percakapan serentak dengan pengguna akhir Anda. Modul ini adalah modul pemahaman bahasa alami yang memahami nuansa bahasa manusia. Dialogflow menerjemahkan teks pengguna akhir selama percakapan ke data terstruktur yang dapat dipahami oleh aplikasi dan layanan Anda. Anda mendesain dan membangun agen Dialogflow untuk menangani jenis percakapan yang diperlukan sistem Anda.

Agen Dialogflow seperti agen pusat panggilan manusia. Anda melatih keduanya untuk menangani skenario percakapan yang diharapkan, dan pelatihan Anda tidak perlu terlalu eksplisit.

Berikut cara membuat agen Dialogflow CX:

  1. Di konsol Dialogflow CX, buka Konsol Dialogflow CX. Klik Menu > Dialogflow CX.

    Buka konsol Dialogflow CX

  2. Pilih project Google Cloud. Untuk menemukan project, Anda mungkin perlu mengklik Semua, lalu menelusurinya.

  3. Sekarang Anda memiliki opsi untuk memilih agen bawaan atau membuat agen Anda sendiri. Jika Anda lebih suka mempelajari penyesuaian agen secara mendetail nanti, pilih salah satu agen bawaan, yang juga berguna untuk mempelajari kemampuan agen.

    Untuk memilih agen bawaan, ikuti langkah-langkah berikut:

    1. Klik Gunakan agen bawaan.
    2. Pilih agen bawaan. Untuk panduan ini, pilih Perjalanan: rental mobil.

      Agen diberi rating pemula, menengah, atau lanjutan berdasarkan jumlah fitur yang digunakan agen dan kecanggihan logika percakapannya. Memilih agen menengah atau lanjutan mungkin memerlukan penyesuaian dan setelan khusus agen, termasuk mengaktifkan fitur dan API di Konsol Google Cloud.

    3. Klik Impor sebagai agen.

    Untuk membuat agen Anda sendiri, ikuti langkah-langkah berikut:

    1. Klik Buat agen.
    2. Pilih Buat otomatis untuk membuat agen penyimpanan data atau pilih Buat sendiri untuk membuat jenis agen lainnya.

    Untuk mengetahui panduan mendetail tentang proses pembuatan agen, lihat Membuat agen Dialogflow CX.

  4. Konfigurasi setelan agen dasar:

    1. Di Nama tampilan, masukkan nama tampilan.
    2. Pilih lokasi yang Anda inginkan. Jika Anda ingin mengubah setelan lokasi lanjutan, klik Edit.
    3. Pilih zona waktu yang Anda inginkan.
    4. Pilih bahasa default untuk agen Anda. Anda tidak dapat mengubah bahasa default agen setelah dibuat.
  5. Klik Buat. Dialogflow CX mulai membuat agen, lalu menampilkan alur mulai default agen.

  6. Sesuaikan agen secara opsional. Untuk mengetahui panduan mendetail tentang proses penyesuaian agen, lihat Membuat agen Dialogflow CX.

  7. Sebagai praktik terbaik, uji agen:

    1. Klik Test agent.
    2. Pilih Test agent in environment.
    3. Di Environment, pilih Draft.
    4. Di Flow, pilih Default Start Flow.
    5. Di Page, pilih Start Page.
    6. Di kotak penulisan Bicara dengan agen, ketik Hello, lalu tekan Enter. Agen akan merespons dengan memperkenalkan diri.
    7. Selesaikan pengujian dengan melakukan percakapan pengujian contoh.
  8. Agen Dialogflow CX dibuat. Kembali ke konsol Dialogflow CX. Klik Menu > Dialogflow CX.

    Buka konsol Dialogflow CX

  9. Di bagian Agen, klik > Copy name. Simpan nama ini, karena Anda akan menggunakannya saat mengonfigurasi aplikasi Chat.

Membuat aplikasi Chat dan menghubungkannya dengan agen Dialogflow

Setelah membuat agen Dialogflow CX, ikuti langkah-langkah berikut untuk mengubahnya menjadi aplikasi Chat:

  1. Di konsol Google Cloud, buka Google Chat API. Telusuri "Google Chat API", lalu klik Google Chat API, lalu klik Kelola.

    Buka Chat API

  2. Klik Konfigurasi dan siapkan aplikasi Chat:

    1. Di Nama aplikasi, masukkan Dialogflow App.
    2. Di Avatar URL, masukkan https://developers.google.com/workspace/chat/images/quickstart-app-avatar.png.
    3. Di Deskripsi, masukkan Responds to real human conversation.
    4. Di bagian Functionality, pilih Join spaces and group conversations.
    5. Di bagian Connection settings, pilih Dialogflow.
    6. Di bagian Dialogflow settings, pilih Dialogflow CX.
    7. Di Agent or Environment resource name, tempel nama agen Dialogflow CX yang Anda salin di akhir Create a Dialogflow CX agent.
    8. Sediakan aplikasi Chat ini untuk orang dan grup tertentu di domain Anda dan masukkan alamat email Anda.
    9. Di bagian Logs, pilih Log errors to Logging.
  3. Klik Simpan.

Aplikasi Chat siap menerima dan merespons pesan di Chat.

Menguji aplikasi Chat

Uji aplikasi Chat Dialogflow CX dengan mengirimkan pesan di Google Chat.

  1. Buka Google Chat menggunakan akun Google Workspace yang Anda berikan saat menambahkan diri Anda sebagai penguji tepercaya.

    Buka Google Chat.

  2. Klik Percakapan baru.
  3. Di kolom Tambahkan 1 orang atau lebih, ketik nama aplikasi Chat Anda.
  4. Pilih aplikasi Chat Anda dari hasil. Pesan langsung akan terbuka.

  5. Di pesan langsung baru dengan aplikasi, ketik Hello, lalu tekan enter.

    Aplikasi Chat Dialogflow merespons dengan memperkenalkan dirinya.

  6. Selesaikan pengujian dengan melakukan percakapan pengujian contoh.

Contoh percakapan pengujian

Untuk menguji aplikasi Chat Dialogflow CX di konsol Dialogflow CX atau di Google Chat, lakukan percakapan berikut. Penjelasan ini membantu Anda memahami cara agen Dialogflow CX menafsirkan bahasa alami pengguna dan menghasilkan respons bahasa alaminya sendiri di setiap langkah dalam percakapan. Contoh percakapan ini didasarkan pada agen bawaan yang disebut Travel: car rental.

Dialog Penjelasan
Pengguna akhir: Halo
Agen: Halo! Saya adalah agen penyewaan mobil virtual. Saya dapat membantu Anda memulai pemesanan sewa mobil baru. Ada yang bisa saya bantu?
  1. Rute Default Welcome Intent di Default Start Flow dipanggil.
  2. Pemenuhan untuk pengendali status ini ("Hi! Saya...") ditambahkan ke antrean respons.
  3. Agen mengirimkan antrean respons kepada pengguna akhir.
Pengguna akhir: Saya ingin menyewa mobil.
Agen: Di mana Anda ingin mengambil kendaraan?
  1. Rute intent car_rental.reservation_create di Halaman Mulai dicocokkan.
  2. Sesi akan bertransisi ke halaman Lokasi Penjemputan.
  3. Formulir halaman Lokasi Pengambilan belum selesai, sehingga agen menggunakan parameter pickup_location untuk meminta pengguna ("Di mana Anda ingin mengambil..."), yang ditambahkan ke antrean respons.
  4. Agen mengirimkan antrean respons kepada pengguna akhir.
Pengguna akhir: Las Vegas
Agen: Oke, pengambilan Anda akan dilakukan di Las Vegas.
Agen: Apakah lokasi penurunan Anda berbeda dengan lokasi pengambilan?
  1. Input pengguna akhir mengisi parameter pickup_location yang diminta oleh agen pada giliran percakapan sebelumnya.
  2. Rute intent car_rental.return_different_location di Alur Mulai Default cocok.
  3. Rute penyelesaian formulir di halaman Lokasi Pengambilan dievaluasi dan dipanggil. Tindakan ini memiliki fulfillment ("Oke, pengambilan Anda..."), yang ditambahkan ke antrean respons dengan referensi parameternya yang diselesaikan ke nilai sebenarnya yang diberikan oleh pengguna akhir.
  4. Sesi akan bertransisi ke halaman Konfirmasi Lokasi.
  5. Halaman Konfirmasi Lokasi memiliki pengisian entri ("Apakah lokasi pengantaran Anda berbeda..."), yang ditambahkan ke antrean respons.
  6. Agen mengirimkan antrean respons kepada pengguna akhir.
Pengguna akhir: Ya. Saya akan mengantarkan mobilnya di Los Angeles.
Agen: Oke, pengantaran Anda akan dilakukan di Los Angeles.
Agen: Kapan tanggal dan waktu yang Anda inginkan untuk mengambil kendaraan?
  1. Rute intent car_rental.return_different_location di Alur Mulai Default cocok.
  2. Sesi akan bertransisi ke halaman Lokasi Drop Off.
  3. Input pengguna akhir mengisi parameter drop_off_location yang diminta oleh agen pada giliran percakapan sebelumnya.
  4. Rute penyelesaian formulir di halaman Drop Off Location dievaluasi dan dipanggil. Respons ini memiliki pemenuhan ("Oke, pengantaran Anda..."), yang ditambahkan ke antrean respons.
  5. Sesi akan beralih ke halaman Durasi Penyewaan.
  6. Halaman Durasi Penyewaan memiliki nilai formulir yang tidak lengkap, sehingga meminta pengguna untuk memasukkan parameter pickup_date_time ("Tanggal dan waktu berapa Anda ingin mengambil..."), yang ditambahkan ke antrean respons.
  7. Agen mengirimkan antrean respons kepada pengguna akhir.
Pengguna akhir: Saya ingin mengambil mobil pada 5 Maret pukul 12.00.
Agen: Kapan tanggal dan waktu yang Anda inginkan untuk mengantarkan kendaraan?
  1. Input pengguna akhir mengisi parameter pickup_date_time yang diminta oleh agen dalam giliran percakapan sebelumnya.
  2. Halaman Durasi Penyewaan memiliki nilai formulir lain yang tidak ada, sehingga meminta pengguna untuk memasukkan parameter drop_off_date_time ("Pada tanggal dan waktu berapa Anda ingin mengembalikan..."), yang ditambahkan ke antrean respons.
  3. Agen mengirimkan antrean respons kepada pengguna akhir.
Pengguna akhir: 15 Maret pukul 12.00.
Agen: Jadi, untuk mengonfirmasi:

Anda akan mengambil kendaraan di Las Vegas 05-03-2024 12.00.00 dan mengembalikannya di Los Angeles 15-03-2024 12.00.00

Apakah sudah benar?
  1. Input pengguna akhir mengisi parameter drop_off_date_time yang diminta oleh agen pada giliran percakapan sebelumnya.
  2. Sesi akan beralih ke halaman Confirm Rental Duration.
  3. Halaman Confirm Rental Duration memiliki pengisian entri ("Jadi untuk mengonfirmasi..."), yang ditambahkan ke antrean respons.
  4. Agen mengirimkan antrean respons kepada pengguna akhir.
Pengguna akhir: Ya, terima kasih.
Agen: Bagus! Sekarang, pilih kendaraan.
Agen: Apakah Anda ingin kendaraan kelas ekonomi atau mewah?
  1. Rute small_talk.confirmation.yes intent di halaman Confirm Rental Duration cocok.
  2. Agen mengonfirmasi pilihan pengguna dengan pesan ("Bagus! Sekarang mari kita pilih..."), yang ditambahkan ke antrean respons.
  3. Sesi akan bertransisi ke halaman Disambiguasi Kendaraan.
  4. Formulir halaman Disambiguasi Kendaraan belum selesai, sehingga agen menggunakan parameter vehicle_type untuk meminta pengguna ("Apakah Anda ingin kendaraan kelas ekonomi atau mewah..."), yang ditambahkan ke antrean respons.
  5. Agen mengirimkan antrean respons kepada pengguna akhir.
Pengguna akhir: Ekonomi, ya.
Agen: Apakah Anda ingin Cymbal Car atau Cymbal Truck?
  1. Rute intent $session.params.vehicle_type="economy_vehicle" dicocokkan.
  2. Sesi akan bertransisi ke halaman Economy Options.
  3. Halaman Opsi Ekonomi memiliki pengisian entri ("Apakah Anda ingin..."), yang ditambahkan ke antrean respons.
  4. Agen mengirimkan antrean respons kepada pengguna akhir.
Pengguna akhir: Cymbal Truck.
Agen: Cymbal Truck berharga $50,33 per hari. Kapasitasnya 4 orang dan dilengkapi dengan radio AM/FM. Ingin melanjutkan ke pembayaran?
Pengguna akhir: Ya, tolong.
  1. Rute intent $session.params.vehicle_type="Cymbal Truck" dicocokkan dan parameter vehicle_model diisi.
  2. Sesi akan beralih ke halaman Confirm Cymbal Truck.
  3. Halaman Confirm Cymbal Truck memiliki pengisian entri ("The Cymbal Truck is $50.33 per day..."), yang ditambahkan ke antrean respons.
  4. Agen mengirimkan antrean respons kepada pengguna akhir.
  5. Respons pengguna cocok dengan rute small_talk.confirmation.yes.
Agen: Jenis kartu apa yang akan Anda gunakan?
Pengguna akhir: Altostrat
Agen: Masukkan nomor kartu.
Pengguna akhir: 1234 1234 1234 1234
Agen: Siapa nama yang tertera di kartu?
Pengguna akhir: Charlie
Agen: Berapa alamat jalan penagihan?
Pengguna akhir: 1800 Amphibious Blvd. Mountain View, CA
Agen: Berapa kode ZIP penagihan?
Pengguna akhir: 94045
Agen: Anda akan mengambil Cymbal Car di Las Vegas, 05-03-2024 12.00.00 dan mengembalikannya, 15-03-2024 12.00.00. Total untuk perjalanan ini adalah $175,38.
Agen: Terima kasih telah menyewa mobil di tempat kami dan semoga hari Anda menyenangkan.
  1. Sesi akan bertransisi ke halaman Pembayaran.
  2. Formulir Pembayaran belum selesai, sehingga agen meminta parameter card_type, card_number, billing_name, billing_street_address, dan billing_zip_code kepada pengguna ("Jenis kartu apa yang akan..."). yang ditambahkan secara berurutan ke antrean respons dan dikirim saat pengguna merespons. Respons pengguna menetapkan setiap nilai parameter.
  3. Sesi akan beralih ke halaman Konfirmasi Penyewaan.
  4. Halaman Konfirmasi Penyewaan memiliki pengisian entri ("Oke, pengambilan Anda akan dilakukan pada..."), yang ditambahkan ke antrean respons.
  5. Agen mengirimkan antrean respons kepada pengguna akhir.
  6. Sesi akan bertransisi ke halaman Akhiri Sesi.

Mengirim pesan kartu dari Dialogflow

Dialogflow dapat merespons dengan pesan teks atau kartu. Untuk merespons dengan pesan kartu, tentukan sebagai payload kustom dalam pemenuhan.

JSON berikut menunjukkan cara mengirim pesan kartu sebagai payload kustom dalam pemenuhan:

json

{
  'cardsV2': [{
    'cardId': 'createCardMessage',
    'card': {
      'header': {
        'title': 'A card message!',
        'subtitle': 'Sent from Dialogflow',
        'imageUrl': 'https://developers.google.com/chat/images/chat-product-icon.png',
        'imageType': 'CIRCLE'
      },
      'sections': [
        {
          'widgets': [
            {
              'buttonList': {
                'buttons': [
                  {
                    'text': 'Read the docs!',
                    'onClick': {
                      'openLink': {
                        'url': 'https://developers.google.com/workspace/chat'
                      }
                    }
                  }
                ]
              }
            }
          ]
        }
      ]
    }
  }]
}

Batas dan pertimbangan

  • Peristiwa interaksi chat memiliki dukungan terbatas dan beberapa pertimbangan:
    • Jenis peristiwa interaksi berikut didukung:
      • MESSAGE
      • ADDED_TO_SPACE
      • CARD_CLICKED
    • Untuk peristiwa MESSAGE atau ADDED_TO_SPACE, input kueri yang dikirim ke agen Dialogflow sesuai dengan nilai kolom argumentText dalam pesan Chat. Jika pesan menyertakan perintah garis miring, nilai kolom text akan digunakan sebagai gantinya.
    • Untuk peristiwa CARD_CLICKED, input kueri yang dikirim ke agen Dialogflow diformat sebagai CARD_CLICKED.functionName, dengan functionName sesuai dengan nilai kolom function dari objek Action yang dilampirkan ke elemen kartu interaktif (seperti tombol).
    • Payload JSON lengkap dari setiap peristiwa interaksi Chat dikirim ke Dialogflow sebagai payload kustom dalam parameter kueri, dan dapat diakses dengan webhook Dialogflow dengan mengkueri nilai kolom WebhookRequest.payload.
  • Pertimbangan untuk merespons perintah garis miring dan menerima data dari kartu atau dialog:
    • Saat aplikasi Chat Dialogflow menerima pesan dengan perintah garis miring, input kueri hanya berisi nilai kolom text. Kolom text dimulai dengan nama perintah garis miring (misalnya, /command), yang dapat Anda gunakan untuk mengonfigurasi maksud agen Dialogflow untuk mendeteksi perintah garis miring.
    • Jika agen Dialogflow perlu memproses payload JSON peristiwa interaksi Chat, agen dapat melakukannya dengan menggunakan webhook Dialogflow untuk memeriksa payload kustom dalam parameter kueri.
    • Untuk menampilkan dialog dari Agen Dialogflow, respons dengan satu payload JSON kustom yang mencakup pesan yang berisi DIALOG respons tindakan.
    • Untuk memproses data yang dimasukkan dari kartu, agen Dialogflow dapat mendeteksi maksud (intent) yang dimulai dengan teks CARD_CLICKED dan merespons dengan payload JSON kustom tunggal yang berisi action yang sesuai.
  • Pratinjau link tidak didukung.
  • Jika agen Dialogflow merespons hanya dengan satu pesan, pesan tersebut akan dikirim ke Google Chat secara serentak. Jika agen Dialogflow merespons dengan beberapa pesan, semua pesan akan dikirim ke Chat secara asinkron dengan memanggil metode create di resource spaces.messages di Chat API satu kali untuk setiap pesan.
  • Saat menggunakan integrasi Dialogflow CX dengan Chat, agen Dialogflow dan aplikasi Chat harus disiapkan di project Google Cloud yang sama. Jika Anda perlu menyiapkan Dialogflow dan Chat di project Cloud yang berbeda, Anda dapat menyiapkan server perantara untuk memfasilitasi koneksi. Untuk mempelajari caranya, lihat contoh integrasi Chat untuk Dialogflow CX ini di GitHub.

Memecahkan masalah

Saat aplikasi atau kartu Google Chat menampilkan error, antarmuka Chat akan menampilkan pesan yang mengatakan "Terjadi masalah". atau "Tidak dapat memproses permintaan Anda". Terkadang UI Chat tidak menampilkan pesan error apa pun, tetapi aplikasi atau kartu Chat menghasilkan hasil yang tidak terduga; misalnya, pesan kartu mungkin tidak muncul.

Meskipun pesan error mungkin tidak ditampilkan di UI Chat, pesan error deskriptif dan data log tersedia untuk membantu Anda memperbaiki error jika logging error untuk aplikasi Chat diaktifkan. Untuk mendapatkan bantuan dalam melihat, men-debug, dan memperbaiki error, lihat Memecahkan masalah dan memperbaiki error Google Chat.

Pembersihan

Agar tidak menimbulkan biaya pada akun Google Cloud Anda untuk resource yang digunakan dalam tutorial ini, sebaiknya hapus project Cloud tersebut.

  1. Di Konsol Google Cloud, buka halaman Manage resources. Klik Menu > IAM & Admin > Kelola Resource.

    Buka Resource Manager

  2. Dalam daftar project, pilih project yang ingin Anda hapus, lalu klik Hapus .
  3. Pada dialog, ketik project ID, lalu klik Shut down untuk menghapus project.
  • Dialogflow CX menggunakan pendekatan mesin status untuk desain agen Dialogflow, yang memberi Anda kontrol yang jelas dan eksplisit atas percakapan, pengalaman pengguna akhir yang lebih baik, dan alur kerja pengembangan yang lebih baik. Saat membangun aplikasi Chat Dialogflow, sebaiknya gunakan Dialogflow CX.
  • Dialogflow ES adalah cara lain untuk menggunakan Dialogflow dengan aplikasi Chat.