《網(wǎng)店美工與視覺設(shè)計(jì)》電子教案PAGEPAGE27第1章認(rèn)識(shí)網(wǎng)店美工教學(xué)內(nèi)容一、了解網(wǎng)店美工二、網(wǎng)店美工工作準(zhǔn)備三、網(wǎng)店美工工作流程教學(xué)要求【知識(shí)目標(biāo)】1.了解網(wǎng)店美工的工作范疇；2.了解網(wǎng)店美工必備技能要求。【技能目標(biāo)】1.掌握網(wǎng)店美工所需要軟件的安裝方法；2.掌握網(wǎng)店美工需要做的準(zhǔn)備工作。教學(xué)重點(diǎn)掌握網(wǎng)店美工的工作流程教學(xué)難點(diǎn)能夠熟練地搜集素材、尋找設(shè)計(jì)參考。教學(xué)方法講授法、練習(xí)法課時(shí)數(shù)4課時(shí)教學(xué)內(nèi)容1.1了解網(wǎng)店美工1.1.1網(wǎng)店美工的工作范疇網(wǎng)店美工是隨著電子商務(wù)的發(fā)展而產(chǎn)生的一種新職業(yè)，是淘寶、天貓、京東等一系列網(wǎng)店頁面設(shè)計(jì)美化人員的統(tǒng)稱，也是網(wǎng)店運(yùn)營(yíng)過程中一個(gè)非常重要的崗位。網(wǎng)店美工主要工作內(nèi)容是對(duì)網(wǎng)店頁面進(jìn)行設(shè)計(jì)和美化，制作商品主圖和詳情頁、設(shè)計(jì)各類活動(dòng)海報(bào)、裝修與美化店鋪首頁等。1.1.2網(wǎng)店美工的技能要求首先需要具備一定的平面構(gòu)成知識(shí)，同時(shí)能夠熟練使用Photoshop、Dreamweaver、Illustrator等設(shè)計(jì)應(yīng)用軟件。其次，網(wǎng)店美工需要掌握一定的營(yíng)銷知識(shí)，了解消費(fèi)者心理，能夠通過圖片、文字等視覺語言，表現(xiàn)出產(chǎn)品的獨(dú)特賣點(diǎn)，讓消費(fèi)者感知到產(chǎn)品的優(yōu)勢(shì)。從運(yùn)營(yíng)的角度分析和思考問題，以提升設(shè)計(jì)作品的點(diǎn)擊率和店鋪轉(zhuǎn)化率。1.1.3資源下載平臺(tái)1.花瓣網(wǎng)2.站酷網(wǎng)3.千圖網(wǎng)1.2網(wǎng)店美工工作準(zhǔn)備1.2.1常用工作軟件1.AdobePhotoshop2.AdobeDreamweaver3.AdobeIllustrator1.2.2常用字體安裝在選擇字體的時(shí)候一定要注意字體的版權(quán)問題，避免不必要的糾紛，本文推薦兩類免費(fèi)商用字體，分別是思源字體和阿里巴巴普惠體。除了上文中推薦的兩類免費(fèi)商用字體，如果需要下載更多的免費(fèi)商用字體，可以通過“100”網(wǎng)站（/）進(jìn)行下載。字體的一般安裝方法：打開電腦的C盤，選擇windows文件夾，選擇Fonts文件夾，把下載好的字體直接粘貼進(jìn)來即可。1.2.3素材庫(kù)建設(shè)素材庫(kù)一般分為兩個(gè)部分：靈感文件和素材文件。靈感文件，即對(duì)優(yōu)秀設(shè)計(jì)案例、作品的收集，網(wǎng)店美工在開始自己的設(shè)計(jì)前，往往需要參考、研究這些案例，提高設(shè)計(jì)效率。素材文件，就是在設(shè)計(jì)過程中需要引用的已經(jīng)處理好的圖片、源文件、字體、特效等等。1.3網(wǎng)店美工工作流程1.3.1做好前期工作網(wǎng)店美工接到設(shè)計(jì)任務(wù)時(shí)，應(yīng)該先和店鋪的相關(guān)人員進(jìn)行溝通，了解店鋪定位，熟悉店鋪與商品，為設(shè)計(jì)工作做好準(zhǔn)備。美工的前期溝通工作主要是和客戶或者運(yùn)營(yíng)進(jìn)行溝通。1.3.2規(guī)劃素材設(shè)計(jì)中用到的素材可以通過素材網(wǎng)站來查找和收集，如前面提到的千圖網(wǎng)、昵圖網(wǎng)、花瓣網(wǎng)等。1.3.3設(shè)計(jì)并制作美工作品規(guī)劃好素材后，可以使用相關(guān)處理軟件來進(jìn)行圖片的美化處理，完成網(wǎng)店中各個(gè)頁面的視覺設(shè)計(jì)。圖片的制作和美化處理主要通過Photoshop軟件來完成，視頻素材則需要利用視頻剪輯軟件Premiere進(jìn)行編輯。對(duì)圖片添加熱點(diǎn)可以使用網(wǎng)頁編輯軟件Dreamweaver，也可以使用在線熱點(diǎn)編輯工具。圖片制作完成后需要上傳到圖片空間，網(wǎng)店圖片空間是在店鋪中上傳和發(fā)布照片的必要“中轉(zhuǎn)站”。歸納與提高本章主要介紹了網(wǎng)店美工入門的基礎(chǔ)知識(shí)、工作準(zhǔn)備、工作流程等，通過本章內(nèi)容的學(xué)習(xí)，讀者應(yīng)該對(duì)網(wǎng)店美工的工作職能及工作技能有基本認(rèn)識(shí)，掌握開展設(shè)計(jì)工作之前需要做的準(zhǔn)備工作，明確美工的工作流程。第2章商品圖片的處理與美化教學(xué)內(nèi)容一、商品圖片尺寸的調(diào)整二、修復(fù)圖片顏色三、商品圖片的美化與修飾四、摳圖技巧五、拍攝原圖后期綜合處理教學(xué)要求【知識(shí)目標(biāo)】1．了解商品圖片的要求；2．了解圖片修飾的必要性；3．掌握提高圖片亮度與鮮艷度的方法；4．掌握網(wǎng)店中常用的商品圖片尺寸，以及調(diào)整、裁剪、校正圖片的方法；5．掌握處理圖片污點(diǎn)、修復(fù)瑕疵以及虛化背景的方法；6．掌握扣取不同類型的圖片以及合成素材的方法?！炯寄苣繕?biāo)】1．能夠處理圖片污點(diǎn)、修復(fù)瑕疵；2．能夠?qū)ι唐穲D像進(jìn)行摳圖處理；3．能夠?qū)ζ?、偏亮和偏色的圖片進(jìn)行調(diào)色；4．能夠調(diào)整商品圖片尺寸。教學(xué)重點(diǎn)1．掌握調(diào)整色差的方法；2．掌握不同類型圖片的摳圖方法；3．掌握?qǐng)D片的修飾與美化的方法。教學(xué)難點(diǎn)調(diào)整色差的方法教學(xué)方法講授法、練習(xí)法課時(shí)數(shù)6課時(shí)教學(xué)內(nèi)容2.1Photoshop軟件的基本操作2.1.1認(rèn)識(shí)Photoshop的工作界面Photoshop的基礎(chǔ)工作界面，包括了菜單欄、選項(xiàng)欄、工具箱、圖像編輯區(qū)域、控制面板等模塊。2.1.2調(diào)整PS的界面視圖1.切換商品圖像顯示模式在處理圖像的過程中，為了方便操作，可以通過切換圖像的顯示模式來查看圖像。選擇“視圖>屏幕模式”命令，在彈出的菜單中包括標(biāo)準(zhǔn)全屏模式、帶有菜單欄的全屏模式、全屏模式三種顯示模式。2.調(diào)整商品圖像顯示比例ctrl加“+”圖像放大顯示，ctrl加“-”，圖像縮小顯示。按住ctrl鍵同時(shí)，配合鍵盤上的數(shù)字0鍵，還原圖像原大小。要調(diào)整圖像的顯示狀態(tài)，也可在狀態(tài)欄中直接輸入顯示比例，如輸入200%，則圖像以200%的比例顯示。3.移動(dòng)商品圖像顯示畫面在使用工具處理圖像的過程中，若圖像顯示比例過大，沒有顯示全部的圖像畫面時(shí)，可以使用抓手工具對(duì)圖像畫面進(jìn)行移動(dòng)，查看圖像的不同區(qū)域。抓手工具的快捷鍵是空格鍵，按住空格鍵時(shí)，可臨時(shí)切換為抓手工具，此時(shí)配合鼠標(biāo)移動(dòng)至需要停留的圖像部分。2.1.3應(yīng)用PS的輔助工具1.顯示商品圖像標(biāo)尺使用標(biāo)尺可以在處理圖像時(shí)精確定位鼠標(biāo)指針的位置，選擇“視圖>標(biāo)尺”命令或按ctrl+R組合鍵，可以顯示或隱藏標(biāo)尺。Photoshop軟件提供多種標(biāo)尺單位，可在“編輯>首選項(xiàng)>單位與標(biāo)尺”命令中進(jìn)行更改。2.編輯商品圖像參考線選擇“視圖>鎖定參考線、清除參考線、添加參考線”命令，可以對(duì)參考線進(jìn)行相應(yīng)操作。3.設(shè)置網(wǎng)格線設(shè)置網(wǎng)格線可以幫助美工在繪制形狀等操作時(shí)準(zhǔn)確定位，選擇“視圖>顯示>網(wǎng)格”命令，可以顯示或隱藏網(wǎng)格，選擇“編輯>首選項(xiàng)>參考線、網(wǎng)格和切片”命令，打開“首選項(xiàng)”對(duì)話框，在此對(duì)話框中可對(duì)參考線和網(wǎng)格的相關(guān)參數(shù)進(jìn)行設(shè)置。2.1.4圖像文件的基本操作1.新建空白圖像文件啟動(dòng)軟件后，選擇“文件>新建”命令，或者使用快捷鍵ctrl+N，可以創(chuàng)建一個(gè)圖像文件，在“新建文檔”對(duì)話框可以設(shè)置圖像名稱、圖像尺寸、分辨率、顏色等，設(shè)置完后單擊“創(chuàng)建”即可創(chuàng)建圖像。2.打開商品圖像文件在編輯圖像前，需要先打開圖像文件，選擇“文件>打開”命令，或使用快捷鍵ctrl+O，在“打開”對(duì)話框選擇需要打開的文件，單擊打開按鈕即可打開指定的圖像文件。3.保存商品圖像文件編輯完圖像后，需要對(duì)其進(jìn)行保存，以便于下次打開繼續(xù)操作，選擇“文件>存儲(chǔ)”命令，或使用快捷鍵ctrl+s，可以存儲(chǔ)文件。4.關(guān)閉圖像文件將圖像文件儲(chǔ)存后，可以將其關(guān)閉。點(diǎn)擊圖像窗口標(biāo)題欄上的“關(guān)閉”按鈕，或選擇“文件>關(guān)閉”命令，都可以關(guān)閉當(dāng)前的圖像文件。2.2修復(fù)圖片顏色實(shí)際拍攝中，拍攝效果會(huì)很大程度上受到光線的影響，比如陰天和晴天拍攝出的效果不同，順光和逆光拍攝出的效果也不同。一般來講，如果拍攝中光線設(shè)置不合理，會(huì)出現(xiàn)曝光過度、曝光不足和色差現(xiàn)象，這就需要對(duì)圖片的顏色進(jìn)行后期的校正處理，使得圖片中的商品效果能接近真實(shí)效果。2.2.1調(diào)整存在曝光問題的圖片對(duì)于存在曝光問題的圖片，除了使用Photoshop軟件的“曝光度”命令進(jìn)行調(diào)節(jié)之外，還可以通過調(diào)節(jié)“色階”、“曲線”、“亮度/對(duì)比度”等命令來處理。1.使用“色階”調(diào)整圖像2.使用“曲線”調(diào)整圖像3.使用“亮度/對(duì)比度”調(diào)整圖像2.2.調(diào)整有色差的圖片網(wǎng)絡(luò)商品圖片雖然要給予顧客美的視覺享受，但更重要的是真實(shí)反映商品詳情，避免因?yàn)樯町a(chǎn)生的退貨和糾紛，下面介紹調(diào)整色差的方法。1.使用“自動(dòng)顏色”調(diào)整色差2.使用“可選顏色”調(diào)整色差2.3商品圖片的摳取2.3.1規(guī)則圖形摳圖對(duì)于一些形狀比較規(guī)則的圖片，因其往往具有簡(jiǎn)單的線條輪廓，如矩形、三角形等，非常適合使用多邊形套索工具。2.3.2扣取背景簡(jiǎn)單的商品圖片純色背景圖像的摳圖操作最簡(jiǎn)單，因此很多商家在拍攝完商品場(chǎng)景圖后，都會(huì)特意拍一些純色背景圖，以方便后期摳圖。對(duì)純色背景圖像摳圖時(shí)，一般使用“魔棒工具”，調(diào)整合適的容差值后，只需用“魔棒工具”單擊背景，即可一鍵選中背景，刪除背景或者反選，均可實(shí)現(xiàn)摳圖效果。2.3.3摳取圖形復(fù)雜的商品圖片對(duì)于商品主體形狀比較復(fù)雜、背景比較凌亂的圖像，如果主體邊緣清晰，則可使用磁性套索工具實(shí)現(xiàn)快速摳圖。若邊緣不清晰，則需要使用鋼筆工具來摳取。本例將打開“保溫杯.jpg”素材，綜合應(yīng)用磁性套索工具和鋼筆工具實(shí)現(xiàn)快速摳圖。2.4商品圖片的美化與修飾商品圖片拍攝前需要布光和布景，還需要對(duì)商品本身進(jìn)行精細(xì)處理，以此保證拍攝作品的美觀性。盡管如此，圖片中依然會(huì)出現(xiàn)一些細(xì)小的瑕疵，比如污點(diǎn)、褶皺、污漬等情況，偶爾還會(huì)出現(xiàn)模糊的情況，這些情況可以通過Photoshop的修復(fù)類工具進(jìn)行修復(fù)和美化。2.4.1修復(fù)圖像中的污點(diǎn)修復(fù)圖像中的污點(diǎn)最適合使用Photoshop中的污點(diǎn)修復(fù)畫筆工具，操作簡(jiǎn)單方便，只需要用污點(diǎn)修復(fù)畫筆工具點(diǎn)擊污點(diǎn)處即可，軟件會(huì)自動(dòng)用筆頭周圍的顏色填充污點(diǎn)處的顏色。2.4.2使用仿制圖章工具修復(fù)圖片仿制圖章工具可以從圖像中復(fù)制信息，將其應(yīng)用到其他區(qū)域或者其他圖像中，是圖像修復(fù)中最常用的工具之一。2.4.3使用修補(bǔ)工具修復(fù)圖片修補(bǔ)工具是使用圖片中某些特定的區(qū)域來替換需要修補(bǔ)的區(qū)域，它會(huì)將源區(qū)域和目標(biāo)區(qū)域的紋理、明暗等相匹配，修補(bǔ)工具是使用最頻繁的修復(fù)工具之一。2.4.4調(diào)整模糊的圖片商品拍攝時(shí)，如果出現(xiàn)手抖，拍攝出來的圖片會(huì)模糊。圖片被反復(fù)縮小或者放大以后，其畫質(zhì)會(huì)受到影響，若圖片細(xì)節(jié)變得模糊，可通過銳化工具進(jìn)行調(diào)整，將圖像變清晰。2.5商品圖片尺寸的調(diào)整2.5.1商品拍攝原圖的裁剪商品圖片拍攝完成后，原圖尺寸并不符合店鋪裝修需求，此時(shí)需要對(duì)圖片尺寸進(jìn)行調(diào)整。一般而言，拍攝的原圖四周有較多的留白，為了突出商品主體，常使用裁剪的方法修改圖像。2.5.2調(diào)整商品圖片的尺寸修改圖片尺寸時(shí)，要注意修改“畫布大小”和“圖像大小”的區(qū)別。畫布大小是指整張畫布的長(zhǎng)和寬，是尺子能夠量到的物理尺寸，而圖像大小是指在這張畫布里有多少像素。簡(jiǎn)單來說，畫布大小就是畫紙大小，圖像大小就是畫紙上圖的大小。改變畫布大小就是改變畫紙的大小，而改變圖像大小是改變畫紙上圖像的比例。歸納與提高本章介紹了網(wǎng)店美工修復(fù)和美化圖片的常用操作方法和技巧，主要包括圖片尺寸的調(diào)整、顏色的修復(fù)、圖片美化與修飾、不同類型商品圖片的摳圖方法。第3章電商視覺設(shè)計(jì)的基本要素教學(xué)內(nèi)容一、視覺設(shè)計(jì)中色彩的應(yīng)用二、視覺設(shè)計(jì)中文字的應(yīng)用三、視覺設(shè)計(jì)中的排版構(gòu)圖四、常用的視覺設(shè)計(jì)技巧五、視覺設(shè)計(jì)元素綜合應(yīng)用教學(xué)要求【知識(shí)目標(biāo)】1.了解必備視覺設(shè)計(jì)知識(shí)；2.掌握色彩的基本原理及應(yīng)用技巧；3.了解設(shè)計(jì)作品中的文字應(yīng)用；4.了解視覺構(gòu)圖的常用方法?！炯寄苣繕?biāo)】1.能夠根據(jù)網(wǎng)店定位和產(chǎn)品風(fēng)格，對(duì)網(wǎng)店頁面進(jìn)行合理的色彩搭配；2.能夠根據(jù)設(shè)計(jì)風(fēng)格熟練的選擇合適字體；3.能夠?qū)撁孢M(jìn)行布局，增強(qiáng)頁面的可讀性和美感。教學(xué)重點(diǎn)1.理解必備視覺設(shè)計(jì)知識(shí)；2.掌握不同色相的情感屬性及配色方法；3.掌握設(shè)計(jì)作品中字體的選擇與文字的排版；4.掌握常用的視覺構(gòu)圖方法。教學(xué)難點(diǎn)主色的選擇。對(duì)比的應(yīng)用。教學(xué)方法講授法、案例法、練習(xí)法課時(shí)數(shù)6課時(shí)教學(xué)內(nèi)容3.1設(shè)計(jì)中的色彩3.1.1色彩的基本原理1．色相色相，即色彩的相貌稱謂，能夠比較準(zhǔn)確地表示某種色彩的名稱，如紅、橙、黃、綠等。2．明度明度又稱為色彩的亮度，指色彩的明暗程度。不同色彩的明度有所不同，其中，黃色明度最高，紫色明度最低。3．飽和度飽和度也稱為純度，指色彩的鮮艷程度，光波成分約單純，飽和度越高。3.1.2認(rèn)識(shí)色調(diào)色調(diào)是指一幅作品色彩外觀的基本傾向。在明度、純度、色相這三個(gè)要素中，某種因素起主導(dǎo)作用，就稱之為某種色調(diào)。色彩分為無彩色和有彩色，色調(diào)也由無彩色和有彩色構(gòu)成。所謂無彩色，顧名思義就是沒有色相的色彩，包括黑白以及介于二者之間的灰。有彩色就是指有色相的色彩，除黑白灰以外的色彩都是有彩色。3.1.3色彩感覺設(shè)計(jì)應(yīng)用不同的色彩有著不同的寓意與作用，當(dāng)人們看到色彩時(shí)，除了會(huì)感受到其物理方面的影響，也會(huì)給人帶來不一樣的心理感受與聯(lián)想，每種色相都有其獨(dú)特的情感。紅色橙色黃色綠色藍(lán)色紫色3.1.4色彩的搭配方法1.同類色配色2.鄰近色配色3.對(duì)比色配色4.互補(bǔ)色配色3.1.5色彩比例控制美工作品的色彩應(yīng)用應(yīng)遵循“總體協(xié)調(diào)，局部對(duì)比”的原則，日本設(shè)計(jì)師提出了配色的黃金比例：70%主色，25%輔助色，5%點(diǎn)綴色。3.2設(shè)計(jì)中的文字3.2.1字體的性格特征1.黑體2.宋體3.圓體4.書法體3.2.2字體的高級(jí)使用技巧1.男性化的字體2.女性化字體3.促銷字體4.中國(guó)風(fēng)字體5.可愛字體6.文藝字體7.奢華風(fēng)字體3.2.3文字編排的基本原則1.左對(duì)齊2.右對(duì)齊3.居中對(duì)齊3.2.4文字排版設(shè)計(jì)技巧善用對(duì)比巧用形狀3.3視覺設(shè)計(jì)中的排版構(gòu)圖排版構(gòu)圖是設(shè)計(jì)師從混亂的視覺元素中找到條理性，幫助顧客在各個(gè)視覺元素之間建立聯(lián)系，從而幫助顧客在閱讀中獲取重要信息。1.有助于重要信息的傳遞2.加強(qiáng)視覺效果的張力3.3.1視覺構(gòu)圖的作用視覺構(gòu)圖首先有助于重要信息的傳遞，好的構(gòu)圖和色彩一樣，使表達(dá)的內(nèi)容更加突出，讓顧客快速抓住中心點(diǎn)。其次，合理的構(gòu)圖能加強(qiáng)視覺效果的張力。通過改變視覺元素的位置、大小、顏色，加強(qiáng)視覺的張力，增加設(shè)計(jì)的趣味性。3.3.2常見構(gòu)圖形式1.左右構(gòu)圖2.中心構(gòu)圖3.并置型構(gòu)圖4.對(duì)角線構(gòu)圖5.黃金分割構(gòu)圖歸納與提高本章節(jié)從色彩的應(yīng)用、字體的選擇、排版的技巧、空間感營(yíng)造和點(diǎn)線面應(yīng)用等方面介紹了網(wǎng)店美工必需掌握的視覺設(shè)計(jì)元素。在色彩的應(yīng)用方面，介紹了色彩的三要素，即明度、飽和度、色相。此外，還包括色彩心理和各種常用的配色方案，以及配色的比例；在文字的應(yīng)用方面，介紹了常用字體的性格特征和字體編排的原則；在版式設(shè)計(jì)方面，介紹了頁面構(gòu)圖的作用和常用的構(gòu)圖形式。第4章店鋪Logo與主圖的視覺設(shè)計(jì)教學(xué)內(nèi)容Logo的視覺設(shè)計(jì)主圖的視覺設(shè)計(jì)專題頁面的視覺設(shè)計(jì)教學(xué)要求【知識(shí)目標(biāo)】1.了解Logo的定義、類型；2.理解Logo的設(shè)計(jì)規(guī)范；3.掌握Logo的設(shè)計(jì)思路與推銷方法；4.理解主圖的重要性；5.掌握主圖的設(shè)計(jì)規(guī)范、設(shè)計(jì)思路與方法?！炯寄苣繕?biāo)】1.能夠設(shè)計(jì)并制作出高識(shí)別度的Logo；2.能夠設(shè)計(jì)并制作各種類型產(chǎn)品主圖。教學(xué)重點(diǎn)1.掌握Logo的設(shè)計(jì)思路與推銷方法；2.掌握主圖的設(shè)計(jì)規(guī)范、設(shè)計(jì)思路與方法；教學(xué)難點(diǎn)掌握Logo的設(shè)計(jì)思路與推銷方法；教學(xué)方法講授法、案例法、練習(xí)法課時(shí)數(shù)6課時(shí)教學(xué)內(nèi)容4.1Logo的視覺設(shè)計(jì)4.1.1Logo的定義Logo是一種標(biāo)志，通過意義明確的視覺符號(hào)，將經(jīng)營(yíng)理念、企業(yè)文化、經(jīng)營(yíng)內(nèi)容、企業(yè)規(guī)模和產(chǎn)品特性等要素傳速給消費(fèi)者。4.1.2Logo的類型1.中文型Logo2.英文型Logo3.中英文結(jié)核型Logo4.圖形型Logo5.圖文結(jié)合型Logo4.1.3Logo的設(shè)計(jì)規(guī)范1.優(yōu)秀的Logo首先需要具備創(chuàng)新性。2.優(yōu)秀的Logo應(yīng)具備思想性。3.優(yōu)秀的Logo應(yīng)具備易傳播的特性。4.優(yōu)秀的Logo應(yīng)具備美感。5.優(yōu)秀的Logo應(yīng)具備易用性4.1.4Logo的設(shè)計(jì)思路1.明確網(wǎng)店策略2.明確品類策略定位3.明確風(fēng)格定位4.明確元素5.明確字體6.明確色調(diào)設(shè)計(jì)師可以用以下幾個(gè)問題給自己的作品打打分：（1）Logo能喚起用戶什么樣的情感？（2）隱藏在Logo背后的東西是什么？（3）Logo經(jīng)得起時(shí)間的考驗(yàn)嗎？（4）它獨(dú)一無二，一眼就能看出來嗎？（5）在黑白色上看起來是如何？（6）在小尺寸下也能獨(dú)特清晰嗎？4.1.5推銷Logo的技巧與方法設(shè)計(jì)完成的Logo，不能只是簡(jiǎn)單的導(dǎo)一張圖出來，而是需要一個(gè)提案，即：推導(dǎo)+延展+呈現(xiàn)，示例如下：1.呈現(xiàn)，即Logo作品2.Logo的推導(dǎo)過程3.Logo的延展4.1.6Logo的制作Logo是店鋪裝修中必不可少的一部分，本例將為一科技類網(wǎng)店制作圖形類Logo。4.2主圖的視覺設(shè)計(jì)4.2.1主圖的類型與尺寸很多企業(yè)在多個(gè)電商平臺(tái)開設(shè)店鋪，為了減少工作量，通常主圖都會(huì)設(shè)計(jì)成800*800px大小。最新版的淘寶主圖已經(jīng)更新了第六張主圖，相對(duì)于原有的五張主圖，添加了寶貝長(zhǎng)圖。寶貝長(zhǎng)圖的尺寸建議是800*1200px。主圖的格式要求比較寬泛，常見的bmp、png、jpg等圖片格式均可，圖片大小控制在3M以內(nèi)，否則無法上傳。4.2.2主圖的設(shè)計(jì)規(guī)范在進(jìn)行主圖的設(shè)計(jì)時(shí)，應(yīng)遵守主圖設(shè)計(jì)規(guī)范，具體要求如下：首先，產(chǎn)品主體一定要顯眼、清晰，占總體比例的三分之二左右。主圖中可以加入促銷信息，但要簡(jiǎn)單明了，促銷信息不要喧賓奪主，字?jǐn)?shù)控制在10字以內(nèi)。其次，主圖上盡量有店鋪Logo或名稱，加強(qiáng)品牌感，如果使用Logo，一般放在主圖的左上角。第三，主圖上的文案信息避免多個(gè)文字區(qū)域，或大面積鋪蓋，這樣會(huì)干擾到用戶正常查看寶貝。文案在圖片周邊，顏色過于醒目且面積過大時(shí)，也會(huì)分散用戶的注意力，形成主圖“牛皮癬”，這樣的主圖不僅影響視覺效果，還會(huì)受到電商平臺(tái)的懲罰。第四，主圖中的產(chǎn)品最好選用單一產(chǎn)品，過多的產(chǎn)品容易分散用戶的注意力，單一產(chǎn)品和多產(chǎn)品主圖的視覺效果對(duì)比。最后，主圖應(yīng)盡量避免拼接圖形，拼接圖的整體視覺效果會(huì)顯得非常凌亂，即使是高檔產(chǎn)品也無法營(yíng)造出高品質(zhì)的視覺效果。4.2.3主圖設(shè)計(jì)思路1.從市場(chǎng)出發(fā)，做好產(chǎn)品定位2.參考同行，提煉賣點(diǎn)3.差異化的視覺效果4.確定主圖風(fēng)格和文案信息4.2.4主圖的制作歸納與提高本章介紹了Logo、主圖和專題頁的視覺設(shè)計(jì)。Logo的視覺設(shè)計(jì)主要介紹了Logo的定義、類型、設(shè)計(jì)規(guī)范、設(shè)計(jì)元素提煉和推銷Logo的方法等內(nèi)容。主圖的視覺設(shè)計(jì)，主要介紹了主圖的作用、類型、尺寸要求、設(shè)計(jì)規(guī)范和設(shè)計(jì)思路與方法。專題頁的視覺設(shè)計(jì)主要介紹了專題頁的設(shè)計(jì)規(guī)范，并以案例形式介紹專題頁的制作。第5章店鋪首頁視覺設(shè)計(jì)教學(xué)內(nèi)容一、網(wǎng)店首頁設(shè)計(jì)二、網(wǎng)店首頁核心模塊設(shè)計(jì)教學(xué)要求【知識(shí)目標(biāo)】1.熟悉并掌握店鋪首頁各個(gè)模塊的設(shè)計(jì)要點(diǎn)及主要內(nèi)容；2.了解店鋪首頁的頁面結(jié)構(gòu)及常見布局；3.掌握店鋪首頁的設(shè)計(jì)制作流程?！炯寄苣繕?biāo)】1.能夠獨(dú)立設(shè)計(jì)制作出符合店鋪風(fēng)格的店鋪首頁；2.能夠完成詳情頁中各個(gè)模塊設(shè)計(jì)；3.能夠根據(jù)需要對(duì)店鋪首頁進(jìn)行裝修。教學(xué)重點(diǎn)1.理解店鋪首頁裝修的作用；2.了解店鋪首頁的頁面結(jié)構(gòu)及常見布局；3.掌握店鋪首頁各個(gè)模塊的視覺設(shè)計(jì)規(guī)范。教學(xué)難點(diǎn)店鋪首頁各個(gè)模塊的視覺設(shè)計(jì)規(guī)范教學(xué)方法講授法、案例法、練習(xí)法課時(shí)數(shù)8課時(shí)教學(xué)內(nèi)容5.1網(wǎng)絡(luò)店鋪首頁裝修及其設(shè)計(jì)思路網(wǎng)店首頁的風(fēng)格一般受品牌文化、商品品類、顧客群、市場(chǎng)環(huán)境等因素的影響，良好的視覺設(shè)計(jì)給人以舒適的、直觀的視覺感受，讓顧客從設(shè)計(jì)好的網(wǎng)店中了解到更多的商品信息和店鋪信息。5.1.1網(wǎng)店首頁裝修設(shè)計(jì)的目的網(wǎng)店的頁面裝修的漂亮別致，首先從視覺方面就能打動(dòng)消費(fèi)者的心，讓消費(fèi)者感覺到賣家對(duì)店鋪的用心，從而增添對(duì)店鋪商品的信任感。而賣家把所有的關(guān)于店鋪的基本信息展示在店鋪首頁，讓消費(fèi)者能第一時(shí)間很清晰地了解到店鋪的所有信息，同時(shí)也能加深消費(fèi)者對(duì)店鋪的印象，促進(jìn)消費(fèi)者對(duì)店鋪內(nèi)商品的購(gòu)買，增加商品的成交量。良好的店鋪裝修效果能很好的提升店鋪的形象，增加消費(fèi)者對(duì)店鋪的關(guān)注度，提高店鋪點(diǎn)擊率。5.1.2網(wǎng)店首頁基本布局5.2網(wǎng)店首頁核心模塊設(shè)計(jì)5.2.1店招的視覺設(shè)計(jì)1.店招設(shè)計(jì)要求（1）店招內(nèi)容：從內(nèi)容上講，店招上可以放置店鋪名稱、Logo、廣告語、促銷產(chǎn)品、關(guān)注按鈕、優(yōu)惠券、搜索框、店鋪公告等一系列信息。（2）店招分類：店招分為常規(guī)店招和通欄店招，常規(guī)店招的寬度尺寸為950像素，高度尺寸不超過120像素。通欄店招的寬度尺寸為1920像素，高度尺寸不超過150像素。（3）設(shè)計(jì)原則：店招設(shè)計(jì)要遵守的第一個(gè)原則是品牌形象的植入。品牌形象的植入可以通過店鋪名稱、店鋪Logo的展示來進(jìn)行。第二個(gè)原則是抓住產(chǎn)品定位，產(chǎn)品定位是指展示店鋪賣什么產(chǎn)品，自己店鋪的賣點(diǎn)、特點(diǎn)、優(yōu)勢(shì)、差異化等，精準(zhǔn)的產(chǎn)品定位可以快速吸引目標(biāo)消費(fèi)群體進(jìn)入店鋪。2.不同類型店招的設(shè)計(jì)賣家在各個(gè)時(shí)期的階段目標(biāo)不同，店招通常分為品牌宣傳、活動(dòng)促銷和產(chǎn)品推廣三種形式，每種形式的元素應(yīng)用均有不同。

（1）品牌宣傳類制作品牌宣傳類店招時(shí)，首先要考慮和品牌相關(guān)元素的應(yīng)用，如店鋪名稱、Logo、廣告標(biāo)語，因?yàn)檫@是品牌宣傳最基本的內(nèi)容載體；其次是關(guān)注按鈕、關(guān)注人數(shù)、收藏按鈕，可以側(cè)面反映店鋪實(shí)力；第三是搜索框、第二導(dǎo)航等能夠提升用戶體驗(yàn)的內(nèi)容。（2）活動(dòng)促銷類制作活動(dòng)促銷類店招時(shí)，首先放置店鋪名稱、Logo等內(nèi)容，因?yàn)閷?duì)于一個(gè)店鋪而言，不管現(xiàn)階段的主要目標(biāo)是什么，都需要向客戶展示店鋪的名稱及品牌。在放置好店鋪名稱、Logo后，接下來要考慮的因素是活動(dòng)信息、優(yōu)惠券、促銷產(chǎn)品等和活動(dòng)相關(guān)的信息；最后考慮的是搜索框、旺旺、第二導(dǎo)航等方便用戶體驗(yàn)的內(nèi)容。不管是氣氛設(shè)計(jì)還是內(nèi)容展示，都要讓活動(dòng)信息占據(jù)更大的篇幅，否則顧客對(duì)店鋪的信息關(guān)注度會(huì)降低。（3）產(chǎn)品推廣產(chǎn)品推廣類店招主要是為了打造爆款，店鋪有主推產(chǎn)品或者是想要主推一款或幾款產(chǎn)品。在店招上，同樣是先擺放店鋪名、logo、廣告語等，然后要主打促銷產(chǎn)品以及和產(chǎn)品匹配的促銷信息、優(yōu)惠券、活動(dòng)信息等；最后是搜索框、第二導(dǎo)航條等方便用戶體驗(yàn)的內(nèi)容。5.2.2輪播海報(bào)的視覺設(shè)計(jì)1.輪播海報(bào)的設(shè)計(jì)要求（1）全屏輪播海報(bào)尺寸（2）常規(guī)輪播海報(bào)尺寸（3）輪播海報(bào)設(shè)計(jì)要點(diǎn)制作全屏輪播海報(bào)的時(shí)要保證其在構(gòu)圖方式、色彩搭配、字體應(yīng)用等方面風(fēng)格一致，整體畫面保持簡(jiǎn)潔美觀、主題突出、能夠吸引買家注意。此外，由于用戶的屏幕分辨率不同，每個(gè)用戶看到的界面會(huì)有所差異，為了保證不同分辨率的用戶在觀看輪播海報(bào)時(shí)，都能看全面、看清晰，在輪播海報(bào)的設(shè)計(jì)中，應(yīng)將主要產(chǎn)品及文案信息盡可能的居中顯示。2.全屏輪播海報(bào)設(shè)計(jì)制作5.2.3客服模塊的設(shè)計(jì)制作1.客服模塊設(shè)計(jì)要求在設(shè)計(jì)客服區(qū)時(shí)，對(duì)于聊天軟件的圖標(biāo)尺寸是有具體要求的。以淘寶平臺(tái)為例，旺旺圖標(biāo)的寬度為16像素、高度為16像素，如果是添加了“和我聯(lián)系”字樣的旺旺圖標(biāo)，圖標(biāo)的寬度為77像素，高度為19像素。因此，在制作過程中應(yīng)該以平臺(tái)要求的規(guī)范尺寸來進(jìn)行設(shè)計(jì)制作。2.客服模塊設(shè)計(jì)制作1.商品陳列展示模塊設(shè)計(jì)要求（1）明確商品類別（2）突出商品價(jià)格和購(gòu)買按鈕2.商品陳列展示模塊的設(shè)計(jì)與制作5.2.5店鋪頁尾區(qū)的視覺設(shè)計(jì)1.店鋪頁尾模塊設(shè)計(jì)要求頁尾內(nèi)容比較靈活，通常采用簡(jiǎn)短文字、具有代表性的圖標(biāo)來傳達(dá)相關(guān)的信息；店鋪底部導(dǎo)航包括如下信息：（1）產(chǎn)品的分類便于消費(fèi)者再次瀏覽網(wǎng)頁；（2）返回頂部的文字或者按鈕當(dāng)?shù)赇來撁孢^長(zhǎng)時(shí)，添加返回頂部的文字或按鈕可以快速跳轉(zhuǎn)到頁面頂部，從而方便用戶反復(fù)瀏覽網(wǎng)店；（3）收藏、分享店鋪在頁尾添加收藏與分享店鋪的鏈接，可以方便用戶快速收藏或分享店鋪，盡量留住客戶；（5）溫馨提示如發(fā)貨須知、關(guān)于色差、關(guān)于售后等信息，以便于幫助顧客快速解決購(gòu)物過程中的問題。2.店鋪頁尾模塊設(shè)計(jì)制作歸納與提高本章介紹了網(wǎng)店首頁各模塊的作用、視覺設(shè)計(jì)規(guī)范、注意事項(xiàng)和設(shè)計(jì)方法，并以實(shí)際案例詳細(xì)介紹了設(shè)計(jì)與制作的過程，具體包括店招、輪播海報(bào)、優(yōu)惠券、商品展示模塊、頁尾模塊的視覺設(shè)計(jì)。第6章商品詳情頁的設(shè)計(jì)制作教學(xué)內(nèi)容商品詳情頁概述商品詳情頁的制作要點(diǎn)商品詳情頁核心模塊設(shè)計(jì)教學(xué)要求【知識(shí)目標(biāo)】1.了解商品詳情頁設(shè)計(jì)的重要性；2.熟悉商品詳情頁的設(shè)計(jì)思路；3.掌握商品詳情頁設(shè)計(jì)要點(diǎn)與技巧。【技能目標(biāo)】1.能夠抓住不同商品的特點(diǎn)設(shè)計(jì)出別具一格的商品詳情頁；2.能夠熟練制作焦點(diǎn)圖、功能圖、展示圖、細(xì)節(jié)圖等。教學(xué)重點(diǎn)1．掌握商品細(xì)節(jié)展示區(qū)設(shè)計(jì)技巧。2．熟悉商品詳情頁各元素的設(shè)計(jì)方法。教學(xué)難點(diǎn)1．掌握并運(yùn)用商品主圖的設(shè)計(jì)形式。2．熟練運(yùn)用商品細(xì)節(jié)展示區(qū)設(shè)計(jì)技巧。3．熟練運(yùn)用商品功效簡(jiǎn)介區(qū)各元素的設(shè)計(jì)方法。教學(xué)方法講授法、案例法、練習(xí)法課時(shí)數(shù)6課時(shí)教學(xué)內(nèi)容6.1商品詳情頁概述6.1.1認(rèn)識(shí)商品詳情頁圖6-1商品詳情頁的頁面布局6.1.2商品詳情頁的作用? 引發(fā)買家興趣、激發(fā)顧客的消費(fèi)欲望；? 通過詳情頁圖片和文字介紹讓買家全面了解產(chǎn)品；? 樹立買家對(duì)商品的信任感，打消消費(fèi)疑慮，促使下單；? 降低服務(wù)成本、提升客單價(jià)。6.1.3商品詳情頁規(guī)格6.2商品詳情頁的制作要點(diǎn)6.2.1詳情頁前期規(guī)劃（1）商品信息收集在制作商品詳情頁之前，需要仔細(xì)閱讀廠家提供的產(chǎn)品介紹資料或者在互聯(lián)網(wǎng)查詢類似的商品的參考數(shù)據(jù)，了解產(chǎn)品的名稱、顏色、尺寸、重量等基本屬性信息。（2）競(jìng)品市場(chǎng)調(diào)研在眾多的網(wǎng)絡(luò)商品以及商家面前，買家會(huì)對(duì)他感興趣的東西進(jìn)行挑選、對(duì)比，然后再確定購(gòu)買，因此制作產(chǎn)品詳情頁就要在眾多商品中中，找到與自己屬性差不多的產(chǎn)品進(jìn)行對(duì)比分析。（3）商品賣點(diǎn)挖掘商品的賣點(diǎn)是指商品具備前所未有、別出心裁或與眾不同的特色、特點(diǎn)。商品的賣點(diǎn)就是吸引消費(fèi)者購(gòu)買產(chǎn)品的理由，沒有賣點(diǎn)的詳情頁只會(huì)讓進(jìn)入店鋪的流量白白的浪費(fèi)掉。如果挖不出產(chǎn)品賣點(diǎn)，打不到買家痛點(diǎn)，商品再好也無法銷售出去。FAB賣點(diǎn)挖掘法F是單詞Feature的縮寫，表象特征的意思，也叫屬性；A是單詞Advantage的縮寫，表示功能或優(yōu)勢(shì)的意思，也叫作用，作用是由前面一個(gè)要素F屬性延伸出來的；B是單詞Benefit縮寫，是滿足需求或者有好處，即有益處的意思，也叫利益。利益是根據(jù)前兩個(gè)要素，立足于買家的需求，得出來的。從產(chǎn)品概念提煉:一個(gè)完整的產(chǎn)品概念是立體的，包括核心產(chǎn)品、形式產(chǎn)品、期望產(chǎn)品、延伸產(chǎn)品和潛在產(chǎn)品5個(gè)層次。核心產(chǎn)品是指商品的使用價(jià)值，是產(chǎn)品概念中必不可少的部分。（4）商品素材整理素材收集是商品詳情頁制作過程中重要的環(huán)節(jié)，收集素材可以參考前期市場(chǎng)調(diào)研時(shí)的頁面，這個(gè)參考并不是讓大家抄襲，而且取其精華，去其槽粕，形成大概思路和框架，然后再去收集和整理相關(guān)素材。商品詳情頁制作過程中，一般需要收集的素材包括：經(jīng)過美化處理的白色背景圖、商品場(chǎng)景圖、模特圖、細(xì)節(jié)圖等，還有互聯(lián)網(wǎng)上搜6.2.2詳情頁設(shè)計(jì)思路（1）確定頁面風(fēng)格頁面風(fēng)格主要是根據(jù)產(chǎn)品本身來定的，通過分析產(chǎn)品的屬性、產(chǎn)品的功能以及客戶人群，最后確定頁面風(fēng)格。（2）構(gòu)建內(nèi)容框架焦點(diǎn)圖——引發(fā)興趣目標(biāo)客戶群設(shè)計(jì)——買給誰用，自己能不能使用。場(chǎng)景圖——激發(fā)潛在需求商品細(xì)節(jié)——逐步信任為什么購(gòu)買——好處設(shè)計(jì)、痛點(diǎn)設(shè)計(jì)同類商品對(duì)比——為什么選擇我的產(chǎn)品客戶評(píng)價(jià)、第三方評(píng)價(jià)——產(chǎn)生信任購(gòu)后的感覺塑造——給客戶一個(gè)100%購(gòu)買的理由給客戶購(gòu)買理由——送戀人、孝敬父母、送領(lǐng)導(dǎo)、送朋友等發(fā)出購(gòu)買號(hào)召——為什么立刻品牌介紹購(gòu)買須知——郵費(fèi)、發(fā)貨、退貨等關(guān)聯(lián)推薦（3）確定配色方案對(duì)于店鋪已經(jīng)有視覺規(guī)范的情況下，可以繼續(xù)沿用已有的配色方案，在沒有視覺規(guī)范，無從下手的時(shí)候，提供幾種配色的技巧。從LOGO提取，從LOGO提取配色方案比較適合已有店鋪VI系統(tǒng)或者線下的知名品牌。從產(chǎn)品本身或者行業(yè)屬性提取，比如醫(yī)療行業(yè)，可選取藍(lán)色作為主色；家具行業(yè)可選取綠色作為主色。從產(chǎn)品的聯(lián)想屬性提取，比如嬰幼兒產(chǎn)品，為了凸顯寶寶的可愛、純潔，多選用粉色和純凈的淺藍(lán)色。（4）選擇合適的字體文字在詳情頁中起到對(duì)商品及活動(dòng)等信息的解釋和說明的作用，合適的字體選擇能夠方便顧客閱讀并起到對(duì)重要信息引導(dǎo)的作用，文字會(huì)在整個(gè)內(nèi)頁中從上到下延續(xù)使用，所以了解文字使用規(guī)范至關(guān)重要。具體規(guī)范內(nèi)容如下：一般不超過3種字體；重點(diǎn)的部分要突出顯示，注意文字大小、粗細(xì)、疏密的對(duì)比；字體顏色的選擇不宜過于復(fù)雜，避免影響閱讀；字體選擇要符合產(chǎn)品的定位；字號(hào)一般要大于12號(hào)。（5）頁面上線（6）修改完善6.3商品詳情頁核心模塊設(shè)計(jì)6.3.1商品焦點(diǎn)圖設(shè)計(jì)設(shè)計(jì)焦點(diǎn)圖時(shí)需要做到視覺沖擊力強(qiáng)、產(chǎn)品展示完整、體現(xiàn)核心賣點(diǎn)三個(gè)方面，焦點(diǎn)圖文案要做到體現(xiàn)產(chǎn)品核心優(yōu)勢(shì)的同時(shí)，與顧客產(chǎn)生心理上的聯(lián)系。6.3.2商品賣點(diǎn)設(shè)計(jì)商品賣點(diǎn)可以是一個(gè)，也是可以是多個(gè)，在進(jìn)行賣點(diǎn)設(shè)計(jì)時(shí)，應(yīng)采用圖文結(jié)合的形式，通過文案進(jìn)一步強(qiáng)調(diào)和解釋賣點(diǎn)，最大化幫助顧客理解內(nèi)容。6.3.3商品基本參數(shù)設(shè)計(jì)當(dāng)顧客產(chǎn)生購(gòu)買需求后，就需要進(jìn)一步了解產(chǎn)品，查看尺碼、規(guī)格、顏色等，商品參數(shù)就是對(duì)商品基本屬性的詳細(xì)介紹。不同的商品屬性不同，參數(shù)也不同，商品參數(shù)通常包括顏色、體積、重量、尺寸、保質(zhì)期、材質(zhì)等。6.3.4商品展示設(shè)計(jì)商品展示模塊需要通過圖片對(duì)商品進(jìn)行全方位的展示，包括商品的正面、側(cè)面、背面、內(nèi)里、細(xì)節(jié)等。由于網(wǎng)絡(luò)購(gòu)物的虛擬性，顧客無法親自查看商品，為了讓顧客全面的了解商品，詳情頁應(yīng)盡可能從多角度、多形式展示商品。6.3.5商品細(xì)節(jié)圖設(shè)計(jì)商品細(xì)節(jié)圖模塊是對(duì)商品細(xì)節(jié)的展示，當(dāng)顧客了解了商品的整體情況后，會(huì)關(guān)注商品的細(xì)節(jié)，比如拉鏈、面料、做工等。細(xì)節(jié)圖要具有足夠的放大效果，將商品的細(xì)枝末節(jié)清晰的展示給顧客，細(xì)節(jié)圖運(yùn)用得當(dāng)可以提升商品層次、突出品質(zhì)感。歸納與提高本章介紹了商品詳情頁的視覺設(shè)計(jì)，包括詳情頁的布局、作用、詳情頁的制作思路、內(nèi)容的邏輯順序，并以兒童書包為例，介紹了焦點(diǎn)圖模塊、商品賣點(diǎn)模塊、商品參數(shù)模塊、商品展示模塊、細(xì)節(jié)圖模塊的設(shè)計(jì)與制作。第7章網(wǎng)店?duì)I銷推廣圖的制作教學(xué)內(nèi)容聚劃算主圖視覺設(shè)計(jì)直通車推廣圖視覺設(shè)計(jì)智展圖視覺設(shè)計(jì)教學(xué)要求【知識(shí)目標(biāo)】1.掌握聚劃算主圖的設(shè)計(jì)規(guī)范；2.掌握直通車主圖的設(shè)計(jì)規(guī)范；3.掌握智能鉆展圖的設(shè)計(jì)規(guī)范?！炯寄苣繕?biāo)】1.能夠設(shè)計(jì)制作出鉆展圖；2.能夠設(shè)計(jì)制作出直通車圖片以及聚劃算主圖。教學(xué)重點(diǎn)1.掌握聚劃算主圖的設(shè)計(jì)規(guī)范；2.掌握直通車主圖的設(shè)計(jì)規(guī)范；3.掌握智能鉆展圖的設(shè)計(jì)規(guī)范。教學(xué)難點(diǎn)掌握智能鉆展圖的設(shè)計(jì)規(guī)范教學(xué)方法講授法、案例法、練習(xí)法課時(shí)數(shù)6課時(shí)教學(xué)內(nèi)容7.1聚劃算主圖視覺設(shè)計(jì)7.1.1聚劃算主圖的設(shè)計(jì)規(guī)范（1）商品圖片（2）Logo放置規(guī)范（3）圖片背景（4）商品構(gòu)圖7.1.2聚劃算主圖設(shè)計(jì)案例7.2直通車主圖視覺設(shè)計(jì)7.2.1直通車主圖的設(shè)計(jì)規(guī)范設(shè)計(jì)定位，思考為先亮出商品，重點(diǎn)展示構(gòu)圖合理，排版統(tǒng)一7.2.2直通車主圖設(shè)計(jì)案例7.3鉆展圖視覺設(shè)計(jì)7.3.1鉆展圖的設(shè)計(jì)要點(diǎn)主題突出目標(biāo)明確形式美觀7.3.2鉆展圖設(shè)計(jì)案例歸納與提高本章介紹了聚劃算主圖、直通車主圖、鉆展圖的定義、尺寸要求、展現(xiàn)位置、設(shè)計(jì)規(guī)范，并分別以案例的形式詳細(xì)介紹了各種廣告圖的視覺設(shè)計(jì)步驟。第8章移動(dòng)端網(wǎng)店的視覺設(shè)計(jì)與裝修教學(xué)內(nèi)容移動(dòng)端網(wǎng)店裝修的基礎(chǔ)知識(shí)移動(dòng)端網(wǎng)店首頁的視覺設(shè)計(jì)移動(dòng)端詳情頁的視覺設(shè)計(jì)教學(xué)要求【知識(shí)目標(biāo)】1．了解移動(dòng)端店鋪頁面的框架結(jié)構(gòu)；2．了解移動(dòng)端店鋪對(duì)圖片發(fā)布的尺寸要求；3．掌握移動(dòng)端網(wǎng)店模塊的編輯與裝修方法。【技能目標(biāo)】1．能夠完成移動(dòng)端模塊設(shè)計(jì)和裝修；2．能夠完成移動(dòng)端頁面裝修設(shè)計(jì)。教學(xué)重點(diǎn)1．掌握移動(dòng)端店鋪的視覺設(shè)計(jì)規(guī)范；2．掌握移動(dòng)端店鋪首頁與詳情頁的設(shè)計(jì)方法。教學(xué)難點(diǎn)掌握移動(dòng)端店鋪的視覺設(shè)計(jì)規(guī)范教學(xué)方法講授法、案例法、練習(xí)法課時(shí)數(shù)6課時(shí)教學(xué)內(nèi)容8.1移動(dòng)端網(wǎng)店裝修的基礎(chǔ)知識(shí)8.1.1移動(dòng)端店鋪的設(shè)計(jì)