Home Blogs 上位のプログレッシブWebアプリケーションの例:Tinder、Twitter、Walmart
Applications

上位のプログレッシブWebアプリケーションの例:Tinder、Twitter、Walmart

About The Author

Outline

優れたユーザーエクスペリエンスを提供するために、あらゆる種類の企業が現在、Progressive Web Apps (PWA)、Single-Page Applications (SPA)、React Webサイトなどの最新技術を採用している。 ヘッドレスeコマースに移行し、eCommerceのプログレッシブウェブアプリを採用して高速でコンバージョンの体験を提供しているこれらの業界リーダーにとって、モバイルネットワークのパフォーマンスはもはや懸念事項ではなくなった。

スピードは収益に等しく、eコマースは競争の激しい業界であるため、進歩的なウェブアプリの例を見つけるのは難しい。 しかし、PWAの採用者がより高い可視性、トラフィック、エンゲージメント、コンバージョンを受け取っているので、この情報は一般の人々と共有されるべきだと私たちは信じている。 eコマース企業が現在の状況を理解し、彼らがどこに立っているかを感じるのを助けるために、私たちは毎月のトップeコマースPWAの例のいくつかを紹介する。 今回は、インテリア、ソーシャルネットワーキング、量販店などの業界をリードする企業をリストアップした。

PWAを備えたソーシャルネットワーキングプラットフォーム

1. Pinterest – PWA

PinterestはiOSとAndroidユーザー向けにPWAを構築した初期の導入者の一人である。 創造的な心を刺激するためのプラットフォームは、モバイル体験を離れてしまった人々を招いた。Pinterestは、ネイティブアプリのようなPWA体験がアクティブなモバイルユーザー数を2倍以上増やし、セッション時間が約4倍になったと報告した。 ホームページのJavaScriptのペイロードは~490kbから~190kbになり、低帯域幅環境でもほぼ瞬時にページロードを作成した。 プッシュ通知、「ホーム画面に追加」プロンプト、「ナイトモード」設定、アセットキャッシングにより、モバイルユーザーにとって真に魅力的な体験が生み出された。

2. Tinder-PWA

Tinderは、250以上の国で月間6000万人以上のユーザーを抱える出会い系アプリで、デスクトップとモバイルユーザー向けにPWAを提供している。 Tinder Onlineとして知られる新しいウェブ体験は、ネイティブアプリ体験よりも多くのスワイプ、プロファイルの編集、ユーザーセッションあたりの時間を受け取る。 PWAコアの小型化により、Tinderは読み込み時間を11.9秒から4.69秒に短縮し、ユーザーを惹きつけ、右にスワイプすることで史上最高の状態にした。

Tinder PWAとネイティブアプリの例の比較。 (出典:

3. twitter-PWA

より多くのユーザーエンゲージメントを生み出すために、Twitterはより良いユーザーエクスペリエンスを提供するためにPWAテクノロジーに目を向け、大きな成果を上げた。 Twitter Liteは、セッションあたりのページ数が65%増加し、送信されるツイート数が75%増加したため、PWAの優れた例である。 データセーバーモードを追加し、PWAのサイズを60kbに最適化することで、3億人以上のアクティブなモバイルユーザーが2Gネットワークでもコンテンツをすばやくナビゲートできるようになった。

PWAを提供する家の装飾

4.アニー・セルケ- PWA+AMP+SSR

Annie Selkeは170kの訪問者に質の高い家の装飾を月持って来る。 SEOとSEMにおけるウェブサイトの速度の重要性を理解した同社は、Edgioのサーバーレスバックエンドfor Frontend (BFF)で自動AMP変換を備えたPWAを開始した。 アニー・セルケはモバイルオーガニックトラフィックが40.41%増加し、Edgioでのブラウジング速度を中央値538ミリ秒に短縮した。 アニー・セルケ、サーバーサイドレンダリング、PWA技術を通じて、トラフィックソース全体での最初のページの平均読み込み時間は0.74秒となっている。

eコマースウェスバイトを1秒以内に配信する

Edgioは、大規模なeコマースWebサイトのページロードの中央値が500ミリ秒以下であることを一貫して提供している。 これらの速度上昇は15-30%の転換の上昇を導くことが知られている。

5.カークランド株式会社 -PWA+AMP+SSR

カークランドは37の州にある431の店舗を超え、いつでもあらゆる顧客にリーチできるeコマースPWA向けに最適化されている。 サイトの速度を最適化することが主な目的であり、同社はサイトを競争の最前線と位置づけていた。 インテリア小売業者はEdgioのオープンソースReact PWAフレームワークを使用しており、組み込みのAMP変換とEdgioインフラストラクチャ上のサーバーサイドレンダリングをサポートしている。 カークランドは現在、最速の小売ウェブサイトの1つであり、1秒未満のページ読み込み、サムプリントチェックアウト、ワンクリックログインで迅速かつ簡単に購入できる。

6.ウェスト・エルム=プワ

親会社であるWilliams-Sonoma Inc.が所有するWest Elmは、モバイルコマースエクスペリエンスにPWAテクノロジーを採用した業界リーダーである。 彼らの製品の現代的なスタイルは、彼らのPWA体験と、彼らの月間400万人のユーザーのための洗練された、スタイリッシュなルックアンドフィールと一致している。 彼らのeコマースプログレッシブウェブアプリは、サイトの平均時間が15%増加し、コンバージョンが9%増加した。

eコマースPWAを利用した量販店

7.メイシーズ -スパ

IR6の企業であり、アパレルおよびアクセサリー業界でナンバーワンのMacy’sは、月間6000万人以上の訪問者に可能な限り最高の体験を提供するためにヘッドレスeコマースに移行した。 その結果、過去3年間でオンラインが2桁成長した。 Macyのサイト速度は途方もなく改善され、検索ランキングと顧客体験を後押しした。 Macy’sのエンジニアリングディレクターであるLenny Stofsky氏は、ヘッドレスアプローチとマイクロサービスアーキテクチャによって、より俊敏で機敏になると述べている。 「自動化された開発オペレーション、改善された回帰テスト、そして拡張と革新のための専任チームを通じて、2週間ごとに展開できる」とStofsky氏は述べている。

Macys.comのエンジニアリングディレクター、Lenny Stofskyが、モノリシックなシングルベンダーのeコマースプラットフォームから、マイクロサービスをベースとした柔軟で最善のシステムへの移行について説明する。

8.ステープル- PWA

ステープルズのウェブサイトの速度は、より多くの販売を促進するために可能な限り最高のユーザーエクスペリエンスを提供するための最優先事項となった。 これらの望ましい結果は、大量小売業者が、ロード時間が増加し、直帰率が増加し、コンバージョン率が低下することに気付いたときに重要になった。 カスタマージャーニーエクスペリエンスを完全に分析した後、Staplesはホームページの読み込み時間の中央値を1秒短縮し、98パーセンタイルの読み込み時間を6秒短縮することができた。 その結果、コンバージョン率が10%向上。

9.ターゲットPWA

Targetは月間1億人以上の訪問者を獲得しているが、AmazonやWalmartとの厳しい競争に直面している。 ターゲットは、モバイルとデスクトップの間のよりシームレスな移行を実現することに焦点を当てた調査で、ターゲットの買い物客の80%が1つのデバイスで小売体験を開始し、別のデバイスで終了する可能性が高いことが明らかになった。 進化し続ける環境に迅速に対応するために、PWAは中核となるデジタルストアのサービスを強化し、モバイルとデスクトップで買い物客に魅力的で統一されたエクスペリエンスを提供するソリューションとなった。

10.ウォルマート・スパ

ウォルマートは全てのカテゴリーで勝利している。 Walmart.comとWalmartの食料品店は、モバイルおよびデスクトップのオンラインショッピング体験を最適化するために、最新のテクノロジーを使用している。 ウォルマートの米国COOであるジュディス・マッケンナ氏は、「店舗に入ったり、サイトをクリックしたりすると」すべての顧客を畏怖させたいと考えていた。 現代のテクノロジーは、没入型オンライン体験とサイトの速度をサイトの時間と相関させる方法に劇的な影響を与えている。 eコマースサイトでは、100ミリ秒のページ読み込み改善ごとに、収益の増加が最大1%増加することがわかった。

要点

進歩的なウェブアプリはeコマースの未来である。 現代のウェブ技術のこの新しい時代には、競争上の優位性を獲得するために可能な限り最速のサイトと最高のユーザーエクスペリエンスを提供するためのeコマース企業間の競争が含まれている。 もはやネイティブアプリは最良の解決策ではない。PWAは同様にインタラクティブで、おそらくさらに高速である。 消費者は高速な期待を持っており、eコマースの専門家は、超高速で魅力的な体験を提供することが賢明であろう。

ノイズを乗り越えるためには、業界のリーダーが従来のウェブサイトからPWA/SPA/Reactウェブサイトに切り替え、コンバージョンを促進しSEO勝利をもたらすほぼ瞬間的な体験を提供する際に、業界のリーダーを早期に採用した例に従う。

その他のプログレッシブウェブアプリの例については、SPA、PWA、Reactフレームワークを使用している最新のeコマース企業のリストをチェックするか、12週間でPWAを立ち上げて実行するのにEdgioがどのように役立つかを知るためのコンサルティング会話をスケジュールする。