《跨境電商》課件12.C實習(xí)《跨境電商》課程教學(xué)包：視覺美工

C實習(xí)《跨境電商》課程教學(xué)包12-跨境電商：視覺美工1

教學(xué)目的：通過對產(chǎn)品圖片處理、詳細(xì)頁面圖片的制作及店鋪首頁的裝修，幫助學(xué)生掌握視覺美工的一般工作內(nèi)容。知識要求：1、原始圖片來源2、產(chǎn)品圖片要求3、無線端常見適配問題4、店鋪首頁裝修的基本模塊及第三方板塊技能目標(biāo)：1、能夠進(jìn)行產(chǎn)品原始圖片的處理2、完成店鋪首頁的裝修2

1、產(chǎn)品原始圖片處理2、產(chǎn)品主圖3、產(chǎn)品顏色圖4、產(chǎn)品詳細(xì)頁面圖5、店鋪首頁的裝修教學(xué)內(nèi)容：3

視覺美工產(chǎn)品原始圖片處理——供應(yīng)商提供42025/4/30視覺美工產(chǎn)品原始圖片處理——自己拍攝

52025/4/30視覺美工產(chǎn)品原始圖片處理——專業(yè)攝影師拍攝62025/4/30產(chǎn)品詳情頁面-產(chǎn)品主圖視覺美工產(chǎn)品主圖要求：圖片大?。?00*800，純色或者白底

圖片構(gòu)圖方式：無文字、水印、LOGO、邊框

圖片主題：主體居中，控制拼圖圖片的排序方式72025/4/30產(chǎn)品詳情頁面-產(chǎn)品主圖說明平臺目前關(guān)于主圖的要求視覺美工82025/4/30產(chǎn)品詳情頁面-產(chǎn)品顏色圖視覺美工92025/4/30產(chǎn)品詳情頁面-產(chǎn)品詳情頁圖視覺美工第一：店鋪公告或者活動第二：產(chǎn)品的套餐銷售方式第三：關(guān)聯(lián)銷售方式第四：產(chǎn)品的圖片和文字說明1、文字說明+各顏色圖片2、4張角度圖3、2張細(xì)節(jié)圖第五:測量方式和尺碼表第六：好評的展示第七：店鋪的物流，退換貨政策等等102025/4/30無線端常見適配問題1.圖片適配問題視覺美工解決思路：在代碼中找個整塊的布局，修改widht,改成100%或者不寫112025/4/30無線端常見適配問題2.表格適配問題視覺美工解決思路：Table布局，widht寫成100%或者不寫字體不要過長，單詞與單詞之間用空格122025/4/30無線端常見適配問題3.關(guān)聯(lián)營銷適配問題視覺美工解決思路：在代碼中用div或者Table布局，固定widht,成100%或者不寫132025/4/30無線端常見適配問題4.文字格適配問題視覺美工解決思路：在字體編輯字體的時候，不要固定字體的樣式和大小142025/4/30速賣通設(shè)計部如何管理產(chǎn)品圖片視覺美工頭腦風(fēng)暴152025/4/30圖片銀行管理視覺美工頭腦風(fēng)暴方法：1、圖片銀行分組和產(chǎn)品分組一致2、產(chǎn)品公用的圖片放在一個分組里面，建好子分組3、店鋪裝修的圖片放在一個分組里面，裝修各個模板的圖片，在裝修分組下建立子分組注：產(chǎn)品分組只有設(shè)置到2級分組，圖片銀行分組可以設(shè)置到3級分組，

一個圖片銀行分組只能創(chuàng)建50個分組（多余50個產(chǎn)品，用1、2、3表示）162025/4/30視覺美工店鋪首頁裝修—基本板塊模塊介紹：基礎(chǔ)模塊：（免費的，平臺提供的）圖片店招：一個數(shù)量圖片輪播：6個商品推薦：5個自定義內(nèi)容區(qū)：6個第三方模塊：模塊寬度：1200px，高度：100-150px，可以加入超鏈接：連接店鋪，連接分組，連接產(chǎn)品等等都可以，大?。?M之內(nèi)，格式j(luò)pg，jpeg店招設(shè)計：加入營銷的概念在里面。模塊高度：100-600px，寬度960px最多可以放5張圖，每張圖可以連接，這里很有講究圖片大?。?M之內(nèi)，格式：jpg，jpeg172025/4/30視覺美工模塊標(biāo)題，展示方式（右側(cè)：一行4個，一個5個，左側(cè)：4-20個數(shù)量），商品信息（全部，只展示價格鼠標(biāo)滑過展示全部），推薦方式：自定，手動支持源代碼編輯：自定義的東西很多了知識點：第一：高級模塊和簡單模塊的區(qū)別？第二：模塊的有效期？第三：模塊如何購買？第四：模塊如何利用店鋪首頁裝修—基本板塊商品推薦模塊182025/4/30視覺美工店鋪首頁裝修—第三方板塊（頁頭）192025/4/30視覺美工店鋪首頁裝修—第三方板塊（頁中）202025/4/30視頻課程

視頻課程在線播放：

/article-8078-1.html

212025/4/30課后實訓(xùn)

旺旺裝修之店招設(shè)計：/t