下載頁面是一個(gè)移動(dòng)產(chǎn)品的臉面，是用戶接觸產(chǎn)品的第一層。那么如何打造一個(gè)用戶體驗(yàn)良好的下載頁面呢？本文為你解析。

下載頁是移動(dòng)互聯(lián)網(wǎng)在傳播移動(dòng)端產(chǎn)品的必備頁面。由于一些產(chǎn)品經(jīng)理對這塊注意不足或者不屑在這個(gè)地方深究，導(dǎo)致產(chǎn)品在下載頁的體驗(yàn)并不好。同時(shí)很少見有人專門對此撰文，因此來簡單聊聊下載頁面存在的“坑”、流程設(shè)計(jì)和界面設(shè)計(jì)。

通過梳理完善下載頁的業(yè)務(wù)流程，能改善下載產(chǎn)品過程中的用戶體驗(yàn)，同時(shí)能進(jìn)一步提高產(chǎn)品經(jīng)理的流程化意識(shí)。

1 下載頁面的作用

1.1 展示產(chǎn)品核心功能與界面設(shè)計(jì)的窗口

為什么一個(gè)下載頁面是如此的重要？下載頁是產(chǎn)品重要的入口。用戶看到一個(gè)產(chǎn)品時(shí)，根本不會(huì)去看密密麻麻的介紹文字。更多的是粗略看產(chǎn)品介紹頁的圖片。此時(shí)下載頁承載著傳遞產(chǎn)品的核心特點(diǎn)、最新功能和展示界面設(shè)計(jì)的功能。

1.2 App下載前的最后一道障礙

下載頁是用戶下載決策前的最后一道障礙。根據(jù)漏斗模型，從用戶開始了解你的產(chǎn)品，到查看產(chǎn)品介紹到下載，最后到開始使用產(chǎn)品，用戶將會(huì)呈漏斗狀減少。下載頁是一個(gè)非常重要的過渡頁。頁面的設(shè)計(jì)是否美觀，下載流程是否順暢都關(guān)系到用戶是否繼續(xù)使用產(chǎn)品。在下載頁應(yīng)盡可能的避免較多的點(diǎn)擊次數(shù)。

?2 下載過程中存在的坑

最大的來自騰訊的微信與應(yīng)用寶。微信是手機(jī)必備社交軟件，但其自帶的瀏覽器不允許（非法）跳轉(zhuǎn)。因此，使得很多下載鏈接無法自動(dòng)下載移動(dòng)客戶端。（支付寶下載頁甚至被完全屏蔽了）于是一些產(chǎn)品經(jīng)理直接采用了騰訊開發(fā)平臺(tái)提供的微下載鏈接。微下載是騰訊官方提供的下載鏈接，可自動(dòng)判斷手機(jī)系統(tǒng)類型。微下載鏈接方便了iOS系統(tǒng)的跳轉(zhuǎn)，但在Android端體驗(yàn)不好。

應(yīng)用寶是國內(nèi)最大的第三方安卓應(yīng)用市場，眾多的安卓移動(dòng)客戶端通過應(yīng)用寶分發(fā)出去。用安卓微信掃描二維碼，打開下載頁面，“普通下載”按鈕故意做得很小，而突出顯示了“安全下載”按鈕。點(diǎn)擊安全下載，首先下載的卻是應(yīng)用寶的APK。點(diǎn)擊普通下載，則還需用戶點(diǎn)擊確定。如果用戶是第一次接觸肯定會(huì)點(diǎn)擊錯(cuò)誤。例如下圖的簡書安卓版。這種方式是常用的流氓手段~

3 下載流程分析梳理

首先在闡述流程之前，PM要厘清用戶可通過什么方式進(jìn)入到下載頁面，用戶所使用的訪問方式（工具）是什么，手機(jī)系統(tǒng)是iOS還是Android。通過簡單的思維導(dǎo)圖可梳理出本產(chǎn)品可能存在的組合場景。

從進(jìn)入下載頁的方式主要分為兩類：

1. 直接訪問下載頁面。用戶通過主頁跳轉(zhuǎn)或者其他頁面跳轉(zhuǎn)到下載頁面。
2. 掃描（網(wǎng)站/文章）二維碼。

隨著二維碼的普及，越多越多的信息通過二維碼傳播，而下載頁的鏈接生成二維碼置于海報(bào)、文章中。可能的方式包括在網(wǎng)站下載頁面直接用微信掃一掃/瀏覽器掃描二維碼,在文章末尾識(shí)別二維碼。

下載頁面訪問方式包括web端（PC瀏覽器）、wap端（手機(jī)瀏覽器）和微信（內(nèi)置瀏覽器）。

另外要考慮的不同的手機(jī)操作系統(tǒng)。當(dāng)前主流為iOS與Android，兩者在下載方式有很大的不同。iOS僅能通過APP Store下載安裝。Android可以通過直接下載APK，也可以通過應(yīng)用市場安裝，效果都一樣。

在下載頁面流程的設(shè)計(jì)之前有2個(gè)原則應(yīng)充分注意到：

1）盡可能減少跳轉(zhuǎn)，減少用戶點(diǎn)擊的次數(shù)。

跳轉(zhuǎn)次數(shù)越多，用戶點(diǎn)擊次數(shù)更多，用戶的耐心被消耗，則頁面跳出率越高。當(dāng)然還要結(jié)合其他因素一起考慮。要盡量避免在諸如下載軟件首先下載的是應(yīng)用寶軟件這種被“坑”的事情。

2）把簡單留給用戶，把復(fù)雜留給自己。

對于前端展示給用戶的邏輯盡可能簡單，而背后可能存在的復(fù)雜的判斷留給后臺(tái)來進(jìn)行。用戶都是“懶”的，下載流程要讓用戶少想少操作。如Keep下載頁，用iPhone版微信掃描，點(diǎn)擊下載，依然提示在瀏覽器中打開，這種情形本可以避免。

結(jié)合上面提到的各種坑以及流程設(shè)計(jì)原則，通過梳理可得到這樣一個(gè)下載流程圖。

（點(diǎn)擊查看大圖）

從上圖我們可以歸納出3種典型具體的使用場景：

1）用戶A打開官網(wǎng)下載頁面，使用iPhone 版微信掃一掃二維碼后，頁面跳轉(zhuǎn)至wap端下載頁面，點(diǎn)擊“立即下載”按鈕，則頁面經(jīng)過跳轉(zhuǎn)，最后打開了該APP的APP Store詳情頁，點(diǎn)擊即可下載安裝。微信的跳轉(zhuǎn)必須要用到騰訊提供的微下載鏈接。從點(diǎn)擊掃一掃到下載完成，用戶A僅點(diǎn)擊了3下。例如，用iPhone版微信掃描網(wǎng)易云音樂官方下載二維碼，則可直接跳轉(zhuǎn)至APP Store。

2）用戶B手持安卓手機(jī)，用百度瀏覽器掃描海報(bào)中的下載二維碼，頁面跳轉(zhuǎn)至wap端下載頁面，點(diǎn)擊“立即下載”按鈕，瀏覽器提示將要下載移動(dòng)客戶端的APK。點(diǎn)擊確定，從自己服務(wù)器下載APK并安裝。從點(diǎn)擊掃一掃到下載完成，用戶B僅點(diǎn)擊了3下。如下圖的支付寶。

3）用戶C手持安卓手機(jī)，用微信識(shí)別出圖片中的下載二維碼，頁面跳轉(zhuǎn)至wap端下載頁面，點(diǎn)擊“立即下載”按鈕，此時(shí)彈出提示界面，提示用戶“用瀏覽器打開”。用戶在手機(jī)瀏覽器打開后，則其后與第2種場景一致。雖然這樣讓用戶增加了2步操作，但有效避免了應(yīng)用寶里存在的大坑。下圖為安卓微信版下載Keep、銅板街APP，在點(diǎn)擊下載后，均提示用戶用瀏覽器打開。

以上說了那么多，其實(shí)就是告訴大家需要分清不同的下載場景，針對每種場景選擇一個(gè)最優(yōu)的方式。每一種情況下，盡量縮短操作。當(dāng)然，你甚至還可以在此流程基礎(chǔ)上進(jìn)一步優(yōu)化。比如優(yōu)酷在安卓瀏覽器掃描二維碼，可直接彈出下載提示框。

4下載頁面設(shè)計(jì)的要點(diǎn)

4.1?? 兩套界面

Web端與Wap端由于所在的屏幕大小不一，因此需針對兩個(gè)不同的訪問端展示不同的下載頁面。Wap端用戶的頁面大小和交互方式?jīng)Q定了用戶決策時(shí)間短，其應(yīng)做得盡量簡潔。

4.2 web端設(shè)置iOS與Android下載入口

通過前面的分析，在下載頁面二維碼必不能少。Web端下載頁面放置一個(gè)二維碼已經(jīng)足夠。但同時(shí)我們還需留意一些特殊需求的“長尾”用戶。比如某些用戶安卓手機(jī)無法聯(lián)網(wǎng)或者想節(jié)省移動(dòng)流量但又想安裝某APP,則需通過桌面下載安裝。用戶想看下APP Store對該產(chǎn)品的介紹?；谝陨暇涂煽紤]在Web端設(shè)置iOS與Android下載入口。

4.3 設(shè)計(jì)突出核心功能

正如前面所說，下載頁面是一個(gè)移動(dòng)產(chǎn)品的臉面，是用戶接觸產(chǎn)品的第一層。下載頁面要突出產(chǎn)品的核心功能，最近更新的亮點(diǎn)功能，以及產(chǎn)品主要頁面。在界面設(shè)計(jì)層次，盡可能的吸引用戶的眼球。無論是動(dòng)感十足還是文藝小清新，這就是產(chǎn)品和UI設(shè)計(jì)師共同討論的問題了。

利益聲明：以上舉例app與本人均不存在利益相關(guān)，截圖僅用于說明。

作者：游俠兒，愛閱讀愛健身的PM一枚。

本文由 @游俠兒 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載。