為提高流量和再參與度，豪華化妝品品牌 Lancôme 採用 Mobify 打造出漸進式網頁應用程式 (PWA)，在行動版網站上提供類似應用程式的快速體驗。
- 轉換次數增加了 17%
- iOS 上的行動裝置工作階段數量增加 53%
- 透過推播通知，將回購購物車的轉換率提高 8%
挑戰
Lancôme 發現 2016 年首度出現行動裝置流量下滑的現象。 儘管行動版網站訪客有持續成長，行動裝置轉換率還是和電腦使用者的轉換率差不多。雖然 38% 的購物車是透過電腦下單，但行動版網站轉換率只有 15%。從這些差異中可以看出，消費者嘗試在行動裝置上購物時經歷了重大的障礙。隨著行動網路成為我們的主要重心，Lancôme 一直努力為行動網頁購物者打造快速又有吸引力的體驗。
不能直接開發應用程式，
起初，Lancôme 考慮建立了行動裝置專用的電子商務應用程式，但後來認為應用程式只適合經常造訪的客戶。他們瞭解蘭可美的行動版網站有不同的行為模式，而且不會每週回訪電子商務應用程式，光靠每日就能找到這股趨勢。Lancôme 希望在所有裝置上都能享有優質的使用者體驗。該公司需要像原生應用程式一樣可以快速載入、獲得優異的行動裝置體驗，但想要讓所有人都能透過行動網路找到及存取。
解決方法
Lancôme 希望採用 PWA 技術來提供類似應用程式的沉浸式體驗，而非僅稍微更新基礎網站。他們運用服務工作處理程序，在不穩定的網路中提供可靠效能，並利用推播通知接續互動。該公司頂尖的 PWA 在 Lighthouse 這項自動化工具中，改善網頁品質，達到 94/100 的效能分數。
在新版 PWA 中，與先前的行動裝置體驗相比，網頁互動式體驗前所等待的時間減少了 84%，跳出率也隨即下降 15%。Lancôme 的行動工作階段數量增加了 50% 以上，轉換率也增加了 17%。這項新策略也能在各個平台上提供更優質的使用者體驗。iOS 對 Lancôme 而言極為重要，因為所有使用者中，有 65% 是使用 iPhone 執行 PWA。Lancôme 採用新的 PWA 後，工作階段長度增加了 53%，iPhone 使用者的跳出率則降低了 10%。不過，雖然「新增至主畫面」選單項目、推播通知和離線快取功能因為缺少 iOS 對 Service Worker 的支援，因此無法使用。
Lancôme 的參與度是因為新網站的下載速度加快，也改善了使用者介面。在支援服務供應商的 Android 裝置上，Lancôme 還運用了推播通知等再互動技術，這已經廣受使用者歡迎：自這個網站於 2016 年 10 月推出以來，有超過 18,000 名購物者申請接收快訊。這類通知的外觀與原生應用程式相同；即使瀏覽器停止運作，也會收到這類通知。Lancôme 每個月會傳送四至五則專屬促銷和產品發布快訊。8% 的消費者在輕觸推播通知後會消費，遠高於電腦版網站轉換率。Lancôme 對利用推播通知重新與放棄購物車的購物者互動，都能獲得出色的成效。新策略在行動裝置上帶來 18% 的開啟率，放棄購物車的轉換率則增加了 8%。
總而言之，PWA 大獲成功，這讓美麗的巨人得以在行動網路上大放異彩。
成果
總覽
- 網頁展開互動前的時間縮短了 84%
- 轉換次數增加了 17%
- 跳出率降低 15%
- 行動裝置工作階段數量增加了 51%
iOS
- iOS 上的行動裝置工作階段數量增加 53%
- iOS 上的跳出率降低 10%
推入
- 8% 的消費者輕觸推播通知後會消費
- 18% 的開啟率來自推播通知
- 透過推播通知，將回購購物車的轉換率提高 12%