ガワアプリとはWebベースの低コストアプリ。仕組みを詳しく解説
ガワアプリとは、WebアプリやWebサイトをスマホアプリのブラウザ機能を利用して、擬似的にスマホアプリ化したものです。一般的なアプリ開発よりも開発コストを抑えることができ、App StoreやGoogle Playからインストールし、使用することができます。一方で、中身はあくまでWebなので、本来のアプリよりは使いづらくパフォーマンスが悪くなります。
ガワアプリとは何か?
ガワアプリとは、スマートフォンやタブレットのアプリの一種で、主にWebページを表示する機能を持っています。「ガワ」は「外側」を意味し、アプリ内ブラウザを使用して特定のWebサイトを表示するのが主機能です。開発費が低く、既存のWebサイトをベースにしてアプリを作成できるため、比較的小規模な開発で済みます。ユーザーには通常のアプリと同様に見え、App StoreやGoogle Playからインストールし、使用することができます。
動画でも解説しているので、ぜひご覧ください。
ガワアプリのメリットとは?
Webページと一元管理できコストを大幅に削減できる
通常、スマホアプリを開発する場合、iOSとAndroidとWebの3つのプログラムを書いて、3つのシステムを構築する必要があります。
つまり、3つのシステムを管理・維持していく必要があり、開発コストだけでなく、維持コストがかかってきます。
ガワアプリの場合、WebViewと呼ばれるアプリ内ブラウザを使って、Webサイトを表示することで、アプリを構築するため、iOSとAndroidアプリの開発コストをおおよそ80 - 90%程度削減することが可能です。
ガワアプリのデメリットとは?
ガワアプリのデメリットとしては、低評価なレビューがつきやすい点にあります。
一般的にユーザーは快適な動作を求めてスマホアプリをストアからダウンロードします。ダウンロードしても、結局のところ中身はWebサイトなので、サクサク動かずに、ユーザーの期待に答えることができないケースがあります。
競合サービスが存在する場合は、競合優位性を保つことができずに、アプリを使ってもらえない可能性があります。
ガワアプリの作り方は?
1. ガワアプリを開発する場合、ネイティブ言語で開発するか、クロスプラットフォーム技術を採用するか選定します。
BLEやセンサー等のネイティブ機能を使いたい場合は、ネイティブ言語の方が安定して良いと思います。
2. WebViewを使って、Webページを表示する機能を実装します。
3. 必要に応じて、JavaScriptでWebページの要素を追加・削除してUIを整えます。
4. 審査を通すためにアプリらしい機能を追加します。(あとで詳しく解説します)
ガワアプリでネイティブ機能を制御する方法
ガワアプリでもGPSや画面の輝度を変更するなど、ネイティブ機能にアクセスすることが可能です。
- ネイティブアプリ側でWebViewを使ってWebページを開きます。
- ネイティブアプリ側でネイティブ機能実装を実装しておきます。
- WebページからJavaScriptを使ってネイティブ機能を呼び出します。
これをJS BridgeやJS Hookなどと呼びます。
Web側の担当者とアプリ側の担当者が密に連携を取る必要があり、コミュニケーションコストが発生します。
ガワアプリ開発の注意点は?
審査に落ちる可能性がある
単にWebサイトを表示しただけでは、審査で落ちる可能性が高いので、PUSH通知など、アプリならではの機能をつける必要があります。
App Store ガイドラインには、以下のような記載があります。
4.2 最低限の機能性Appを作成する際は、Webサイトを単に再パッケージしたようなものではなく、優れた機能、コンテンツ、UIを作成するようにしてください。特に便利でも、ユニークでも、「Appらしく」もない場合、そのAppをApp Storeで提供することはできません。Appが継続的に楽しめる何らかの価値、または十分な有用性を備えていない場合は、承認されない可能性があります。Appが単に曲または映画の場合は、iTunes Storeに提出してください。Appが単に書籍またはゲームの攻略本の場合は、Apple Books Storeに提出してください。
簡単に解説すると「Webサイトを単にWebViewでラップするだけでは、スマホアプリである必要性がないよね」ということです。
Webサイトをスマホアプリ化!Appleの審査に落ちる理由を解説
Web側の変更がアプリに影響を及ぼす可能性がある
Web側を変更することで、アプリ側で不具合が発生する可能性もあるので、Web担当者とアプリ担当者とで連携をしっかりとる必要があります。特に、スマホアプリ側でWebViewにJavaScriptを流し込んで、UIを制御している場合は、Webページ上のDOMのidやclass名が変更されると、予期しない表示となることがあります。
ですので、Web側に更新をかける場合は、検証環境で、スマホアプリに影響がないか十分にテストを行う必要があります。