使用者通常可以透過應用程式商店取得應用程式 (尤其是平台應用程式),或是下載套件並安裝應用程式。現在,即使是電腦版網站,我們也開始在集中商店提供應用程式。
以網頁應用程式來說,這個模型也有所不同:使用者不必前往集中式應用程式庫就能取得網頁應用程式。在設計上,並非所有網頁服務都可以安裝、安裝應用程式的情況因平台和瀏覽器而異,瀏覽器甚至會使用不同的選單和介面來安裝應用程式。當使用者點選該安裝選項後,預設對話方塊將不會包含任何額外資訊,如下所示:
![電腦上的瀏覽器預設安裝對話方塊。](https://developer.chrome.com/static/blog/richer-install-ui-desktop/image/the-browser-default-insta-3c6ce3fa8766e.png?authuser=7&hl=zh-tw)
![行動裝置的瀏覽器預設安裝對話方塊。](https://developer.chrome.com/static/blog/richer-install-ui-desktop/image/the-browser-default-inst-14907440251fd.png?authuser=7&hl=zh-tw)
您必須建立可安裝且提供與平台應用程式相同的互動的網頁應用程式,則需要在技術上進行技術工作,讓使用者瞭解如何善用這個不同的安裝流程。
隨著安裝使用者介面更豐富,網頁開發人員有機會提供新的機會,讓使用者在安裝時獲得有關應用程式的特定資訊。這個使用者介面適用於 Chrome 94 行動裝置和 Chrome 108 的電腦版。Chrome 將繼續為可安裝的應用程式提供簡單的安裝對話方塊,但是這個更大的使用者介面可以讓開發人員有更多空間突顯網頁應用程式。此外,這也能讓安裝程序更加熟悉,因為這類似於應用程式商店的對話方塊。
![電腦和行動裝置上更豐富的安裝 UI 螢幕截圖。](https://developer.chrome.com/static/blog/richer-install-ui-desktop/image/screenshots-richer-insta-56c432a76a62c.jpg?authuser=7&hl=zh-tw)
啟用功能更豐富的安裝使用者介面
如要顯示更豐富的安裝 UI 對話方塊,開發人員必須在 screenshots
陣列的相應板型規格中新增至少一張螢幕截圖。description
欄位並非必要,但建議您採用。使用這兩個欄位的內容建立內容對話方塊,因此體驗與應用程式商店安裝作業更相似。這有助於使用者識別他們要將應用程式新增至裝置,而開發人員也能在安裝時提供更多可用空間,供使用者查看具體的背景資訊。
舉例來說,開發人員可以使用 description
欄位醒目顯示應用程式的功能,鼓勵使用者在裝置上保留應用程式。透過 screenshots
,這類遊戲可以獨立呈現網頁應用程式的外觀和風格,並提供平台應用程式的所有簡便存取功能。
如需詳細規格和指南,瞭解如何將這些內容加入應用程式,請參閱更豐富的安裝 UI 模式。
舊版安裝提示提供的資訊和情境不足,這不符合使用者讓使用者對安裝作業的期望感到困惑。許多人拒絕了安裝要求,對建立這些要求的商家來說,同樣成效不彰。
更豐富的安裝功能可讓你打造更像是在作業系統上的安裝體驗。
您可以按照 Squoosh 應用程式資訊清單檔案的範例建構對話方塊,並透過 https://squoosh.app/ 即時體驗對話方塊。
意見反饋 我們正考慮採用其他方式來增加安裝量,包括類別和應用程式評分。我們需要您的寶貴意見,才能做出這項決定。 請與我們分享設計 想知道更豐富的安裝功能 UI 是否未正常運作嗎?還是有什麼特定資料需要實現?有任何疑問或意見嗎?填寫這份表單
Kaboompics .com 透過 Pexels 上傳的相片