網(wǎng)店裝修項(xiàng)目六 設(shè)計(jì)商品描述頁(yè)課件

1、網(wǎng)店裝修項(xiàng)目六 設(shè)計(jì)商品描述頁(yè)重慶大學(xué)出版社項(xiàng)目綜述在經(jīng)營(yíng)的過(guò)程中，小寶發(fā)現(xiàn)一個(gè)店鋪要發(fā)展起來(lái)，除了商品質(zhì)量要有競(jìng)爭(zhēng)力外，網(wǎng)店的產(chǎn)品頁(yè)面也很重要。開(kāi)網(wǎng)店，怎樣才能讓轉(zhuǎn)化率保持一個(gè)上升的態(tài)勢(shì)?這不僅需要從內(nèi)功做起，商品描述頁(yè)的優(yōu)化也很重要。商品描述頁(yè)(網(wǎng)店的產(chǎn)品頁(yè)面)體現(xiàn)的是一個(gè)店鋪產(chǎn)品的內(nèi)在美，是架起消費(fèi)者與產(chǎn)品接觸的橋梁，起著舉足輕重的作用。在不斷的實(shí)踐中，小寶看到別人的網(wǎng)店商品描述頁(yè)不是看不到產(chǎn)品的介紹，就是硬把全店所有的產(chǎn)品都陳列在頁(yè)面中，不但讓人產(chǎn)生視覺(jué)上的疲勞，還會(huì)影響網(wǎng)速和流量。如何設(shè)計(jì)商品描述頁(yè)？除了設(shè)計(jì)上要做到美化外，更重要的是對(duì)內(nèi)容排版的規(guī)劃，而規(guī)劃最重要的一點(diǎn)就是要有連貫性

2、，要一步一步地引導(dǎo)顧客去購(gòu)買(mǎi)。因此，小寶團(tuán)隊(duì)根據(jù)本店商品的特點(diǎn)重新設(shè)計(jì)了商品描述頁(yè)。項(xiàng)目任務(wù)任務(wù)一任務(wù)二任務(wù)三設(shè)計(jì)商品描述頁(yè)模板套用商品描述模板編輯商品描述頁(yè)知識(shí)點(diǎn)任務(wù)一了解商品描述頁(yè)構(gòu)成結(jié)構(gòu)學(xué)習(xí)商品描述頁(yè)設(shè)計(jì)流程能在網(wǎng)上收集設(shè)計(jì)素材能夠自行使用Photoshop軟件設(shè)計(jì)和制作出配色和布局合理的商品描述頁(yè)設(shè)計(jì)商品描述頁(yè)模板設(shè)計(jì)商品描述頁(yè)模板了解商品描述頁(yè)了解商品描述頁(yè)商品描述頁(yè)就是對(duì)商品進(jìn)行詳細(xì)描述，激發(fā)顧客的消費(fèi)欲望，樹(shù)立顧客對(duì)店鋪的信任感，打消顧客的消費(fèi)疑慮，促使顧客下單。商品描述頁(yè)是提高轉(zhuǎn)化率的入口，優(yōu)化商品描述頁(yè)對(duì)轉(zhuǎn)化率有提升的作用，但是起決定性作用的還是商品本身。特別要注意的是，由于

3、顧客不能真實(shí)體驗(yàn)產(chǎn)品，商品描述頁(yè)是要打消買(mǎi)家顧慮，要從顧客的角度出發(fā)，關(guān)注最重要的幾個(gè)方面，并不斷強(qiáng)化。告訴顧客我是做這個(gè)的專(zhuān)家、我很值得信賴(lài)、買(mǎi)家買(mǎi)了都說(shuō)好、正好店鋪有活動(dòng)、現(xiàn)在下單價(jià)格最優(yōu)、明日即刻漲價(jià)。詳情頁(yè)的描述基本遵循以下順序：引發(fā)興趣；激發(fā)潛在需求；贏得消費(fèi)信任；替顧客作決定。1.商品描述頁(yè)簡(jiǎn)介了解商品描述頁(yè)了解商品描述頁(yè)(1)基礎(chǔ)描述欄目。主要是提供買(mǎi)家最需要了解的基本信息。例如商品展示、商品描述、快遞說(shuō)明、售后服務(wù)、商品參數(shù)、商品報(bào)價(jià)、購(gòu)買(mǎi)須知、退換說(shuō)明、聯(lián)系方式、尺寸相關(guān)、測(cè)量方法、模特展示、細(xì)節(jié)展示、購(gòu)物流程、支付方式等。(2)強(qiáng)化增值欄目。主要是提供更多的信息增強(qiáng)商品描述

4、的說(shuō)服力，提高店鋪的品牌感、專(zhuān)業(yè)感，讓買(mǎi)家更放心地購(gòu)買(mǎi)，同時(shí)減少咨詢(xún)量。例如效果展示、設(shè)計(jì)手稿、品牌故事、關(guān)于我們、產(chǎn)品知識(shí)、公司榮譽(yù)、鑒別方法、洗滌建議、使用方法、保養(yǎng)方法、授權(quán)證書(shū)、質(zhì)檢證書(shū)、顧客評(píng)價(jià)等。(3)營(yíng)銷(xiāo)刺激欄目。主要是為買(mǎi)家提供更多的產(chǎn)品選擇，擴(kuò)大購(gòu)買(mǎi)范圍，增加成交機(jī)會(huì)。例如熱賣(mài)推薦、相關(guān)商品、搭配套餐、新品推介、好評(píng)推介等。設(shè)計(jì)商品描述頁(yè)模板設(shè)計(jì)商品描述頁(yè)模板步驟1.執(zhí)行“文件”“新建”菜單命令，設(shè)置彈出的“新建”對(duì)話框，點(diǎn)擊“確定”按鈕即可創(chuàng)建一個(gè)新的空白文件。設(shè)計(jì)商品描述頁(yè)模板步驟2.執(zhí)行“文件”“打開(kāi)”菜單命令，在彈出的對(duì)話框中打開(kāi)素材“練習(xí)素材項(xiàng)目6sc6-1.psd

5、”，使用“移動(dòng)工具”，將其拖動(dòng)到背景圖中，生成“圖層1”。設(shè)計(jì)商品描述頁(yè)模板設(shè)計(jì)商品描述頁(yè)模板步驟3.新建“圖層2”,選擇“矩形工具”和“橢圓工具”繪制圖形，使用前景色(R:0,G:0,B:0)填充。設(shè)計(jì)商品描述頁(yè)模板步驟4.使用“橫排文字工具”，設(shè)置字體為“Adobe 黑體 std”和適當(dāng)?shù)淖痔?hào)，在圖形上輸入文字，效果如圖6.1.4所示。步驟5.使用相同的方法，繪制商品描述頁(yè)模板。設(shè)計(jì)商品描述頁(yè)模板設(shè)計(jì)商品描述頁(yè)模板步驟6.新建“圖層5”，選擇“矩形選框工具”繪制矩形，使用前景色(R:108,G:90,B:86)填充。使用相同的方法，新建“圖層6”繪制相同的矩形填充顏色(R:64,G:56,

6、B:54)。設(shè)計(jì)商品描述頁(yè)模板步驟7.選擇“圖層6”，使用矩形選區(qū)，選擇“多邊形套索工具”，選中右側(cè)部分區(qū)域并按刪除鍵刪除，使用“移動(dòng)工具”，將圖形與“圖層5”中的矩形從左側(cè)對(duì)齊重合。設(shè)計(jì)商品描述頁(yè)模板設(shè)計(jì)商品描述頁(yè)模板步驟8.使用“橫排文字工具”，設(shè)置字體為“華文琥珀”“華文細(xì)黑”和適當(dāng)?shù)淖痔?hào)，在圖形上輸入文字。設(shè)計(jì)商品描述頁(yè)模板步驟9.使用相同的方法，繪制商品描述頁(yè)模板。設(shè)計(jì)商品描述頁(yè)模板知識(shí)點(diǎn)任務(wù)二套用商品描述模板了解商品描述頁(yè)構(gòu)成結(jié)構(gòu)學(xué)習(xí)商品描述頁(yè)設(shè)計(jì)流程能在網(wǎng)上收集設(shè)計(jì)素材能夠自行使用Photoshop軟件設(shè)計(jì)和制作出配色和布局合理的商品描述頁(yè)情景設(shè)計(jì)小寶認(rèn)為在設(shè)計(jì)商品描述頁(yè)時(shí)要站在

7、消費(fèi)者的角度，需要我們換位思考，弄清顧客最關(guān)心的內(nèi)容，把顧客最感興趣的內(nèi)容展示或描述出來(lái)。例如，服裝銷(xiāo)售，顧客最關(guān)心的是自己穿上去的真實(shí)效果，以及衣服的質(zhì)地和設(shè)計(jì)細(xì)節(jié)。這時(shí)，如果在商品描述頁(yè)放上模特展示效果圖，就比單純的實(shí)物平面圖更吸引人。因此，在套用商品描述模板時(shí)可以根據(jù)具體的商品進(jìn)行刪減，設(shè)計(jì)思路和風(fēng)格主題要明確，富有個(gè)性，突出店鋪的特色。要做到這點(diǎn)，必須先做好規(guī)劃和定位。套用商品描述模板品牌展示品牌展示步驟1.打開(kāi)上一任務(wù)制作的商品描述頁(yè)模板，執(zhí)行“文件”“打開(kāi)”菜單命令，在彈出的對(duì)話框中同時(shí)打開(kāi)素材“練習(xí)素材項(xiàng)目6sc62.psd”和“練習(xí)素材項(xiàng)目6sc63.psd”。使用“移動(dòng)工具”

8、，將素材拖動(dòng)到模板中，并擺放好位置，效果如圖所示。套用商品描述模板添加商品信息添加商品信息步驟1.接上一活動(dòng)，執(zhí)行“文件”“打開(kāi)”菜單命令，在彈出的對(duì)話框中打開(kāi)素材“練習(xí)素材項(xiàng)目6sc6-6.psd”，使用“移動(dòng)工具”，將其拖動(dòng)到商品信息欄目下方。步驟2.為了突出主題，特為襯衫設(shè)計(jì)了一個(gè)背景，執(zhí)行“文件”“打開(kāi)”菜單命令，在彈出的對(duì)話框中打開(kāi)素材“練習(xí)素材項(xiàng)目6sc6-7.psd”，使用“移動(dòng)工具”，將其拖動(dòng)到商品信息欄目下方的左側(cè)。套用商品描述模板尺寸展示尺寸展示步驟.在“尺寸展示”模塊中插入素材“練習(xí)素材項(xiàng)目6sc6-9.psd”，使用 “移動(dòng)工具”調(diào)整位置。套用商品描述模板展示模特展示模

9、特步驟1.執(zhí)行“文件”“打開(kāi)”菜單命令，在彈出的對(duì)話框中打開(kāi)素材“練習(xí)素材項(xiàng)目6sc6-10.psd”，使用“移動(dòng)工具”，將其拖動(dòng)到“模特展示”模塊中。步驟2.新建圖層，使用“多邊形套索工具”繪制不規(guī)則選區(qū)，使用前景色(R:201,G:204,B:213)填充，并放在合適的位置上。套用商品描述模板展示模特展示模特步驟3.復(fù)制上面的圖層，按快捷鍵“Ctrl+T”，調(diào)出自由變換控制框?qū)D形進(jìn)行水平翻轉(zhuǎn)，并放在合適的位置上。步驟4.執(zhí)行“文件”“打開(kāi)”菜單命令，在彈出的對(duì)話框中打開(kāi)素材“練習(xí)素材項(xiàng)目6sc611.psd”，使用“移動(dòng)工具”，將其拖動(dòng)到背景圖中，如圖6.2.12所示。套用商品描述模板展

10、示模特展示模特步驟5.執(zhí)行“文件”“打開(kāi)”菜單命令，在彈出的對(duì)話框中打開(kāi)素材“練習(xí)素材項(xiàng)目6sc6-12.psd”，使用“移動(dòng)工具”，將其拖動(dòng)到背景圖中，單擊“添加圖層樣式”按鈕，在彈出的“描邊”命令對(duì)話框中，設(shè)置描邊大小為4個(gè)像素，顏色值(R:201,G:204,B:213) 。步驟6.使用“橫排文字工具”，設(shè)置字體為“Arial”和設(shè)置適當(dāng)?shù)淖痔?hào)，在圖形上輸入相應(yīng)文字。套用商品描述模板顏色展示顏色展示步驟1.新建圖層，使用“矩形選框工具”繪制矩形選區(qū)，使用前景色(R:117,G:117,B:117)填充，并放在合適的位置上。步驟2.新建圖層，使用“矩形選框工具”繪制矩形選區(qū)，選擇“漸變工具”，在工具選項(xiàng)欄中單擊“線性漸變”按鈕，在彈出的對(duì)話框中編輯漸變的顏色，然后由上向下拖拽鼠標(biāo)添加漸變。套用商品描述模板顏色展示顏色展示步驟3.復(fù)制多個(gè)矩形，擺放效果如圖所示。步驟4.執(zhí)行“文件”“打開(kāi)”菜單命令，在彈出的對(duì)話框中打開(kāi)素材“練習(xí)素材項(xiàng)目6sc6-13.psd、sc6-14.psd、sc6-15.psd和sc6-16.psd”，使用“移動(dòng)工具”，將其拖動(dòng)到背景圖中。步驟5.使用“橫排文字工具”，設(shè)置適當(dāng)?shù)淖煮w和字號(hào)，在圖形上輸入相應(yīng)文字。情景