項(xiàng)目8-3-繪制商品詳情頁(yè)面

任務(wù)三繪制商品詳情頁(yè)面授課教師：王萍項(xiàng)目八網(wǎng)店設(shè)計(jì)與裝修一、商品詳情頁(yè)的風(fēng)格定位與店鋪內(nèi)其他頁(yè)面、其他圖片的視覺(jué)設(shè)計(jì)一樣，商品詳情頁(yè)的視覺(jué)設(shè)計(jì)風(fēng)格定位依然是基于品牌、基于整個(gè)店鋪的設(shè)計(jì)風(fēng)格、基于目標(biāo)消費(fèi)者的喜好，再結(jié)合商品本身的風(fēng)格、特點(diǎn)確定的。二、商品詳情頁(yè)的布局邏輯商品詳情頁(yè)的主要作用是說(shuō)服消費(fèi)者購(gòu)買商品。而為了更有效地說(shuō)服消費(fèi)者，商家可以按照消費(fèi)者的購(gòu)物心理對(duì)商品詳情頁(yè)進(jìn)行巧妙布局，依靠對(duì)消費(fèi)者購(gòu)物心理的揣摩來(lái)獲取消費(fèi)者的信任并促使其購(gòu)買商品。根據(jù)AIDMA法則，消費(fèi)者在購(gòu)物時(shí)的心理變化主要表現(xiàn)為：Attention（引起關(guān)注）→Interest（引發(fā)興趣）→Desire（喚起欲望）→Memory（加深記憶）→Action（決定購(gòu)買）幾個(gè)主要階段。加深了解刺激購(gòu)買引起關(guān)注引發(fā)興趣促使分享而從運(yùn)營(yíng)者的角度來(lái)分析，為了迎合消費(fèi)者這種購(gòu)物心理，商品詳情頁(yè)的布局邏輯就應(yīng)該具備以下幾個(gè)方面的內(nèi)容。三、商品詳情頁(yè)的溝通框架模特圖或?qū)嶋H使用圖商品評(píng)價(jià)真人試穿或試用效果商品展示圖商品細(xì)節(jié)圖尺碼或參數(shù)圖基本信息消費(fèi)者需求的基本信息1.商品詳情頁(yè)是消費(fèi)者了解商品、獲取商品信息最主要的途徑。因此不管如何設(shè)計(jì)商品詳情頁(yè)，都必須包含消費(fèi)者想要了解的基本內(nèi)容。一般來(lái)說(shuō)，消費(fèi)者希望在商品詳情頁(yè)中了解的信息主要包括以下內(nèi)容。營(yíng)銷品牌商品6商品詳情頁(yè)的基本要素2.從運(yùn)營(yíng)的角度看，商品詳情頁(yè)的主要作用是促使消費(fèi)者購(gòu)買，因此除了要展示消費(fèi)者需求的基本信息，還要展示更豐富的、有助于進(jìn)一步打動(dòng)消費(fèi)者的信息，實(shí)現(xiàn)成交的目的。商品詳情頁(yè)信息展示的基本要素主要包括以下五部分。服務(wù)互動(dòng)Title標(biāo)題Description商品描述Price商品價(jià)格Details商品細(xì)節(jié)BulletPoint商品要點(diǎn)Reviews商品評(píng)價(jià)ProductImage圖片EBC/A+頁(yè)面Attribute商品屬性SearchTerm搜索關(guān)鍵詞買家可見(jiàn)元素買家不可見(jiàn)元素標(biāo)題Title01.商品標(biāo)題作用還有助于打造品牌。包含商品的品牌等詞語(yǔ)。名稱重要參數(shù)主要賣點(diǎn)使用場(chǎng)景商品標(biāo)題會(huì)影響該商品能否顯示在搜索結(jié)果中；傳遞信息準(zhǔn)確的商品標(biāo)題不但有助于提升商品的曝光率和點(diǎn)擊率；主圖（MainImage）作用還會(huì)影響產(chǎn)品的搜索排名。主圖特點(diǎn)商品主圖是顯示在搜索結(jié)果中的圖片，也是商品詳情頁(yè)中，商品標(biāo)題旁邊默認(rèn)顯示的第一張圖片。02.商品圖片及視頻買家對(duì)于商品最直觀的印象來(lái)自于主圖；高質(zhì)量的主圖不僅會(huì)影響產(chǎn)品的點(diǎn)擊率和轉(zhuǎn)化率；主圖需要突出展現(xiàn)商品主要賣點(diǎn)、魅力，以及與其他同類商品的差異點(diǎn)等，以提升主圖的吸引力。不同的電商平臺(tái)，每個(gè)商品還可以再配5-7張輔圖，用于展示商品的實(shí)際使用場(chǎng)景，營(yíng)造產(chǎn)品使用氛圍，并從不同的角度來(lái)展示商品，或展示在“主圖”中沒(méi)有顯示的細(xì)節(jié)。輔圖（OtherImage/SubImage）產(chǎn)品視頻（Productvideo）建議用表格或配圖描述。03.規(guī)格參數(shù)商品屬性（ProductAttributes）包含商品的尺寸等屬性或技術(shù)參數(shù)信息。型號(hào)規(guī)格顏色材質(zhì)重量功耗形式對(duì)于商品的尺寸的說(shuō)明，可以采用與常見(jiàn)標(biāo)準(zhǔn)規(guī)格的實(shí)物進(jìn)行對(duì)比，如人民幣的1元硬幣，A4打印紙等。機(jī)械設(shè)備等工業(yè)級(jí)商品，建議最好采用表格方式顯示規(guī)格參數(shù)。精心編寫的商品描述有助于顧客更進(jìn)一步了解商品；04.商品描述作用一般會(huì)運(yùn)用

FAB法則

或

IIC法則

，以圖文并茂的方式，介紹商品的主要功能、特點(diǎn)、賣點(diǎn)、內(nèi)外包裝、對(duì)用戶痛點(diǎn)的解決方式，用來(lái)和其他同類產(chǎn)品形成差異化。幫助消費(fèi)者想象擁有或使用商品所帶來(lái)的體驗(yàn)；增加客戶對(duì)產(chǎn)品的信任，從而促進(jìn)轉(zhuǎn)化。方式FAB法則IIC法則Ffeatures屬性advantages（轉(zhuǎn)化）作用benefits利益AB喚起顧客的欲望，讓他們想把產(chǎn)品買回家；Inspire（喚起）對(duì)客戶進(jìn)行產(chǎn)品功能和好處方面的教育；Inform（教育）將訪客轉(zhuǎn)化為買家。Convert（轉(zhuǎn)化）圖片則對(duì)商品賣點(diǎn)進(jìn)行直觀展示。利用圖文結(jié)合從視覺(jué)上影響消費(fèi)者，加深消費(fèi)者對(duì)商品賣點(diǎn)的認(rèn)識(shí)和理解。文案簡(jiǎn)明、扼要地說(shuō)明商品賣點(diǎn)；是指商品的材質(zhì)、款式、功能、外觀等能夠提高消費(fèi)者對(duì)商品好感度的特點(diǎn)。商品賣點(diǎn)四、賣點(diǎn)圖視覺(jué)優(yōu)化在視覺(jué)設(shè)計(jì)中，商品賣點(diǎn)主要通過(guò)文案和圖片進(jìn)行搭配展現(xiàn)。商品細(xì)節(jié)圖是商家展示商品品質(zhì)、贏得消費(fèi)者好感的重要手段，也是商品詳情頁(yè)視覺(jué)設(shè)計(jì)中的重要組成部分。商品細(xì)節(jié)圖的視覺(jué)設(shè)計(jì)重點(diǎn)是傳達(dá)消費(fèi)者感興趣的商品細(xì)節(jié)信息，一般要根據(jù)商品性質(zhì)選擇不同的展示方向，如通過(guò)功能說(shuō)明、工藝細(xì)節(jié)、服務(wù)說(shuō)明等對(duì)細(xì)節(jié)進(jìn)行展示。五、細(xì)節(jié)圖視覺(jué)優(yōu)化使用簡(jiǎn)單示意圖、形狀或線條來(lái)展示商品參數(shù)，或者使用表格直接展示商品的特性、功能和規(guī)格等，下圖所示為使用簡(jiǎn)單示意圖和簡(jiǎn)單表格來(lái)直接展示商品參數(shù)。（1）商品參數(shù)六、參數(shù)圖視覺(jué)優(yōu)化可以直接將商品參數(shù)展示在一張或多張商品圖片中，如左圖。如果商品參數(shù)較多，也可通過(guò)左表右圖或左圖右表的方式排列商品參數(shù)模塊，如右圖。對(duì)于有尺寸規(guī)格的商品，商家還可在商品圖上添加尺寸標(biāo)注。（2）商品參數(shù)與商品圖片組合展示常用方式：左圖右參數(shù)。01除常用參數(shù)外，還可以輔以產(chǎn)品特點(diǎn)及多個(gè)型號(hào)的參數(shù)，一并說(shuō)明。02同一個(gè)商品有不同的尺寸或規(guī)格。032列構(gòu)圖，一側(cè)圖大，一側(cè)圖小。04三列構(gòu)圖，并排突出中央或錯(cuò)落擺放05四列構(gòu)圖，平分秋色06文字與圖片，S型排列07上圖下字排列08

一側(cè)2圖，一側(cè)1圖，不對(duì)稱構(gòu)圖09兩行或三行均勻構(gòu)圖10環(huán)繞或半環(huán)繞構(gòu)圖11七、資質(zhì)證明及售后服務(wù)保障包括店鋪和商品所獲得的各種認(rèn)證、獎(jiǎng)勵(lì)；資質(zhì)證明一般包括店鋪選用的物流公司、商品售后服務(wù)流程及退換貨規(guī)定等。售后服務(wù)八、關(guān)聯(lián)營(yíng)銷關(guān)聯(lián)營(yíng)銷也稱交叉營(yíng)銷，即一款產(chǎn)品銷售頁(yè)面上除了本身產(chǎn)品的一些信息之外，將同類型或者有關(guān)聯(lián)的產(chǎn)品信息放在上面，實(shí)現(xiàn)多款對(duì)比。在商品詳情頁(yè)中合理的嵌入相關(guān)商品可以起到事半功倍的營(yíng)銷效果。例如：在寶貝描述完以后插入相關(guān)產(chǎn)品、熱賣產(chǎn)品或者配套產(chǎn)品的時(shí)候，可以有效提高點(diǎn)擊率和轉(zhuǎn)化率。概念同類關(guān)聯(lián)跨類關(guān)聯(lián)30品類關(guān)聯(lián)活動(dòng)關(guān)聯(lián)4種形式1.商品關(guān)聯(lián)的形式商品詳情頁(yè)的商品關(guān)聯(lián)模塊可以對(duì)頁(yè)面流量進(jìn)行有效導(dǎo)流。2.商品關(guān)聯(lián)模塊的設(shè)計(jì)樣式根據(jù)當(dāng)前商品的實(shí)際關(guān)聯(lián)需求，商家可以使用不同樣式的關(guān)聯(lián)模塊。31通欄海報(bào)型主次型常規(guī)型1.引起關(guān)注的文案引起關(guān)注的文案主要在店鋪的活動(dòng)頁(yè)面、商品首焦圖等區(qū)域呈現(xiàn)，包括商品核心賣點(diǎn)、商品促銷信息、商品廣告語(yǔ)等。突出消費(fèi)者關(guān)注的核心內(nèi)容，提高消費(fèi)者瀏覽商品核心信息的效率。作用32九、商品詳情頁(yè)的文案應(yīng)用2.引發(fā)興趣的文案引發(fā)興趣的文案可以有效找到并激發(fā)消費(fèi)者對(duì)商品的潛在需求，如說(shuō)明商品的核心賣點(diǎn)、描述商品外觀、描述商品的使用場(chǎng)景等都可以有效引發(fā)消費(fèi)者的興趣，引起消費(fèi)者的購(gòu)買欲望。33343.加深了解的文案加深了解的文案主要用于加深消費(fèi)者對(duì)商品的了解，打消消費(fèi)者對(duì)商品的顧慮，主要運(yùn)用在細(xì)節(jié)圖、包裝圖、參數(shù)圖等位置，進(jìn)一步提高消費(fèi)者對(duì)商品的信任