プログレッシブウェブアプリ（PWA）：トップ3のケーススタディ

公開: 2019-06-19

スタートアップを立ち上げたばかりで、ウェブサイトがすばらしいように見えても、モバイルアプリを開発するのに十分な予算がない場合を想像してみてください。これは、ビジネス戦略にとって重要な場合があります。しかし、それは非常に高価で少し危険です。また、ネイティブアプリの構築にも多くの時間を費やす必要がありますが、誰もあなたのブランドをよく知っていません。人々はあなたのアプリケーションをAppStoreまたはGooglePlayストアからダウンロードするのに十分信頼しますか？

さらに、顧客/読者は、ウェブサイトを閉じる、GooglePlayまたはAppStoreを開くなどの追加の手順を実行し、アプリがインストールされるまで辛抱強く待つことができると判断されますか？

最近、人々ははるかに要求が厳しくなっていることを忘れないでください。言い換えれば、彼らはまた非常にせっかちです–彼らは速い解決策を期待しています。このようなアプリを外部ストアからダウンロードすることは、非常に迅速な操作のようには思えず、ネイティブアプリはすべてのユーザーがアクセスしやすいわけではありません。ユーザーエクスペリエンスの観点から、顧客が（そしてあなたの）目標を達成する前に、顧客には多くの障害があります。

そしてもう1つ、クライアントにアプリをダウンロードするのに十分な内部ストレージスペースがあると確信していますか？

そのため、モバイルアプリ（IOSとAndroidの両方）の構築に多額の投資を行うことになり、人々が実際にそれを使用するかどうかはわかりません。ああ…そしてあなたが広告と宣伝に費やす必要があるあなたのマーケティング予算のこれらすべての莫大な量を忘れないでください！

しかし、待ってください、慌てる必要はありません、幸いなことに、あなたは2019年に住んでいますプログレッシブウェブアプリは、モバイルアプリの作成に関して一般的なソリューションになりつつあります！

プログレッシブウェブアプリについて聞いたことがありますか？そうでない場合は、今がこの最新のテクノロジートレンドに追いつくチャンスです。さもないと取り残されてしまいます。 それらが何であるか、そしてなぜこのオプションを選択する価値があるのかを説明する包括的な記事をすでに書いています。

本日は、プログレッシブWebアプリをすでに構築しているブランドのインスピレーションとサクセスストーリーを紹介します。

トリバゴ

Trivagoは、33の異なる言語で利用できるホテル検索エンジンで高い評価を得ています。 Trivagoは、ホテルの情報、写真、評価、レビュー、フィルター、およびその他の機能に基づいて、ユーザーが最良のオファーを見つけるのを支援します。

問題

問題は、Trivagoが近年モバイルユーザーの大幅な増加に気づいたことです。ブランドは、モバイルエクスペリエンスがクライアントにとってますます重要になっていることに気づきました。

ただし、モバイルソリューションの作成は簡単なことではなく、これは難しい選択を行うことを意味します。具体的には、同社は、モバイルアプリのダウンロード費用を人々が受け入れるかどうかを確信していませんでしたが、それが彼らの期待に合っているかどうかを確認するだけでした。彼らはまた、多くの人々が高品質のモバイル接続に問題を抱えていることに気づきました。これらの理由により、Trivagoはネイティブアプリとは異なる機会を探していました。

 推奨読書：プログレッシブウェブアプリとネイティブアプリ：どちらが適していますか？

解決

最後に、彼らはプログレッシブウェブアプリを発見しました。その機能は彼らのニーズにぴったりのようです。当時、彼らはプッシュ通知、オフラインモード、ホーム画面のショートカットを提供するソリューションを探していました。そして、Trivagoの最も重要な要素は、標準のモバイルブラウザを介したこのアプリへのアクセシビリティでした。

このPWAソリューションは、ソフトウェア開発者の大規模なチームを関与させることなく、アプリを構築するのに役立ちました。彼らは、プッシュ通知、オフラインアクセス、ホーム画面にアプリを追加する可能性など、最初に最も重要な機能に焦点を当てました。もちろん、最初は苦労しました。彼らは、モバイルの外観のデザインは標準のWebサイトのデザインとははるかに異なるため、最大の課題の1つは直感的なユーザーインターフェイスを作成することであると述べました。 PWAの設計者であるLauraOadesによると：

「モバイルでは、プラットフォームにとらわれず、混乱しないUIを作成するという追加の問題があります」、「PWAは設計においてほとんど未開拓の領域であり、創造的な問題解決者が新しい標準を定義するために自らを伸ばす本当の機会です。」

結果

TrivagoモバイルWebサイトは、55か国の33の言語で利用できます。
500 000人以上がホーム画面にTrivagoショートカットを追加し、エンゲージメントが150％増加しました。
以前のモバイルウェブサイトと比較して、プログレッシブウェブアプリははるかに多くのユーザーを引き付けました。 PWAの前は、0.8％のリピート訪問のみが記録されていましたが、現在、この数は平均2％に増加しています。
プッシュ通知は、コミュニケーションの完璧な手段であることが判明しました–コンバージョンの増加に役立ちました–ホテルオファーのPWAのクリック数は97％増加しました。

 推奨読書：旅行業界で最高のプログレッシブウェブアプリ7つ

ピンタレスト

Pinterestは、ユーザーが自分や他の人のボード（つまり、通常は共通の「ピン」のコレクション）に画像や動画を投稿（ Pinterestでは「ピン留め」と呼ばれる）することで、視覚的に共有し、新しい興味を発見できるソーシャルネットワークです。テーマ）そして他のユーザーがピン留めしたものを閲覧する

問題

認証されていないモバイルWebユーザーの使用状況を分析した後、彼らは、古くて遅いWebエクスペリエンスでは、ユーザーの1％しかサインアップ、ログイン、またはネイティブアプリのインストールに変換できなかったことに気付きました。この会話率を向上させる機会は非常に大きく、PWAへの投資につながりました。

Pinterest PWAは、国際的な成長に重点を置いていたために始まり、モバイルWebにつながりました。

解決

3か月以上にわたって、PinterestはReact、Redux、およびwebpackを使用してモバイルWebエクスペリエンスを再構築しました。彼らのモバイルウェブの書き直しは、コアビジネスメトリクスにいくつかの前向きな改善をもたらしました。

結果

彼らのモバイルウェブの書き直しは、パフォーマンスのいくつかの改善につながりました。

費やした時間は、古いモバイルWebエクスペリエンスと比較して40％増加し、ユーザー生成の広告収益は44％増加し、コアエンゲージメントは60％増加しています。

Pinterestの古いモバイルウェブエクスペリエンスは一枚岩でした。これには、CPUを多用するJavaScriptの大きなバンドルが含まれており、ピンページの読み込みとインタラクティブ化の速度を押し上げていました。

彼らの新しいモバイルウェブ体験は劇的な改善です。

JavaScriptから数百KBを分割して削減しただけでなく、コアバンドルのサイズを650KBから150KBに削減しただけでなく、主要なパフォーマンス指標も改善しました。 First Meaningful Paintは4.2秒から1.8秒に短縮され、Interactiveまでの時間は23秒から5.6秒に短縮されました。

PinterestはiOSとAndroidのアプリを販売していますが、これらのアプリがウェブ上で提供するのと同じコアホームフィードエクスペリエンスを、わずか150KBの縮小とgzip圧縮で提供することができました。これは、Androidの場合はこのエクスペリエンスを提供するために必要な9.6MB、iOSの場合は56MBとは対照的です。

ツイッター

ご存知のように、Twitterはソーシャルメディアプラットフォームであり、人々はツイートと呼ばれる短いメッセージを投稿します。 2006年3月に作成されました。現在、3億3500万人以上のアクティブユーザーがいます（2018年7月）。

問題

Twitterは、ユーザーがモバイルWebサイトを使用する際に多くの障害を克服する必要があることに気づきました。

それらのいくつかは低速のモバイルネットワーク上にあり、モバイルデバイスのストレージにほとんどスペースがありませんでした。その結果、訪問者はTwitterのWebサイトに時間を費やしたり、投稿やコメントを増やしたりすることに消極的でした。 Twitterは、ネイティブアプリを使用していない、またはこれをダウンロードするための十分なスペースがない人々にとって魅力的な代替手段を見つけたいと考えていました。

解決

Twitterは、プログレッシブWebアプリを構築することを決定しました。これは、最新のWebサイトとネイティブ機能の最良の組み合わせであると思われたためです。インスタントロード、データ消費量の削減、および大きなアクセシビリティは、Twitterが求めていた機能でした。

結果

結果は非常に印象的であることが判明しました–数字はそれ自体を物語っています：

バウンス率が20％低下し、
セッションあたりのページ数が65％増加し、
送信されたツイートが75％増加しました。

以前のサクセスストーリーと同様に、「ホーム画面に追加」プロンプトとプッシュ通知により、ユーザーのエンゲージメントが大幅に向上しました。このケーススタディで報告されているように、Twitterは、 25万人のユニークなユーザーがホーム画面から平均して1日4回TwitterLiteを実行していることに気づきました。さらに、1日あたり1,000万件を超えるプッシュ通知を送信しています。

Twitterの意図によると、PWAはネイティブのAndroidアプリ（23.5 MB）よりもはるかに少ないスペース（わずか600 KB）を使用するため、内部ストレージに保存するのに十分なスペースがある可能性が高くなります。

さらに、Twitterはデータセーバーモードを追加しました。これは、ユーザーが使用するモバイルデータの量を制御するのに役立ちます。このオプションのおかげで、完全にロードする画像またはビデオを選択でき、プレビューとして残すことができます。

 推奨読書：PWA SEO：プログレッシブウェブアプリ（PWA）はSEOにメリットがありますか？ （統計と例を含む）

ウェブサイトの未来を受け入れる

PWAはモバイルアプリケーションの未来です。ネイティブアプリケーションが時間に置き換わり、ネイティブアプリとウェブサイトの完璧な組み合わせになる可能性があります。新しいテクノロジーを採用するスピードが競争力のある世界では、PWAを早期に採用することに成功した企業は、競合他社に先んじながら、収益を大幅に増やし、ユーザーエンゲージメントを高めることができます。

これまで、AppleにはプログレッシブWebアプリケーションにいくつかの制限がありましたが、現在ではPWAをますますサポートしています。 Magento eコマースWebサイト用の万能の完璧なPWAを探しているオンラインマーチャントのために、ここSimiCartであなたとあなたの店のための完全なパッケージを提供します。