電商類型的APP已經(jīng)很常見了，但是如果設(shè)計不當，細節(jié)考慮不全，也會導(dǎo)致很多功能或體驗上的問題。下面我們從商城首頁、商品詳情+購物車管理、訂單管理等幾個方面，全面介紹電商類APP的設(shè)計關(guān)鍵點。

 

電商類APP開發(fā)的功能設(shè)計較難的部分是后臺，用戶使用的客戶端會有推薦或千人千面的展示，這些還是依賴后臺算法等。APP端的功能設(shè)計到后面基本沒什么大的改動，最多的是后端需要配合各種活動去設(shè)計，功能及其復(fù)雜。另外就是商品庫存管理系統(tǒng)和物流訂單管理系統(tǒng)，這里會涉及到商品出入庫和商品退單的核銷在里面，相對比較復(fù)雜。

 

商城首頁在規(guī)劃的時候需要結(jié)合自己的SKU數(shù)量，如果數(shù)量不夠那么做搜索是沒有必要的，做分類也要想好是否真的需要，道長碰見過商城第一版本運營和客服部門就提出一定要搜索，不然用戶想去搜索自己想要的商品怎么辦，分類一定要，擔心用戶搞不清楚哪個商品是屬于哪個分類。

 

搜索是高級功能，隨著產(chǎn)品版本迭代、品類豐富度夠高、用戶目標足夠明確的時候才會用到；

分類也是一種導(dǎo)航，目的是提高查找商品的效率，但帶來便利的同時也增加了使用成本，慎重增加。

 

商品詳情頁結(jié)構(gòu)相對簡單，第一部分是頂部的頭圖區(qū)域展示商品的大圖，支持多張圖片來回切換，也可以在這里放短視頻，和圖片配合著使用。頭圖下方的商品基本信息是一個單獨區(qū)域。

 

第二部分是商品詳細信息，這部分會包含很長的圖文信息，這里產(chǎn)品經(jīng)理可以規(guī)劃出來有這么個區(qū)域就好了，實現(xiàn)方式上采用H5，告訴開發(fā)的同學(xué)這里是個富文本區(qū)域，運營在填寫的時候可以填寫他們需要的內(nèi)容。

 

第三部分是最底部常駐操作面板，會有跳轉(zhuǎn)到購物車的入口、加入購物車和立即購買兩個按鈕，點擊后會跳出截圖里編號2的原型，用戶需要確認商品信息和數(shù)量，才會進入到下一步。

 

購物車頁面有兩個場景要照顧到：

場景一：用戶新打開APP，進入該頁面時可以先請求數(shù)據(jù)，沒有庫存的商品就直接從列表刪除；

場景二：用戶在APP其他頁面點擊進入購物車頁面時，商品狀態(tài)可以在點擊“結(jié)算“按鈕時再做一次檢測，如果商品庫存空了則提示用戶沒有庫存的商品，用戶確認后可以繼續(xù)結(jié)算。

 

訂單管理頁面邏輯就簡單多了，待支付訂單可以支付、待收貨訂單可以查看物流、結(jié)算的訂單可以再次購買。這里有幾個功能邏輯需要考慮到：

第一個是待支付訂單商品沒有庫存的時候，和前面購物車頁面那里的處理機制一樣；

第二個是已結(jié)束的訂單，用戶再次購買時，之前購買過的商品下架或者沒有庫存的時候，可以選擇告訴用戶沒有了的商品，留下可再次購買的商品，點擊后直接跳轉(zhuǎn)到結(jié)算頁面，不經(jīng)過購物車頁面。