プログラミング

ブラウザゲームをPWA(Progressive web apps)化してiPhone/Android版を公開した話

投稿日:

PCブラウザゲームを公開してしばらくたった時にスマホ版も出したいなと思いました。ブラウザゲームなのでそのままでもスマホのWebで開けば遊ぶことができます。しかしスマホが回転するごとに画面が乱れたり、アドレスバーが邪魔だったりします。また収益化の面でいえば、ブラウザゲームのままの状態であるとスマホの最大のメリットであるAdmobを使用する事ができません。

以下、PCブラウザゲームをPWA(Progressive web apps)としてiPhone/Androidのネイティブアプリとして公開した話です。要点、キーワードのみで簡潔に述べました。参考にされる場合は自己責任でお願い致します。

PWAは意外と簡単だった

PWAの作り方を全く知らない状態からスタートしました。かなり多くの作業量を想定していましたが、情報収集をしていくうちに意外とあっさりできる事が分かりました。

・WebViewを1つ用意する

ほぼこれだけで終了です。
AndroidならWebView、iPhoneならWKWebViewです。これにブラウザゲームのURLを指定するだけで基本部分は完成です。

WebViewの画面サイズ調整に少々苦労

Android、iPhoneともに様々な画面サイズがあるので、その全てにおいて不具合がない要する必要があります。これが私にとっては結構大変でした。htmlのビューサイズ指定の部分を少し勉強しなおして何とか形にしました。

Admob広告表示/非表示にJavascript連携を使用

ネイティブ側のAdmob広告の表示/非表示は Java(Objective-c )ー Javascript間の連携を使用する事で実現できます。この連携機能は非常に便利で、やりたい事はほぼできると思われます。具体的な連携方法(使用する関数など)はWeb検索で記事が多数見つかります。

Android審査は難なく通過

Android版で苦労した点はWebViewの画面サイズの調整ぐらいでした。Play Consoleの審査もすぐにAcceptされて公開する事ができました。アップデートしていく上で何回かリジェクトをもらいましたが、原因は全てスクリーンショットの内容についてでした。シューティングゲームだったのですが、相手を撃っている画像は「暴力的」という理由で全てリジェクト対象になりました。銃をかまえてスコープで覗いている物も落とされました。また判断基準は一定でなく、一度通過した物も次回アップデート時に違反となった事もありました。

iPhone審査はやや厳しめ

PWA化に関する部分でのNGはありませんでしたが、それ以外の部分で何度もリジェクトを受けました。
解決する事ができなかったのが

・アカウント削除機能についての審査

です。ゲーム内で得たポイントの記憶やランキングなどためにゲームアカウント作成機能は当たり前のように組み込んでいました。しかし近年の規制強化でユーザー側でアカウントを削除できる機能を実装してく必要があるそうです。このアカウント削除機能の規定がとんでもなく厳格で、小規模開発者に対応できるレベルではないと感じました。

とりあえず公開だけしたかったのでやむを得ず、アカウント作成機能ごと削除する事で審査を通過しました。作成機能自体がなければ削除機能の実装の必要もないからです。しかしアカウントがないとランキング参加などやり込み要素が無くなってしまうのでゲームとしては大きな痛手です。将来的にはしっかりと削除機能を実装したいと思います。

PWA最大のメリットはストアへの掲載

PCブラウザゲームを公開して困ったのが宣伝方法です。ブラウザゲームは自分の裁量で自由に作成、公開ができますがブラウザゲーム用のストア的な物がないので宣伝に苦労しました。海外の大手ゲームサイト「Crazy Games」への登録を試みましたが審査が厳しく何度やってもリジェクトを受けました。提出したゲームの質が低かったとも言えます。しかし完成度が低くても多くの人に遊んでもらいたいものです。

PWAでGoogle Play Store、App Storeという2代巨頭ストアに載る事ができます。あっという間に数100DLを得る事ができました。人の目に触れるようにはなったのでここからはゲームの完成度次第でその後のDL数、収益が決まってくると思われます。

-プログラミング

執筆者:

関連記事

Heroku 独自ドメインで公開の手順 / ムームードメイン, ロリポップ使用の場合

HerokuでいくつかNode.jsゲームを公開しています。そのままただ公開すると「https://アプリ名.herokuapp.com」というURLになりますが、収益化などを考えた場合は独自ドメイン …

新手の架空請求? GOOGLE CLOUDSINGAPORE JPNから¥31のクレジットカード請求がきた

決算のために会計処理をしているとクレジットカード明細に覚えのない請求がありました。「GOOGLE CLOUDSINGAPORE JPN ¥31」えっ?究極のケチな私はよほどのことがない限り有料のサービ …

Android App: How to share video in external storage to MediaStore?

Code Android Studio Electric Eel | 2022.1.1 Patch 2[Java]String path = xxx; //path of the video in t …

今さらNode.js+Three.jsでゲームを作る理由 – なぜUnity, Unreal Engineでないのか

目次 目的を「コードを書いてゲームを作る」に絞る捨てる物余談、私自身の目的皆さんに言えるJavascriptでゲームを作るメリット 目的を「コードを書いてゲームを作る」に絞る ゲーム作成経験のない場合 …

サイトの仕様: ナビゲーションを解決する方法。Admobポリシーセンター広告制限

一年ほど前、突如としてAndroidアプリのAdmob広告に配信制限がかかりました。理由は「サイトの仕様: ナビゲーション」。これが厄介で、一体何を修正すべきなのかが全く分かりません。Web検索をかけ …

スポンサーリンク