ChromeのWebプッシュ通知を実際に試してみた!

Pocket

こんにちは!pLucky隅田です!

今年の春、Google Chromeの新APIによりWebからもプッシュ通知が送れるようになった(モバイルはAndroid版Chrome)話はこのブログでも書きましたが、
今回はデモサイトを用いて実際どのように送られるのか試してみました!

Android版Chrome

1. スマホから「Simple Push Demo」サイトにアクセス

GooglePlayストアから「Chrome Beta」をインストールしたら、https://simple-push-demo.appspot.com/にスマホからアクセスしてください。

Screenshot_2015-12-17-15-19-01

2. 「Enable Push Notifications」を有効にする

「Enable Push Notification」をタップして有効にします。
すると、サイトから「通知を許可しますか?」といった表示が出るので「許可」をタップしてください。

Screenshot_2015-12-17-15-19-09

3. 「SEND A PUSH TO GCM VIA XHR」をタップしてプッシュ通知を送る

プッシュ通知を許可すると、以下のような画面になるので「SEND A PUSH TO GCM VIA XHR」というボタンをタップしてプッシュ通知を送りましょう。

Screenshot_2015-12-17-15-19-15

4. プッシュ通知が送られた!

すると、モバイルにアプリから送られるようなプッシュ通知が送られてきました!

Screenshot_2015-12-17-15-19-56

Screenshot_2015-12-17-15-20-24

今回はデモ用なので、サイトのボタンをタップすることでプッシュ通知が送られてきましたが、実際にはサイトの運営者側で設定するため、サイトを閉じていても送ることができます。

PC版Chrome

次に、MacのChromeでWebからプッシュ通知を送ってみます。
基本的にはモバイルと同様の手順で進めていってください。

スクリーンショット 2015-12-17 15.11.18

同様に「Enable Push Notifications」を有効にして、「SEND A PUSH TO GCM VIA XHR」ボタンをクリックしてください。
スクリーンショット 2015-12-17 15.11.31

すると画面右上にプッシュ通知が表示されました!

スクリーンショット 2015-12-17 15.11.46

通知をクリックして開くとリンクされたサイトに飛びました!

スクリーンショット 2015-12-17 16.27.39

まとめ

Webプッシュは今回のデモのように送られてくるわけですが、やはりメルマガとは全く性質が違うものだと感じました。
今後こういったWebからのプッシュ通知は普及してくるでしょうが、アプリからのプッシュ通知同様、使い方次第でユーザーエンゲージメントを向上させる便利なものにも、ウザいものにもなるので、ただ送っておけばいいという考え方は非常に危険です。
「プッシュ通知」と「ユーザー分析」は常にセットとして考えるようにしましょう!

Growth BlogのTwitterアカウントも解説したので、是非フォローお願いします!