商品詳情頁(yè)是對(duì)商品進(jìn)行詳細(xì)描述介紹的頁(yè)面，詳情頁(yè)的設(shè)計(jì)極有可能會(huì)對(duì)用戶(hù)的購(gòu)買(mǎi)行為產(chǎn)生直接的影響。因此，商品詳情頁(yè)面的設(shè)計(jì)在美觀實(shí)用的基礎(chǔ)上，將要表達(dá)的信息盡可能用直觀的視角展現(xiàn)出來(lái)。

?

展示商品細(xì)節(jié)圖片

因?yàn)槭謾C(jī)端的特殊性，在產(chǎn)品信息頁(yè)面中僅僅只展示了幾張商品圖片和商品的基本信息。

?

當(dāng)用戶(hù)對(duì)該商品感興趣時(shí)，可以進(jìn)入該商品的詳情頁(yè)面，在詳情頁(yè)面中設(shè)計(jì)師需要盡可能地向用戶(hù)展示該商品的細(xì)節(jié)圖片，可以使用商品細(xì)節(jié)圖片與文字說(shuō)明相搭配的方式，使用戶(hù)能夠?qū)υ撋唐酚懈尤娴牧私猓瑥亩褂脩?hù)對(duì)商品產(chǎn)生購(gòu)買(mǎi)的欲望。

?

有效地引導(dǎo)用戶(hù)操作

用戶(hù)引導(dǎo)一般從色彩和文案兩個(gè)角度著手，而色彩是最直觀的表現(xiàn)形式，使用區(qū)別于頁(yè)面大環(huán)境的色彩來(lái)強(qiáng)調(diào)突出，在吸引消費(fèi)者視線(xiàn)的同時(shí)讓他們更樂(lè)于點(diǎn)擊。

?

例如：商品詳情頁(yè)面中，商品價(jià)格、活動(dòng)信息和“加入購(gòu)物車(chē)”按鈕都使用鮮艷的紅色。再如：所選尺碼以及“加入購(gòu)物車(chē)”按鈕都使用了鮮明的紫色，在界面中非常突出。

?

商品評(píng)價(jià)功能

對(duì)網(wǎng)絡(luò)缺乏信任是許多消費(fèi)者都存在的顧慮，而已購(gòu)買(mǎi)該商品的消費(fèi)者對(duì)于該商品的評(píng)價(jià)將會(huì)對(duì)有購(gòu)買(mǎi)意向的用戶(hù)產(chǎn)生很大的影響，因此商品評(píng)價(jià)功能是商品詳情頁(yè)面中不可缺少的功能。

?

例如：商品詳情頁(yè)面中的商品評(píng)價(jià)，對(duì)評(píng)價(jià)進(jìn)行了自動(dòng)匯總統(tǒng)計(jì)，讓用戶(hù)在查看的時(shí)候更直觀便捷。

?

連貫的商品介紹

對(duì)于商品詳情頁(yè)面，消費(fèi)者需要清晰地認(rèn)識(shí)到商品的全部信息，因此商品描述的邏輯順序變得格外重要，設(shè)計(jì)師可以基于商品描述的認(rèn)知規(guī)律去考慮安排商品介紹信息。

?

為商品詳情頁(yè)設(shè)計(jì)，整個(gè)頁(yè)面采用統(tǒng)一的配色和風(fēng)格，在詳情頁(yè)中對(duì)商品的各部分屬性進(jìn)行分步驟介紹，清晰明了。

?

跟隨性導(dǎo)航

商品詳情頁(yè)的內(nèi)容比較多，所以跟隨性的導(dǎo)航設(shè)計(jì)非常有必要。跟隨導(dǎo)航在商品詳情頁(yè)中能夠?yàn)橛脩?hù)操作提供很大的便利。例如：始終在商品詳情頁(yè)的上方和下方浮動(dòng)顯示跟隨性導(dǎo)航，便于用戶(hù)快速地切換頁(yè)面和購(gòu)買(mǎi)商品。

?

商品詳情頁(yè)面不要過(guò)長(zhǎng)

商品詳情頁(yè)面的長(zhǎng)度不宜過(guò)長(zhǎng)，頁(yè)面長(zhǎng)度過(guò)長(zhǎng)會(huì)導(dǎo)致頁(yè)面加載速度變慢，特別是在手機(jī)端，會(huì)消耗大量的手機(jī)流量，也會(huì)讓用戶(hù)產(chǎn)生視覺(jué)疲勞。一般來(lái)說(shuō)，手機(jī)端的商品詳情頁(yè)面需要控制在10屏以?xún)?nèi)。

?