小規模なチームが魅力的な Marketplace PWA を作成することで、どのように大きな成功を収めたかをご確認ください。
ヨルダンのアンマンを拠点とする OpenSooq は、中東と北アフリカの 19 か国で幅広い商品やサービスを提供しているモバイル ファーストのクラシファイド マーケットプレイスです。
課題
OpenSooq のトラフィックの 85% 以上はモバイル デバイスから発生しており、その数は今も増え続けています。この地域ではストレージ容量の限られたローエンド デバイスを使用している人が多いため、OpenSooq のモバイルサイトをできる限り高速かつ軽量にすることが強く求められています。しかし、OpenSooq の古いモバイルサイトでは読み込みに時間がかかることが顧客満足度に影響しており、クウェートなどの市場では直帰率が 49% にものぼりました。
すべてのプラットフォームで一貫して優れたエクスペリエンスを顧客に提供するには、より高速で応答性の高いウェブサイトが必要であることに気づきました。そこで、2017 年 6 月、OpenSooq のエンジニアリング チームはプログレッシブ ウェブアプリ(PWA)をリリースしました。
パフォーマンスと信頼性を重視
OpenSooq の社内デベロッパー 3 社は、React と webpack を使用して、わずか 2 か月半でフル機能の PWA を構築することができました。
サイトを検索エンジンが高速で簡単にインデックス登録できるようにするために、チームはサーバーサイド レンダリングを実装することを選択しました。ユーザーの約 28% がパッチの多い 2G または 3G ネットワークで PWA にアクセスするため、ネットワークの制約にかかわらず、ユーザーが安心して動作することが重要です。そこでチームは Service Worker とキャッシュ優先、次にネットワーク戦略を使用したオフライン エクスペリエンスを実装しました。また、PRPL パターンを使用して、ユーザーがすぐに読み込めるようにしました。
これらのベスト プラクティスを採用することで、チームは平均的なページ読み込み時間(操作可能になるまでの時間)を 4 秒から 2 秒未満に短縮できました。Lighthouse を使用して、サイトの読み込み速度を維持しました。こうした取り組みにより、OpenSooq は月に 18 億を超えるページビューを達成しました。
OpenSooq PWA には、ユーザーの 4 分の 1 以上が低中規模のネットワークからアクセスしているため、ユーザーのエンゲージメントを維持するには信頼性が不可欠でした。Service Worker とキャッシュ戦略により、必要とする信頼性の高いユーザー エクスペリエンスをシームレスに構築することができました。
OpenSooq 社 PWA テクニカル マネージャー Amin Shoman 氏
リエンゲージメントの改善
パフォーマンスと信頼性に優れたエクスペリエンスを構築した OpenSooq のチームは、ユーザーがプロダクトを利用し続けられるようにしたいと考えていました。そのために、ユーザーが PWA をホーム画面にインストールできるようにし、有意義な通知のサポートを追加しました。これにより、販売者は広告の有効化と有効期限について、問い合わせや販売者とのやり取りについて購入者に通知できるようになりました。
この改善により、OpenSooq のウェブ エクスペリエンスの 1 か月のアクティブ ユーザーが 14% 増加しました。PWA をインストールしたユーザーでは、セッションあたりのページアクセス数が 48% 増加し、平均セッション継続時間が 28% 増加しました。また OpenSooq では、ユーザーのページ滞在時間が平均 25% 増加し、全市場で平均直帰率が 29% 低下しました。
今後に向けて
わずか数週間の労力で、OpenSooq はすべてのプラットフォームとブラウザでユーザーに一貫したエクスペリエンスを提供する、23 KB のフル機能の PWA を作成しました。機能はウェブで簡単に更新できるため、チームは PWA 優先に移行し、他のプラットフォームに展開する前に PWA で新しい機能とユーザーフローを起動およびテストしました。
OpenSooq は現在、プラットフォーム固有のインストール プロンプトの追加と、PWA のアクセラレーテッド モバイルページ(AMP)との統合に取り組んでいます。今回の機能強化により、ページの読み込みがさらに高速化され、プラットフォーム固有のアプリにシームレスに移行できるようになります。OpenSooq チームは、初期の開発努力を基盤として構築することで、ユーザーに可能な限り最高のエクスペリエンスを提供し続けていきます。
PWA の開発の重要性は、経営陣と技術チームの双方にとって明らかでした。最新のウェブアプリを構築してパフォーマンスを向上させた後、この 2 か月半の投資でビジネス効果を確認できることを嬉しく思います。
OpenSooq 社 最高技術責任者 Ramzi Alqrainy 氏