モバイルアプリ内で画像付きお知らせを表示しよう!

ZAICOでは、Android・iOS・Rubyエンジニアを絶賛募集中です! 詳しくは、採用ページをご覧ください。

好きな場所で働こう

こんにちは!ZAICOの宴会副部長兼エンジニアのいくえもんです。

先日社内ハッカソン(FedEx Week)が開催されたので、そこで実施した内容をブログ化してみました。FedEx Weekではそれぞれ自由にテーマを決めて、普段の仕事とは違うことに挑戦します。私の今回のテーマはFirebaseを使い倒す!です。

やりたかったこと

アプリ内で簡単に新製品やキャンペーンのお知らせを出したい!

今までWEBアプリではバナーを使ってお知らせを表示していましたが、アプリではお知らせページを開いてもらう方法だけでした。今回は新製品のIoT重量計ZAICON発売のタイミングと合わせて皆様に情報をよりタイムリーに、楽しくお届けするため、画像付きのお知らせを表示できるようにしました。

やったこと

こんな時いつも頼りになるのがGoogle先生です。今回はGoogle先生が無料で提供してくださっているFirebaseの中のサービスIn-App Messagingを利用しました。結果はこんな感じです。

実装方法は至ってシンプル。こちらのGet startedに記載されているとおり、基本的にはSDKを組み込むだけでお知らせを表示することができます。しかし、ただSDKを組み込むだけでは、ログインしていないユーザーさんにまでお知らせが表示されてしまい少々不自然なので、

  • アプリ起動時とアプリ利用開始時(Foregroundに戻ってきたとき)にはIn-App MessagingをDisableする
  • ユーザー登録完了時、ログイン完了時及び初回ユーザー情報取得完了時にIn-App MessagingをEnableする
  • ログアウト時にIn-App MessagingをDisableする

という処理を追加することにより、ログイン済みユーザーにのみお知らせを表示させるように工夫しました。

In-App MessagingをDisableする方法は簡単です。以下の1行を記載するのみ!

[FIRInAppMessaging inAppMessaging].messageDisplaySuppressed = YES;

ほんの少しコードを追加するだけでUXは大幅向上するので是非導入の際は追加を検討してみてくださいね。

Firebase In-App Messagingで気をつけること

In-App Messagingは手軽に導入できて、かつ、とってもパワフルなツールです。特徴として、以下が挙げられます。

  • 表示スタイルをCard、Modal、Image only、Bannerの4種類から選択することができる
  • 表示内容のタイトル、本文、ボタン、画像をFirebaseの管理画面から自由に設定できる
  • タップ時の動作はリンク(Deep Linkも可)を指定するのみ
  • OSのバージョン、アプリのバージョン、利用言語、国、ユーザー属性(Analyticsと共通。要設定)、オーディエンス(Analyticsと共通。要設定)で表示対象者を限定することができる
  • お知らせの表示頻度や表示タイミング(基本的なもの以外はAnalyticsイベントを送信する必要あり)を指定することができる

しかしながら、利用目的が主にキャンペーン、かつ、無料ツールのため、様々な制約もあります。皆さんが導入する際は、導入目的が下のような制約を許容できるか確認してくださいね。

  • 1つのお知らせ(キャンペーン)の表示は最大1日1回まで。1日2回以上表示することはできない。
  • 複数のお知らせを同時に表示することはできない
  • ユーザー属性やオーディエンスは、アプリからAnalyticsに送信後、In-App Messagingに反映されるまで最大48時間かかる(これはどちらかというとAnalyticsの制約)。このため、頻繁に値が変更される属性に基づいたターゲティングはできない。
  • タイトル・本文・ボタンのフォントや改行を指定することはできない。見栄えを重視する際はタイトル、本文、ボタンの全てを含んだ画像を作成し、Image onlyモードを利用することをお勧めします(ZAICONのお知らせもこの方法)。

ただし、下の2つについては、どうしてもIn-App Messagingを利用してニーズに合わせた挙動やデザインにしたい人向けにkey/value型のメタデータを利用したカスタマイズや独自ライブラリの作成などがサポートされています。個人的にはIn-App Messagingは簡単に導入できるからこそ魅力的なのでこのカスタマイズをしてまで入れるかどうかは???ですが。。。

カスタマイズに興味のある方はModify message behaviorCustomize messagesを参照してください。

最後に

最後までお読みいただきありがとうございました。

In-App Messagingと同様の機能はKARTEReproなどのマーケティングツールでも提供していますが、Firebaseは無料という点が大きな魅力です。有料のツールを入れる前にどのくらい効果があるのか試してみたいなどの場合に利用を検討してみてはいかがでしょうか?

FedExではFirebase Realtime Databaseを利用した強制バージョンアップ機能も作成しました。次回はこちらについてご報告します。

ZAICOでは、新しいテクノロジーの力でモノの状態・流れを把握する仕組みに一緒に取り組む仲間を募集しております。
詳しくは、採用ページをご覧ください。

好きな場所で働こう