京東產(chǎn)品思維導(dǎo)圖「京東頁面設(shè)計」

當(dāng)我們對產(chǎn)品設(shè)計的理解還有所不足的時候，對市場上的成熟產(chǎn)品、優(yōu)秀產(chǎn)品進(jìn)行拆解，分析背后的產(chǎn)品設(shè)計原理以及產(chǎn)品思維，對我們很有幫助，能夠有效提升我們對產(chǎn)品的理解。

由于之前面試得到的反饋是對于產(chǎn)品的深度不夠，所以這段時間也思考了一下自己的問題。

跟朋友聊下來以后，覺得自己確實應(yīng)該好好深入的體驗一下各個大公司的產(chǎn)品。領(lǐng)域的話我個人還是對電商一類的比較感興趣，所以我選擇了京東進(jìn)行拆解，希望自己能從里面得到更深層次的感悟。

大公司的產(chǎn)品因為人員比較專業(yè)、迭代較多次，所以達(dá)到了一個比較完善的水平，對于個人成長還是很有幫助的，從這些產(chǎn)品的設(shè)計我們可以想到產(chǎn)品經(jīng)理在設(shè)計時的想法。

產(chǎn)品結(jié)構(gòu)圖：

背景信息這里就不給出了，大家一直看千篇一律的東西也得不出什么好的結(jié)論，有興趣的同學(xué)可以自己上網(wǎng)去查。

這次的拆解會拆解一些我認(rèn)為比較核心的功能，有一些不是很重要的、或者是太普遍的頁面我就不做拆解了。

一、首頁頁面布局

我將首頁分為3屏：因為一般人滑動手機(jī)也就滑那么幾下，如果讓用戶找不到他們感興趣的內(nèi)容，用戶很快就會流失掉。目前大部分電商平臺都采取了類似的樣式，一頁的內(nèi)容太少，滑動2-3下是比較合理的一個狀態(tài)。

PS：在滑動的同時，搜索框變換形狀，始終保持在頁面頂部，方便用戶進(jìn)行搜索。

第一屏包括比較重要的內(nèi)容、入口（平臺認(rèn)為），但是底部留下每日特價、新品首發(fā)、排行榜等內(nèi)容的標(biāo)題，讓用戶知道下面還有內(nèi)容，從而促進(jìn)用戶往下滑。第二屏包括相對次要的內(nèi)容，品牌閃購、種草、直播等在京東目前的優(yōu)先級不是很高，快報就更不用說了，電商平臺的快報基本看的人很少。第三屏是重復(fù)的內(nèi)容（商品介紹），選擇把分類吸附在頂部，方便用戶切換想看內(nèi)容的類型。

二、搜索

1. 點擊前

點擊前的搜索框內(nèi)文字滾動，內(nèi)容為用戶感興趣的內(nèi)容（搜索、加購、收藏、購買過的內(nèi)容相關(guān)的信息，或者是最近比較熱的內(nèi)容）。

作用：提醒用戶感興趣的內(nèi)容，讓用戶更容易點擊搜索框

2. 點擊后

點擊后進(jìn)入搜索頁面，同時彈出“長按說出你要的東西”按鈕，幫助懶得打字的用戶輸入內(nèi)容。增強(qiáng)下單的概率。

點擊后搜索框內(nèi)滾動的內(nèi)容不變，鍵盤上的右下角的按鈕變成可用的“搜索”，可以直接搜索輸入框內(nèi)的內(nèi)容。

3. 頁面展示

頁面由搜索歷史和搜索發(fā)現(xiàn)組成。

搜索歷史比較簡單，這塊就不贅述，主要就是把搜索過的內(nèi)容保存下來，點擊跳轉(zhuǎn)到對應(yīng)搜索內(nèi)容的結(jié)果頁。

搜索發(fā)現(xiàn)配置了很多標(biāo)簽。分為3類：

推薦內(nèi)容的標(biāo)簽，點擊后跳轉(zhuǎn)到對應(yīng)搜索內(nèi)容的結(jié)果頁，這個跟搜索歷史差不多。算法或者運營會配置一些最近比較熱門的詞匯。活動的H5，參考圖上的“京東小魔方”“京東春茶節(jié)”點擊會跳轉(zhuǎn)到對應(yīng)內(nèi)容的H5頁面，促使感興趣的用戶參加活動。常購清單，這個是我平常沒有注意到的內(nèi)容。

4. 常購清單

頁面布局：分為常買（買過1次以上）、可能再會買（買過1次），后臺應(yīng)該是會把購買頻次相對較高的商品放上去，比如生活用品、水果零食之類的，而不是把所有購買過的商品都列上去，那樣不是很合理。

下方的為你推薦就是正常的感興趣的內(nèi)容，這塊我會在推薦部分來說。

5. 看相似

看相似點擊后頁面的排布是商品（可點擊）、同店相似內(nèi)容、更多相似內(nèi)容。看相似功能在商品列表中也有應(yīng)用。

優(yōu)先級上面商品>同店相似內(nèi)容>更多相似內(nèi)容：

心理上用戶想看相似的內(nèi)容，即表明用戶對該商品有興趣，所以商品排在第一位。用戶對商品的品牌有一定認(rèn)知，所以相對的，同店的商品在用戶決策中，可能性會更高。更多相似推薦是為了防止用戶在選擇不出想要的內(nèi)容時，給用戶提供更多的選擇，同時給不同的品牌一定的曝光。

總的來說這個功能還不錯，就是入口比較深，用到的概率并不大。

6. 輸入搜索內(nèi)容

當(dāng)用戶輸入時，會進(jìn)行關(guān)鍵詞聯(lián)想。有兩種情況：

1）系統(tǒng)判斷關(guān)鍵詞無對應(yīng)分類

無對應(yīng)分類時，聯(lián)想的詞根據(jù)算法進(jìn)行排序（搜索的頻次、關(guān)聯(lián)程度等等）。

2）系統(tǒng)判斷關(guān)鍵詞有對應(yīng)分類

有對應(yīng)分類時，優(yōu)先展示對應(yīng)分類在搜索聯(lián)想的最上方。

在搜索聯(lián)想的第五位放入：搜索對應(yīng)店鋪內(nèi)容，幫助用戶查看對應(yīng)的店鋪。

改進(jìn)建議：

可以在搜索發(fā)現(xiàn)內(nèi)容下方新增更多推薦內(nèi)容（直播、資訊、分類等）。類似淘寶的全網(wǎng)熱榜、考拉的常用分類等。

優(yōu)：可以給用戶更多的選擇。給運營、商家更多的施展空間。

劣：可能會使頁面雜亂，涵蓋信息太多，給用戶太多選擇導(dǎo)致用戶放棄選擇。

結(jié)論：搜索頁面在目前的電商平臺已經(jīng)相對完善，但還是有一定的優(yōu)化空間。當(dāng)然做不做，怎么做，是產(chǎn)品經(jīng)理們應(yīng)該權(quán)衡的事情。

三、排行榜頁面

排行榜算是京東比較有特色的一個功能了。

京東會根據(jù)每天的銷量和銷售額計算排名，每天更新排名。銷量和銷售額的權(quán)重都比較高，從實際結(jié)果來看是這樣的。

排行榜的推薦內(nèi)容也是根據(jù)已購、加購、瀏覽等數(shù)據(jù)進(jìn)行推薦的。

我用京東買書和數(shù)碼產(chǎn)品比較多，所以相應(yīng)的，推薦給我的書和數(shù)碼產(chǎn)品比較多。

經(jīng)過我的驗算得出，每個榜單上面顯示的XXX人買過，是根據(jù)下一級頁面的累計購買人數(shù)之和得出的。

下一級頁面中展示30項推薦內(nèi)容，再往下就是其他排行榜以及其他商品的推薦信息。

排行榜的信息還會展示在商品的詳情頁中，這個我們講到商品詳情頁的時候會講到。

總結(jié)：

京東這個排行榜對于選擇困難的用戶是一劑強(qiáng)心針，跟專家推薦、種草有異曲同工之妙，能夠有效促進(jìn)用戶下單。

但是也存在問題，很多不錯的商品因為比較冷門所以無法上榜，導(dǎo)致效率較差，不過對于京東來說，這樣的問題應(yīng)該不會特別大，畢竟上面的商家相對淘寶來說沒有那么復(fù)雜，品類也比較好把控。

四、秒殺、特價

秒殺和特價給人一種占便宜的感覺，秒殺部分設(shè)置了倒計時，給用戶一種緊迫感，讓用戶下單。秒殺和特價封面的內(nèi)容也是根據(jù)用戶精準(zhǔn)推薦的，寫出了優(yōu)惠的價格，對用戶吸引力比較大。

試下一下一件你喜歡的東西，正好秒殺價，而且過了時間就回復(fù)原價了，你是不是會想要買呢？

五、推薦商品

用戶使用推薦商品這個功能，來源于用戶不知道選擇什么東西，需要讓平臺提供給用戶選擇。這個就跟我們在逛街一樣的，我們不知道要買什么，但是看到有趣的東西我們也會買一樣。

商品展示上：京東給予商品很多標(biāo)簽，主要分為以下幾類：

京東自營、京東超市、京東物流、京東精選。體現(xiàn)商品的權(quán)威性以及物流的即時。粉絲價、折扣價、PLUS會員價。讓用戶感覺便宜，提高用戶成為粉絲和PLUS會員開通率。新品、有優(yōu)惠券、免息。用于促進(jìn)用戶消費。榜單。上面說了排行榜是京東的特色，除排行榜以外，京東還有基于個人的好物榜。用權(quán)威促進(jìn)用戶下單。特定標(biāo)簽。類似：設(shè)計大咖的沉淀、商場同款等內(nèi)容，加深用戶對商品的認(rèn)識，從而引起用戶注意。

京東也會在瀑布流的商品中添加一些活動的H5，特定品類商品的推薦、其他京東系的頁面、用戶調(diào)研等等。

商家也可以通過PS自己商品的封面，達(dá)到告知用戶產(chǎn)品正在促銷、有優(yōu)惠的目的，吸引用戶前來下單。這個操作的空間就比較大了，不過京東后臺應(yīng)該會審核，畢竟平臺的內(nèi)容還是要保持相對統(tǒng)一的，不能誰都亂來，那樣用戶體驗就差了。

而這一些，都是通過京東強(qiáng)大的后臺來管理的。

結(jié)論：

關(guān)于商品推薦這部分，京東、淘寶、考拉海淘都做的差不多，但是京東和考拉在商品的頁面上沒有銷售數(shù)量，而淘寶有。

京東在頁面上分期、免息的內(nèi)容放的相對較少，而阿里系淘寶和考拉在頁面上分期免息的內(nèi)容比比皆是，這可能也跟阿里大力推花唄有關(guān)系吧。

這些大平臺在設(shè)計的時候，考慮的不單單是自己的因素，還考慮了很多公司生態(tài)層面的東西，這就要求我們在做產(chǎn)品的時候站在更高的角度去看問題。

六、結(jié)尾

本文只是我的一點小小的感想，有問題歡迎各位指正。

拆解的話就先拆一個首頁吧，后續(xù)的拆解我會通過競品分析的形式來做，這樣能更直觀的看到各個平臺的差別，體會不同公司產(chǎn)品經(jīng)理的想法。

下一期我會對電商平臺的商品詳情頁進(jìn)行對比研究，歡迎關(guān)注。

作者：里奧；公眾號「里奧的雜談」

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

題圖來自Unsplash，基于CC0協(xié)議