無(wú)線終端詳情頁(yè)的視覺(jué)設(shè)計(jì)與裝修網(wǎng)店美工視覺(jué)設(shè)計(jì)實(shí)戰(zhàn)教程第9章目錄Contents無(wú)線終端詳情頁(yè)設(shè)計(jì)基礎(chǔ)無(wú)線端詳情頁(yè)的設(shè)計(jì)與裝修9.29.1無(wú)線終端詳情頁(yè)模塊裝修9.3實(shí)戰(zhàn)演練9.49.1.1無(wú)線終端詳情頁(yè)的特征30102030405尺寸更小賣點(diǎn)更加精煉場(chǎng)景更加豐富頁(yè)面切換不便頁(yè)面文件的容量更小9.1.2無(wú)線終端詳情頁(yè)的設(shè)計(jì)要點(diǎn)4圖片的體積不能太大，否則容易出現(xiàn)加載緩慢的問(wèn)題，影響消費(fèi)者的購(gòu)物體驗(yàn)，此時(shí)應(yīng)在保證圖片清晰度的同時(shí)壓縮圖片；細(xì)節(jié)圖不能太小，盡量保證清晰度，讓消費(fèi)者能夠看見(jiàn)細(xì)節(jié)詳情，產(chǎn)生購(gòu)買欲望。圖片設(shè)計(jì)要點(diǎn)圖片文字、商品信息和商品描述文字都不能太小，否則容易導(dǎo)致訴求不清。文字設(shè)計(jì)要點(diǎn)想要商品重點(diǎn)突出，就要合理控制頁(yè)面展示的信息量，省略一些無(wú)關(guān)緊要的內(nèi)容，提升消費(fèi)者的購(gòu)物體驗(yàn)。寶貝重點(diǎn)的設(shè)計(jì)設(shè)計(jì)要點(diǎn)目錄Contents無(wú)線終端詳情頁(yè)設(shè)計(jì)基礎(chǔ)無(wú)線端詳情頁(yè)的設(shè)計(jì)與裝修9.29.1無(wú)線終端詳情頁(yè)模塊裝修9.3實(shí)戰(zhàn)演練9.49.2.1無(wú)線終端詳情頁(yè)設(shè)計(jì)6下面我們以護(hù)膚精油為例，講解無(wú)線終端詳情頁(yè)的制作方法。主要運(yùn)用綠葉、玫瑰等元素渲染頁(yè)面，不僅使頁(yè)面整體清新自然，還突出了商品純天然的品質(zhì)，其具體操作步驟如下。制作投影的效果1添加背景與精油素材2輸入文本39.2.1無(wú)線終端詳情頁(yè)設(shè)計(jì)7調(diào)整繪制矩形的大小4添加圖層樣式5輸入產(chǎn)品信息文本69.2.1無(wú)線終端詳情頁(yè)設(shè)計(jì)8添加精油素材繪制圓形879.2.1無(wú)線終端詳情頁(yè)設(shè)計(jì)9添加肌膚素材的效果9修改文本并繪制水平直線109.2.1無(wú)線終端詳情頁(yè)設(shè)計(jì)10繪制圓形并添加素材1112繪制圓形9.2.1無(wú)線終端詳情頁(yè)設(shè)計(jì)11輸入文本13制作產(chǎn)品實(shí)拍的效果149.2.2無(wú)線終端詳情頁(yè)裝修12

無(wú)線終端詳情頁(yè)的裝修方法與計(jì)算機(jī)端類似，首先需要將圖片以符合要求的尺寸與格式進(jìn)行處理，然后上傳到素材中心，最后在無(wú)線終端詳情頁(yè)的裝修頁(yè)面進(jìn)行裝修，其具體操作步驟如下。進(jìn)入無(wú)線端裝修頁(yè)面12詳情裝修9.2.2無(wú)線終端詳情頁(yè)裝修13選擇進(jìn)入寶貝詳情頁(yè)34添加圖片9.2.2無(wú)線終端詳情頁(yè)裝修14選擇圖片56查看裝修效果9.2.3無(wú)線終端模板裝修15使用模板進(jìn)行裝修不僅省時(shí)省力，而且可以保證頁(yè)面整體風(fēng)格一致，得到較好的裝修效果。下面我們使用“淘寶神筆”制作詳情頁(yè)，制作時(shí)將使用編輯模塊的一些操作，如替換模塊的圖片、更改文本、添加模塊、刪除模塊、移動(dòng)模塊等，其具體操作步驟如下。進(jìn)入無(wú)線終端裝修頁(yè)面12選擇新模板9.2.3無(wú)線終端模板裝修1643試用新模板選擇需要套用模板的寶貝詳情頁(yè)9.2.3無(wú)線終端模板裝修1756套用詳情頁(yè)模板后的效果替換海報(bào)圖片9.2.3無(wú)線終端模板裝修1878修改文本預(yù)覽裝修效果預(yù)覽詳情頁(yè)頁(yè)面的裝修效果9目錄Contents無(wú)線終端詳情頁(yè)設(shè)計(jì)基礎(chǔ)無(wú)線端詳情頁(yè)的設(shè)計(jì)與裝修9.29.1無(wú)線終端詳情頁(yè)模塊裝修9.3實(shí)戰(zhàn)演練9.49.3.1基礎(chǔ)模塊裝修20基礎(chǔ)模塊是網(wǎng)店美工裝修商品詳情頁(yè)時(shí)的常用模塊，其中包括了圖片、文字、視頻和動(dòng)圖等基本內(nèi)容，本節(jié)內(nèi)容主要講解動(dòng)圖與文字的裝修，其具體操作步驟如下。選擇動(dòng)圖樣式12選擇文字樣式并修改內(nèi)容選擇進(jìn)入寶貝詳情頁(yè)39.3.1基礎(chǔ)模塊裝修215替換商品圖片替換其他圖片并修改文字49.3.2營(yíng)銷模塊裝修22設(shè)置圖片鏈接1替換活動(dòng)圖片3營(yíng)銷模塊包括店鋪推薦、店鋪活動(dòng)、優(yōu)惠券、直播、群聊等5個(gè)內(nèi)容，其操作都比較簡(jiǎn)單，只需添加后簡(jiǎn)單設(shè)置即可。下面主要介紹店鋪活動(dòng)的裝修，其具體操作步驟如下。2選擇活動(dòng)樣式9.3.3行業(yè)模塊裝修23無(wú)線終端商品詳情頁(yè)裝修為網(wǎng)店美工提供了豐富的行業(yè)模塊，其中包含了寶貝參數(shù)、顏色款式、細(xì)節(jié)材質(zhì)、商品圖片、商品吊牌、品牌介紹、商家公告等基本內(nèi)容，下面主要介紹寶貝參數(shù)和顏色款式的裝修，其具體操作步驟如下。1選擇寶貝參數(shù)樣式9.3.3自定義頁(yè)面裝修243編輯活動(dòng)頭模塊9.3.3自定義頁(yè)面裝修25替換商品圖片29.3.3自定義頁(yè)面裝修263選擇顏色款式樣式45替換商品圖片修改文字目錄Contents無(wú)線終端詳情頁(yè)設(shè)計(jì)基礎(chǔ)無(wú)線端詳情頁(yè)的設(shè)計(jì)與裝修9.29.1無(wú)線終端自定義頁(yè)面裝修9.3實(shí)戰(zhàn)演練9.49.4.1制作無(wú)線終端零食詳情頁(yè)28分析商品，準(zhǔn)備商品詳情頁(yè)相關(guān)素材，根據(jù)首頁(yè)選擇詳情頁(yè)的字體，并搭配色彩。規(guī)劃頁(yè)面中需要設(shè)計(jì)的板塊，根據(jù)展示內(nèi)容的多少設(shè)計(jì)各個(gè)板塊的高度與展示形式。通過(guò)素材的添加、圖形的繪制、文本的輸入，完成本例的制作。

1.設(shè)計(jì)思路9.4.1制作無(wú)線終端零食詳情頁(yè)29網(wǎng)店美工必備的視覺(jué)營(yíng)銷知識(shí)：色彩搭配、圖形元素的應(yīng)用、文本外觀設(shè)計(jì)，以及三者之間的組合搭配。無(wú)線終端零食詳情頁(yè)設(shè)計(jì)要點(diǎn)：圖片的體積不能太大，以保證圖片的清晰度；圖片文字、商品信息和商品描述文字不能太小；商品重點(diǎn)要突出。Photoshop的使用：能夠在Photoshop中快速完成素材添加、圖形繪制、文本輸入與編輯等操作。

2.知識(shí)要點(diǎn)9.4.1制作無(wú)線終端零食詳情頁(yè)30

3.操作步驟下面我們根據(jù)該商品的特征，結(jié)合其賣點(diǎn)制作無(wú)線終端零食詳情頁(yè)，其具體操作步驟如下。1輸入文本添加素材23繪制圓角矩形9.4.1制作無(wú)線終端零食詳情頁(yè)31繪制矩形并添加素材繪制形狀制作“精選食材”頁(yè)頭4569.4.1制作無(wú)線終端零食詳情頁(yè)327輸入食材文本添加素材89制作“匠心烘焙”頁(yè)頭繪制矩形并添加素材1033制作“產(chǎn)品實(shí)拍”頁(yè)頭輸入文本9.4.1制作無(wú)線終端零食詳情頁(yè)1112繪制矩形并添加實(shí)拍素材1334繪制矩形并輸入文本9.4.1制作無(wú)線終端零食詳情頁(yè)14產(chǎn)品實(shí)拍圖效果159.4.2制作返場(chǎng)活動(dòng)頁(yè)35

1.設(shè)計(jì)思路020103確定活動(dòng)主題，收集活動(dòng)主題的渲染素材，以及參加活動(dòng)的商品信息與圖片等內(nèi)容。策劃活動(dòng)內(nèi)容的文案。通過(guò)素材的添加、圖形的繪制、文本的輸入，完成本例的制作。9.4.2制作返場(chǎng)活動(dòng)頁(yè)36網(wǎng)店美工必備的視覺(jué)營(yíng)銷知識(shí)返場(chǎng)活動(dòng)頁(yè)的設(shè)計(jì)要點(diǎn)Photoshop的使用

2.知識(shí)要點(diǎn)一三二9.4.2制作返場(chǎng)活動(dòng)頁(yè)37

3.操作步驟下面我們將根據(jù)提供的化妝品素材制作返場(chǎng)活動(dòng)頁(yè)，其具體操作步驟如下。12添加彩帶繪制漸變矩形3繪制并復(fù)制矩形9.4.2制作返場(chǎng)活動(dòng)頁(yè)384輸入文本并繪制矩形繪制標(biāo)簽圖形59.4.2制作返場(chǎng)活動(dòng)頁(yè)396添加素材與投影制作漸變疊加效果79.4.2