Firebaseで超簡単！アプリ内ポップアップを10分で実装する！
Firebaseに In-App Messaging がリリースされました🎉
アプリ側の実装ほぼ無しに、Ab〇maTVアプリ※みたいに
ポップアップダイアログを表示できるとか
めっちゃすごい！と使ってみて手軽さを体感している
モバイルソリューショングループのkatsu.tです。
※こんな感じ
In-App Messaging とは
In-App Messagingとは、簡単に言うと
Firebaseのコンソールから、ポップアップに表示したい内容を入力し
起動したいタイミングを設定すると、そのタイミングでアプリ側に
ポップアップが表示される機能です。
よくある、アプリを起動した時のポップアップを
アプリの実装なしで実現できてしまう、優れものです。
In-App Messaging でできること
以下のような設定を行えます。
- ポップアップの背景色の設定
- タイトルの文言設定
- 本文の文言設定
- タイトル、本文のテキストの色を設定
- ※2018/8/25 現在はタイトルと本文の色を変えることはできません。
- 真ん中に表示する画像のURLを設定
- ポップアップに表示するボタンの文言設定
- ボタンの背景、テキストの色の設定
- ボタンのタップ時のアクション
In-App Messaging の試し方
やることは主に以下となります。
- アプリ側に一般的なFirebaseを使う準備をします。
- cocoapodsに Firebase/InAppMessagingDisplay を追加し、 pod install を行います。
- FirebaseのInAppMessagingコンソールから配信したい内容を設定して、配信する。
※公式のチュートリアルはこちら
1. アプリ側に一般的なFirebaseを使う準備する。
Firebaseのコンソールから、アプリケーションを追加します。
あとは表示された手順にしたがってアプリ側に設定を行います。
アプリのIDを設定します。
設定ファイルをダウンロードして、アプリの中に組み込みます。
組み込みが完了したら、podを使ってライブラリをダウンロードします。
最後にコード内にFirebase SDKのinitメソッドを書いて完了です。
2. Podfileに Firebase/InAppMessagingDisplay を追加し、 pod install を行う。
以下内容をPodfileに追加する。
pod 'Firebase/InAppMessagingDisplay'
追加できたら pod install を実行する
$ pod install
3. FirebaseのInAppMessagingコンソールから配信したい内容を設定して、配信する
まず、新しいキャンペーンを作成します。
次に表示したい、ポップアップの内容を設定します。
最低限、タイトルと本文を設定しましょう。
続いて、キャンペーン名と送りたい対象を選択します。
キャンペーン名はFirebaseのコンソール上で確認するためのものなので
任意のもので構いません。
最後に送信したい日時とポップアップが発火するイベントを設定します。
※動作確認したのにうまく発火しないときは、「①スタイルと内容」の設定欄に
「端末テスト」とあるのでそれをクリックするとすぐに発火することができます。
この辺は公式のチュートリアルに記載があるためそちらをご参照ください。
最後にコンバーションを設定するのですが
これはアプリがリリースされてないと意味がないので
今回は入れずに配信します。
さて、みなさんいかがでしょうか。
配信できたでしょうか。
こんな簡単にポップアップができちゃうの！？
って感じになっていただけたら幸いです。
すでにFirebaseをご利用のプロダクトでは
特に実装いらずなので、ぜひ導入を検討してみるとどうでしょう。
