ハイブリッドアプリ(webview)とネイティブアプリ、Web アプリ(PWA)の違い・各メリットとは?

(2020 年 4 月更新)

アプリを開発・発注する際にまず決めなければならない「ハイブリッドアプリ」と「ネイティブアプリ」、それぞれのメリットをご存知でしょうか?

特に EC サイト、ポータルサイト、情報検索サイト、来場予約サイト、社内業務管理ツールなどすでに Web サイトがある場合、既存のサイトをベースにするか、オリジナルで開発するかが悩みどころとなります。

また、最近では Google 社による「PWA (Progressive Web Apps)」という、Web アプリでありながらモバイルでの閲覧時にはアプリのような UI/UX を実現できるフレームワークも普及しています。

簡単にまとめると

  • PWA = モバイル端末で開くとアプリのように感じられる Web
  • WebView(ハイブリッド)アプリ = 既存の Web サイトをモバイルで見る際に iOS/Android アプリとして開く(+α として独自の機能を実装可能)
  • ネイティブアプリ = Web ではなくアプリとして 中身をイチから構築するアプリ

という役割となります。

そこで、今回はアプリ開発を検討されている企業のご担当者様向けに、それぞれを比較した際の違いと特徴をまとめました。

PWA とは? 通常の Web サイト・ハイブリッドアプリとの違い

PWA を一言で表すと “パワーアップした Web アプリ” です。

iOS/Android アプリ(ハイブリッドアプリ&ネイティブアプリ)を開発する前の段階の、Web サイトに対するソリューションです。

Web サイトをより回遊しやすくするために Web アプリ化するのと同様、Web アプリをさらに便利にするために PWA 化するという流れになります。

Web アプリを PWA 化する際には、ServiceWorker という JS ファイルを利用します。この SW により、iOS/Android 固有のプッシュ通知やバックグラウンド同期、オフライン起動といった “アプリのような UI/UX” を実現できます。

PWA 独自のメリットもあるが…

iOS/Android アプリのメリットとしてよく「プッシュ通知」と「ホーム画面に追加」が挙げられますが、実は Web でもこれらは実現可能です。

ただ、「ホーム画面に追加」をするための手順は分かりやすいものではないため、なかなか使われるものではありません。

PWA で Web を構築すると、顧客がアクセスした時点で「このサイトをホーム画面に追加する」というバナーを出すことができます。この導線の分かりやすさは PWA 固有のものです。

プッシュ通知に関してもアプリと同様のものが使える…というのがメリットのはずでしたが、iOS の対応が進んでいないため、現状は「Web ブラウザのプッシュ通知」+「Android アプリのプッシュ通知」に留まっています。

また、他のメリットとしては、“アプリ風の UI/UX” であるにも関わらず、固有の URL をシェアすることでインストールすることなく特定のページを見せることができるという点もあります。URL を SNS などでシェアできるため、認知獲得の際にアプリほどの手間がかかりません。

さらに公開状態でありながら、APK ファイルをつくることで App Store / Google Play でも配信できるため、「アプリはストアからダウンロードするもの」という先入観を持っているユーザーにも違和感を与えずに提供できます。

参考:Googleが推すPWAにiOS12もそれなりの対応?メリット・できないことを改めて整理

将来的にはユニバーサルアプリとしての期待も、現状は iOS の対応待ち

PWA はあくまでも Web を拡張したものであり、iOS/Android アプリの代替品としては不十分に感じる点は多いといえます。

PWA 最大のデメリットとしては、iOS 13 の時点でプッシュ通知とバックグラウンド同期ができないため、通知からの収益増を目指す小売・EC アプリなどと相性が悪いことです。 (2020 年 4 月時点)

つまり、期待されている役割は、アプリの代替品というよりは、どんなデバイスからアクセスしても一定水準の UI/UX を提供できるユニバーサルアプリです。

PWA を提唱する Google は、付帯技術を提供して普及を進めようとしています。Web サイトをアプリで開く際の主流技術である WebView は開発者泣かせの面があるため、画面内に最新の Chrome ブラウザを呼び出すという技術 “Trusted Web Activity (TWA)” を発表。WebView に対するソリューションとしては開発者たちから一定の注目を集めています。

「Webアプリ」と混同されがちな「ハイブリッド(webview)アプリ」とは?

ハイブリッドアプリは、一般的に言われる「iOS/Android のアプリ」と考えていただいて問題ありません。打ち合わせの段階では「WebView(のアプリ)」と一つの機能を指して呼ばれることが多いです。

いわゆる「ウェブビューのアプリ」とは、基本的には Web サイトと同じコンテンツをそのままスマートフォンやタブレットで読み込むために iOS/Android アプリ化するというものです。WebView とはスマホアプリ独自の統一ブラウザで、Google Chrome や Safari などとは違う仕様で Web サイトをレンダリングします。

加えて、ハイブリッドという名の通り、プッシュ通知・生体認証・VR/AR・NFC など、モバイル端末ならではの機能を実装して付加価値をつけることもできます。

既存の Web サイトの閲覧という行為をベースにしつつ、重要な部分はネイティブ(オリジナル)で開発することができるため、「ハイブリッドアプリ」と呼ばれています。 ただし、利用するためには必ず Google Play/App Store から各自が端末にインストールする必要があります。

ハイブリッドアプリ(webview アプリ)のメリットとデメリット

メリットは「ブラウザのデメリット解消」「参入と運用のしやすさ」

ハイブリッドアプリが最も力を発揮するのは「モバイルサイトでユーザーに期待している行動があまり起きていない」という課題を持つ事業です。「ブラウザで行っている動作をアプリで快適に行ってもらう(Web 上のユーザーの行動の一部を置き換える)」という設計でアプリを開発し、滞在時間や CVR を上げる施策になります。

たとえば EC サイトなどは「検索」「お気に入り」「購入」と、ユーザーの行動フローがシンプルですが、モバイルブラウザで Web サイトを開くと、使い勝手が悪いと感じているユーザーが多くなりがちです。

Google 社も、“アプリ風の UI/UX” である PWA でさえ「プッシュ通知により再訪率が 4 倍に」「CVR が 80〜100% 増加」という事例を紹介するなど、アプリの UI はモバイルブラウザの短所を補う役割があるとされています。

参考:スマホサイトの売上を改善!ECサイトのアプリ化は「3つの課題」に良い効果を与えられる

また、「ウェブサイトとアプリの両方を運用するなんて、とてもできない…」というお悩みはよく聞かれますが、WebView のアプリはサイトの更新がそのままアプリにも反映されるので手間がかかりません。

つまり、ハイブリッドアプリのメリットは、「運用やメンテナンスに手間をかけずに、顧客に自社の公式アプリを提供できること」といえます。事業との相性が良く、まずは堅実に事業の売上を一段階アップしたいという際におすすめといえます。

デメリットは「違いが出づらい、中途半端さ」「WebView の癖の強さ」

欠点としては、iOS/Android アプリならではの魅力、Web や SNS との違いが出しづらいことです。PWA など Web アプリに比べればスマートフォンならではの機能が自由に使えますが、ユーザーが起動した際の第一印象は既存の Web サイトとあまり変わりません。

ネイティブの UI を利用できない(アプリでしかできない、独自性の高い画面をつくれない)ため、あくまで「Web(モバイル)ブラウザではやりづらい行動をアプリで最適化する」というシンプルな価値提供に収まります。そのため、ユーザーに競合他社よりも良い印象を与えるためには、使いやすい UI/UX や独自の機能での差別化が鍵になります。

さらに注意すべきポイントとしては、「webview アプリをネイティブ化する=作り直しになる」ということです。「まずは web アプリのような簡単なもので始めて、うまくいったらもっとアプリらしいものに差し替えたい」と考えていても、リニューアル費用は安く済むわけではないのです。

また、WebView は Chrome や Safari と別のレンダリング技術になるので、動きの多い Web サイトを読み込もうとすると苦労する場面も出てきます。「ハイブリッドアプリ=開発しやすいことがメリット」という傾向こそありますが、必ずしもそうでないことには注意が必要です。

iOS/Android のネイティブアプリとは

ネイティブアプリとは、“ネイティブ(本来の)” という言葉の通り、アプリ内に独自のコンテンツとシステムをつくるものです。

そもそも Web サイトのアプリ化ではなく、メッセージアプリ、ゲームや加工用カメラなど、単体でサービスとしてリリースされているものを思い浮かべていただくとわかりやすいかと思います。

また、ハイブリッドアプリの開発は Web サイトの開発に似ている部分もありますが、ネイティブアプリの場合は iOS と Android でも開発に使用する言語が違います。そのため、ネイティブアプリを展開する際は、新しい機能開発やメンテナンスをしながら運用していくために両 OS のチームにそれぞれ多くの優秀なエンジニアを抱える必要があります。

しかし、だからこそネイティブアプリでは Web サイトではできない斬新な体験を顧客に提供でき、自社や製品・サービスのコアなファンを生み出せる可能性を秘めています。

ネイティブアプリのメリットとデメリット

ネイティブアプリのメリット・デメリットは、ハイブリッドアプリと比較すると「ハイリスク・ハイリターン」の一言に尽きるといえます。

iOS と Android それぞれの担当エンジニアを抱えて運用しなければならない上に、アプリはインストールしなければ利用も告知もできないため、多くの場合は Web サイト(簡易的な web ビューワー、キャンペーンサイト、告知ブログなど)も同時並行で運用することになります。

つまりネイティブアプリは、webview 主体のハイブリッドアプリとは違い、開発費だけでなく運用のコストも大きくかかるのがデメリットになります。投資を回収するためにも「アプリ単体で売上が上がる仕組み」および「常に一定のインストール数を維持する PR 施策」が重要になります。

しかし、優秀なエンジニアやマーケター、プロモーターが集まった組織がネイティブアプリで成功を収めた場合には多くのファン(優良顧客)が集まり、単体で大きな売上を出すことができます。

ですので、ネイティブアプリは、ある程度の規模に成長したが頭打ちになってきたという企業か、「このアプリで世界を変えたい」という想いを持って資金調達をしながら徐々に黒字化を目指していくスタートアップ向けの仕様といえます。

ハイブリッド(webview)アプリとネイティブアプリ、Webアプリ(PWA)の違い・メリットまとめ

  • PWA は Web のままでアプリに近い体験を実現できるが、現状は iOS があまり対応できていない
  • ハイブリッドアプリは運用者も開発者も手をつけやすいのがメリット
  • ハイブリッドアプリはWebView 以外に独自の機能もつけられるので、「Web サイトをそのままアプリ化しただけ」にする必要はない
  • ハイブリッドアプリは競合他社と差別化しづらいため、他社の上を行きたい際は UI/UX および機能面での工夫が必須
  • どちらで開発するにしても、「Web や SNS との役割の違い」「つくった後のこと」まで考えていなければ成功できない

アプリ開発においてはどうしても聞き慣れない単語が多いため、「ネイティブとハイブリッドどちらがいいのか」という枝葉の議論になってしまいがちです。

しかし、BackApp では「お客様の事業形態や状況という根本的な部分をしっかりとヒアリングしなければ、どちらが良いともいえない」と考えています。
ご不明な点などありましたら相談に乗らせていただいますので、お気軽にお問い合わせください。

また、下記の基本メッセージ記事もご一読いただけますと、よりアプリの役割や注意点が明確になるかと思います。

BackApp は、アプリ開発に特化して成長している組織です

「副業」を始めてみませんか?

BackApp では土日のみの副業・複業から社員、パートナー提携など、幅広い形態で開発体制を強化しています。ツールをフルに活用したフルリモートワークを実現しており、中には海外を旅しながら開発をしているメンバーも。コミットの履歴が残るエンジニアだからこそ、煩わしい「管理」から解放されます。

iOS/Android どちらも採用強化中ですので、ご興味のある方はご一読ください。

アプリ開発の各種相談承ります

「企画から開発までトータルで外注したい」「事業側は自社でやりたいので、開発のみ委託したい」など、御社の状況に応じてアプリの企画・開発を承ります。当社の開発事例や業界の傾向・最新事例なども含めてお話しますので、お困りのことがあればぜひ一度ご相談ください。

※働き方改革・リモートワーク推進企業のため、Skype, apper.in などオンラインでの商談も歓迎です