簡介
2020 年初,Chrome 行動版和電腦版團隊制定了改善已安裝網頁應用程式可發現度和參與度的計畫。我們的努力讓 PWA 安裝次數和參與度增加了超過 100%。我們研究現有功能、進行 A/B 測試實驗和使用者訪談,以深入瞭解使用者的看法和期望。本文將說明我們如何達成這項目標。
統一安裝語言
在網路平台上,觸發 PWA 安裝的行動號召不一致。針對 Android 版 Chrome,我們決定使用「Add to home screen」,但在電腦版平台上,我們強調「Install」。這項差異的合理性來自團隊在 2016 年進行的一項研究,該研究比較了不同的字串。團隊發現,在行動裝置上,「新增至主畫面」功能的效果略勝一籌。
2019 年進一步研究分類法後,我們發現兩者沒有差異,因此團隊希望統一 PWA 安裝體驗,因此決定將標籤更新為 Android 上的「Install」。2021 年進一步的研究比較了「安裝」、「取得」和「下載」等用語,結果發現使用者認為「安裝」是正在進行的程序。使用者認為點選標示為「Get」的按鈕會將使用者導向網站,而點選「Download」則會將檔案儲存至下載資料夾或類似位置。
綜合以上因素,我們認為「Install」標籤最適合 PWA。我們建議網頁平台的開發人員日後採用 Install 做為偏好字串。
在電腦上安裝圖示
在電腦平台上,我們採用了一種設計模式,當網站載入 PWA 時,Chrome 會在 Omnibox 的右側顯示圓形圖示,內含圖示和「Install」標籤。之後,使用者造訪網站時,只會看到圖示。點選這個藥丸圖示會觸發桌面版 PWA 的安裝程序。

這個圖示最初是加號符號,部分原因是因為在行動裝置上使用新增至主畫面的比喻。不過,如前所述,我們使用的語言是「Install」。開發人員社群的意見回饋指出,這個圖示會造成混淆。此外,如果使用者使用縮放功能放大文字,縮放圖示看起來會非常相似,讓使用者更加困惑。

由於大多數意見都是軼事,因此我決定調查使用者的看法。我們與使用者體驗研究人員合作,針對美國和印尼的 10,000 名使用者進行研究,瞭解使用者對安裝圖示的理解程度。我們測試了五種不同的設計 (包括現有設計),並詢問使用者「安裝」一詞的意思。我們發現,使用者最容易混淆的圖示是目前的加號圖示。許多人會將這個符號與「藥品」、「急救」和「電池」混淆。
我們也發現,使用者主要會將箭頭和裝置等圖像與安裝作業連結。根據這些結論,我們在 Chrome 中執行 A/B/C 版本測試,將現有設計與兩種替代方案進行比較。我們決定採用箭頭向下指的螢幕,成效比其他兩個圖示好上許多。我們也發現,使用這個新圖示後,使用者關閉安裝 UI 的次數減少了。

結果就是您今天看到的設計,這項設計讓 PWA 的安裝率比網站高出兩倍以上。我們也將這個圖示和行動版等同圖示新增至 Material Design 圖示集,讓社群使用我們認為最吸引人的圖示。
當然,單一圖示無法改變世界,因此我們要介紹下一個功能。
產品內說明
產品內說明是藍色氣泡工具提示,可根據特定條件向使用者介紹可能感興趣的新功能。我們決定推出這項設計模式,向使用者說明安裝功能,並進一步支援新圖示的重新設計。

當使用者定期造訪網站時,Chrome 會使用「網站參與度」服務。這項指標可提供使用者與網站互動程度的相關資訊。您可以造訪 chrome://site-engagement/
,查看自己經常互動的網站。我們可以利用這些分數判斷使用者是否對某個網站感興趣。如果網站是 PWA,且使用者已互動,我們會向他們顯示安裝產品內說明的 UI。也就是說,我們只會鎖定有互動的使用者,不會打擾可能只造訪網站一次的使用者。
在電腦上使用產品內說明後,PWA 安裝次數增加了 100% 以上,顯示以高參與度使用者為重點,可提高網頁應用程式的安裝率。
更豐富的安裝使用者介面
大多數使用者都是透過商店安裝應用程式。自 2000 年代中期起,我們就會向使用者說明,每次安裝應用程式時,他們都會看到說明、螢幕截圖和其他中繼資料,協助他們判斷應用程式是否符合需求。
使用 PWA 時,使用者決定安裝網頁應用程式後,我們顯示的 UI 相對較少。因此,團隊決定探索更豐富的安裝體驗,為使用者提供網頁應用程式的相關資訊,並讓開發人員能夠宣傳與原生體驗相符的 PWA。

今年稍早,我們推出了 Richer Install,這是 Android 版 Chrome 的擴充安裝 UI,可讓開發人員在資訊清單中加入螢幕截圖。開發人員也可以新增說明,這項操作雖然建議採用,但並非必要。由於這項新版 UI,我們發現部分 PWA 的安裝率翻倍成長,顯示使用者在獲得更多背景資訊和更豐富的體驗後,會更有信心安裝網頁應用程式。這個 UI 的電腦版目前仍在開發中。
結論
團隊在過去兩年內探索並實驗 Chrome 中的新功能,讓 PWA 開發人員得以發揮所長,並協助使用者瞭解網頁體驗的好處。我們仍有許多工作要做,但我們可以共同努力改善和豐富使用者的生活,並進一步支援開放式網路。