一款糟糕的移動應(yīng)用設(shè)計，能夠毀了一家公司的形象。用戶是很挑剔的，谷歌的報告表明，當(dāng)用戶感到一家電商公司的應(yīng)用很”垃圾”時，有79%的幾率會轉(zhuǎn)而使用競爭隊友的應(yīng)用。 電商正當(dāng)紅，移動是趨勢，兩者結(jié)合，威力不可小覷。很多品牌，例如說JackThreads，50%的銷售額是在移動端達成的。設(shè)計出優(yōu)秀的電商應(yīng)用體驗，既能夠愉悅消費者，提高轉(zhuǎn)化率，也能提高品牌的銷售額。 本文，我們從設(shè)計的角度來看看優(yōu)秀的電商應(yīng)用，應(yīng)該具備哪些”素質(zhì)”。

1: 清晰的視覺

使用高質(zhì)量且清晰的圖像 在使用智能手機購物時，最讓人感到惱火的，就是圖像不清晰，用戶無法看到商品的細節(jié)。因此，商家非常有必要提供高分辨率、清晰的圖像。安卓和iOS平臺現(xiàn)在鼓勵開發(fā)者盡量使用全屏圖像。 減少雜亂感 圖像清洗后，就要考慮排布問題了。何處應(yīng)該成為需要重點突出的視覺焦點，何處做襯托。整體布局要下功夫，這樣整體看起來才不會雜亂，用戶才能高效購物，提高滿意度。 上圖的Esty網(wǎng)站，很簡約，不雜亂。 反觀Macy，不但視覺風(fēng)格略有過時，也很亂。 妙用關(guān)鍵色 一點點關(guān)鍵色的運用，能夠有效的引起行為召喚，提高用戶的購物體驗。 JackThreas的安卓應(yīng)用：紅色是亮點 Luvocracy的iPhone應(yīng)用，利用紅色來引起行為召喚 要標清產(chǎn)品的可選項 最后，要考慮應(yīng)該如何把一件產(chǎn)品的細節(jié)，詳細的展現(xiàn)給用戶。像尺碼、顏色這種可選項細節(jié)，用戶必須能夠輕易的選擇，而且整體不能顯得雜亂。to include all options on the product screen. Zaoois的iPhone應(yīng)用 ModXCloth的iPhone應(yīng)用 有時候，可能所有的可選項都非常重要，你可能想要全部展示，這時候可以利用下拉菜單，增加空間、減少雜亂感。例如，JackThreads的應(yīng)用使用了下拉菜單，讓用戶選擇起來輕松自如，而且也不雜亂。

2: 直觀的搜索，高效的瀏覽器過濾

提高瀏覽體驗 瀏覽這一行為本身不應(yīng)該是繁瑣的。設(shè)計師設(shè)計出來的瀏覽模式應(yīng)該是充滿探索樂趣，用戶易于使用的，讓用戶逐條打開分類，尋找自己感興趣的商品。ModCloth的做法是，盡量減少導(dǎo)航分類，同時根據(jù)用戶瀏覽記錄。 提供感興趣的商品。 你看，導(dǎo)航選項只有一個”篩選”和一個”最新” 傳統(tǒng)的分類方法，雖然所有分類產(chǎn)品一覽無余，但是細信息太多，用戶一時半會無法有效篩選，用戶會因此搞不清他們所處的層級。這種” 減法設(shè)計”解決方案，能夠提供面包屑式的有效導(dǎo)航，讓用戶知曉目前自己處于分類樹中的哪一部分。 搜索商品 如果想要讓用戶高效的搜索商品，那么應(yīng)該為用戶額外提供那些便利？ 第一種方案是輸入內(nèi)容時的自動相關(guān)提示。 第二種方案是提供流行關(guān)鍵詞的提示，能讓用戶及時的關(guān)注一些熱點產(chǎn)品。 Amazon的iPhone應(yīng)用：自動填寫 ModCloth的iPHone應(yīng)用：最近的流行搜索 利用好首頁的產(chǎn)品滑動展示 首頁的滑動欄往往會展示出一些熱點商品和相關(guān)的系列產(chǎn)品。 除了首頁之外，還可以在某款產(chǎn)品下面使用滑動欄，提供相關(guān)產(chǎn)品，提高導(dǎo)航效率。

3: 社交分享和點贊

“我們希望Fab的用戶能時不時的掏出手機，然后去看看Fab上的熱點是什么。我們相信，只要用戶能夠喜歡瀏覽Fab的內(nèi)容，銷售問題也就自然而然的水到渠成了?！?— Fab.com的CEO 要有自己的社區(qū)/小圈子 創(chuàng)建一個小社區(qū)，這樣用戶就能很方便的分享自己喜歡的東西，這對于電商應(yīng)用來說，非常重要。Fab.com就做了很多工作來提高商品的分享率。他們是怎么實現(xiàn)的呢？其實就是添加了一些標簽 Fab的iPhone應(yīng)用 ModCloth 經(jīng)過迭代，提高了其移動應(yīng)用的分享功能，結(jié)果大受歡迎。用戶所照的商品圖像可以方便商家與用戶進行有效的互動。商家可以展示出用戶的上身圖來促進銷量。鼓勵用戶買下商品后，拍下來，這也是不錯的主意！買家總是容易相信買家的話，如果有圖作為援引，那么更有信服力了。 ModCloth iPhone應(yīng)用 還有一種常見的手法，便是提供收藏標簽，這樣用戶就能在收藏里面看到自己喜歡的產(chǎn)品了。 評價問題 網(wǎng)購最大的障礙就是：用戶在購買之前，往往不知道商品的質(zhì)量如何，是否適合自己。為了提高用戶的信任感，最好鼓勵其他購買過的用戶進行評價。即便不能文字說明，至少也要評分。 ModCloth Android應(yīng)用: 具有深度的評論能夠幫助其他買家挑選商品

4: 個性化的購物體驗

ModCloth: ModCloth 最近在iPhone應(yīng)用中推出了”Fit for Me”功能，能夠根據(jù)用戶的使用記錄，提供一些用戶可能感興趣的商品。 ModCloth iPhone應(yīng)用 Amazon 這方面做得也不做，也能基于購買記錄和搜索記錄推薦相關(guān)產(chǎn)品。這樣用戶就能很方便的找到自己感興趣的產(chǎn)品。 Amazon的iPhone應(yīng)用

5: 流暢的支付流程

網(wǎng)購中，最難的一關(guān)可能就是”支付”了。根據(jù)Jumio的調(diào)查表明，66%的用戶放棄購買商品，是因為支付流程過于繁瑣。而47%的交易失敗，也歸咎于復(fù)雜的支付流程。那么從設(shè)計的角度，我們應(yīng)該怎樣減少交易失敗率呢？ 讓購物車隨處可達 在任何頁面，用戶都應(yīng)該可以快速抵達購物車頁面。 保存用戶信息 用戶的住址、信用卡密碼等信息應(yīng)該可以方便的存儲起來，這樣就能大大額簡化購買支持流程。 看看下面Braintree的做法，只需要把信用卡放在手機前方中央，便可以掃出信息，迅速支付。 結(jié)論 下次在設(shè)計電商類移動應(yīng)用時，就需要考慮到這5點了：

1 清晰的視覺傳達

2 高效的搜索和瀏覽體驗

3 鼓勵社交分享

4 個性化的使用體驗

5 簡化支付流程 好的電商應(yīng)用設(shè)計，才能有好的轉(zhuǎn)化率，多向上面的應(yīng)用學(xué)習(xí)學(xué)習(xí)，提高銷售額！

原文地址：speckyboy 來源于優(yōu)設(shè)網(wǎng)翻譯：@MartinRGB