Photoshop

圖像處理項目四電商圖像設計任務1網(wǎng)店店標設計任務2網(wǎng)店店招的設計項目四XIANGMUYI0102電商圖像設計任務3網(wǎng)店詳情頁設計03任務4霓虹燈字設計04任務5網(wǎng)店Banner設計05任務1網(wǎng)店店標設計項目四

電商圖像設計學習目標●能用各種形狀工具進行復雜圖形的繪制。●熟練掌握路徑的布爾運算操作?！裾莆章窂叫螤畹奶钌兔柽叿椒āＨ蝿辗治龅陿耸蔷W(wǎng)店視覺傳達的主要形象之一，是一種“視覺語言”。在網(wǎng)店的日常推廣運營中，某電商“匯精展示用品網(wǎng)店”準備對網(wǎng)店進行裝修改造，要求對該網(wǎng)店店標進行重新設計。店標是店面標識的圖形記號，一般由圖案、顏色和文字構成，用于表達商家的核心訴求。任務分析常見的店標分為靜態(tài)店標和動態(tài)店標兩大類，靜態(tài)店標分為文字型、圖案型和組合型3類。匯精展示用品網(wǎng)店”店標的圖案主要由同一個圓形上的4段圓環(huán)、4個直角和4個長方形構成。在使用Photoshop進行設計時，首先使用橢圓工具和路徑布爾運算繪制外形，然后使用路徑選擇工具繪制直角，使用矩形工具繪制長方形，依次將形狀填充顏色，最后添加說明文字。本任務的學習重點是路徑的布爾運算操作。任務實施1．新建圖像文件單擊“文件”菜單中的“新建”命令，彈出“新建”對話框。設置參數(shù)如下：寬度為300像素，高度為300像素，分辨率為72像素/英寸，顏色模式為RGB顏色、16位，背景內(nèi)容為白色。任務實施2．繪制中心參考線（1）單擊“視圖”菜單中的“標尺”命令或按“Ctrl+R”鍵，打開標尺。（2）在上方標尺處按住鼠標左鍵不放，向下拖動參考線至畫布中線處，當其主動吸附至中線處時松開鼠標左鍵。（3）在左側標尺處按住鼠標左鍵不放，向右拖動參考線至畫布中線處，當其主動吸附至中線處時松開鼠標左鍵。任務實施3．使用橢圓工具繪制外形（1）新建圖層。單擊圖層面板中的“創(chuàng)建新圖層”按鈕，生成圖層1。（2）選中“圖層1”，單擊工具箱中的“橢圓工具”按鈕，在工具選項欄設置模式為“形狀”，填充為藍色，不描邊。任務實施3．使用橢圓工具繪制外形（3）選中“橢圓1”圖層，按“Ctrl+J”鍵復制圖層，選中復制的藍色正圓，單擊“橢圓工具”按鈕，在工具選項欄中設置填充顏色為黃色（主要是把兩個圓區(qū)分開），按“Ctrl+T”鍵，出現(xiàn)自由變換控件，按住“Shift+Alt”鍵的同時，按住鼠標左鍵向圓內(nèi)拖曳自由變換控件右下角的控點，制作藍黃兩個不同大小的同心圓。任務實施3．使用橢圓工具繪制外形（4）按住“Shift”鍵，同時選中“橢圓1”和“橢圓1拷貝”圖層，按“Ctrl+E”鍵合并圖層。任務實施3．使用橢圓工具繪制外形（5）在工具箱中單擊“路徑選擇工具”按鈕，單擊黃色小圓形，選中黃色小圓路徑，在工具選項欄中單擊“路徑操作”按鈕，在左圖其下拉菜單中選擇“減去頂層形狀”，效果圖如右圖所示。任務實施4．使用路徑布爾運算修剪外形（1）在圖層的最上方新建圖層，在工具箱中選擇“矩形工具”，在工具選項欄設置模式為“形狀”，填充為藍色，不描邊。（2）按住“Shift”鍵，同時選中“矩形1拷貝”矩形1“橢圓1拷貝”3個圖層，按“Ctrl+E”鍵合并圖層。（3）選擇“路徑選擇工具”，按住鼠標左鍵在畫面中從左上方向右下方拖曳，框選所有的路徑，單擊工具選項欄中的“路徑操作”按鈕，在其下拉菜單中選擇“合并形狀組件”。任務實施5．繪制圓內(nèi)的圖形（1）單擊“編輯”菜單中的“自由變換”（或按快捷鍵“Ctrl+T”）命令。（2）拖動變換控制框上的任意一個控制句柄，可調(diào)整圖像大小，也可將鼠標移動到控制框外側，拖動以旋轉(zhuǎn)圖像。（3）單擊工具箱中的移動工具，用鼠標將葡萄拖動到合適的位置。任務實施5．繪制圓內(nèi)的圖形（1）新建圖層，單擊工具箱中的“矩形工具”按鈕，在新建圖層中按住“Shift”鍵繪制一個正方形，按“Ctrl+T”鍵，在工具選項欄中“旋轉(zhuǎn)角度”選項中輸入“45”，按“回車”鍵確認。任務實施5．繪制圓內(nèi)的圖形（2）選中“矩形1”圖層，按“Ctrl+J”復制該圖層，單擊工具箱中的“矩形工具”，在工具選項欄中選擇填充顏色為黃色，并用移動工具將黃色矩形移到合適的位置。任務實施5．繪制圓內(nèi)的圖形（3）選擇“路徑選擇工具”，單擊上方的黃色矩形路徑，在工具選項欄中單擊“路徑操作”按鈕，在其下拉菜單中選擇“減去頂層形狀”。任務實施5．繪制圓內(nèi)的圖形（4）選擇“路徑選擇工具”，按住鼠標左鍵在畫面中從兩個正方形的左上方向右下方拖曳，框選兩個正方形的所有路徑，單擊工具選項欄中的“路徑操作”按鈕，在其下拉菜單中選擇“合并形狀組件”，合并生成組合圖形。任務實施5．繪制圓內(nèi)的圖形（5）移動剛修剪后的圖形，將其對齊到弧的中部。任務實施5．繪制圓內(nèi)的圖形（6）選中“矩形1拷貝2”圖層，按“Ctrl+T”鍵，出現(xiàn)自由變換控件，按住“Alt”鍵，同時按住鼠標左鍵拖動自由變換控件的中心點到兩條參考線的交點上。任務實施5．繪制圓內(nèi)的圖形（7）在工具選項欄“旋轉(zhuǎn)角度”選項中輸“90”，單擊工具選項欄中的√。（8）按“Ctrl+Shift+Alt+T”鍵3次，復制并旋轉(zhuǎn)該圖形，如圖所示。任務實施5．繪制圓內(nèi)的圖形（9）選中除背景圖層外的所有圖層，按“Ctrl+E”鍵合并圖層，單擊“路徑選擇工具”按鈕，按住鼠標左鍵在畫面中從左上方向右下方拖曳，框選所有圖形的路徑。任務實施5．繪制圓內(nèi)的圖形（10）新建圖層，在新建圖層中用矩形工具繪制一個藍色矩形，并把它旋轉(zhuǎn)-45°，用移動工具將矩形調(diào)整到合適的位置。任務實施5．繪制圓內(nèi)的圖形（11）按“Ctrl+T”鍵，出現(xiàn)自由變換控件，按住“Alt”鍵，同時按住鼠標左鍵拖動自由變換控件的中心點到兩條參考線的交點上，在工具選項欄“旋轉(zhuǎn)角度”選項中輸入“90”，單擊工具選項欄中的√。按“Ctrl+Shift+Alt+T”鍵3次，復制并旋轉(zhuǎn)該圖形，如圖所示。（12）選中“矩形1”圖層，用移動工具將藍色小矩形移到合適的位置。任務實施5．繪制圓內(nèi)的圖形（13）依次將形狀填充顏色設置為藍色（#425daa）、紅色（#ff0000）、橙色（#bc912c）、黃色（#ffff00）、綠色（#599140）。任務實施6．添加文字(1)選擇“橫排文字工具”，在繪圖區(qū)單擊輸入“匯精展示用品”，設置字體為方正正中黑簡體，大小為10像素，顏色為黑色。(2)按住“Ctrl”鍵，分別選中文字圖層和背景圖層，單擊工具選項欄中的“水平居中對齊”按鈕，使文字圖案水平居中對齊。任務實施7．隱藏背景圖層單擊背景圖層的

，當

消失時，背景圖層就不會顯示。8．保存圖像文件網(wǎng)店店標圖片格式一般為GIF、PNG或JPEG。單擊“文件”菜單中的“存儲為”命令，在彈出的對話框中選擇以PNG格式保存。也可以使用“文件”菜單中的“存儲為Web所用格式”命令，以便在圖片品質(zhì)和文件大小之間做好平衡。完成后退出PhotoshopCC2015。注意事項1．店標在海報和橫幅中時，需要放置在其他顏色或花色的背景上，存儲透明背景的PNG格式更方便今后使用。2．組合鍵“Ctrl+Shift+Alt+T”的作用是重復并復制上一次的變換。3．在設計標志的過程中，如果需要創(chuàng)建比較復雜的形狀或選區(qū)，通常使用路徑，因為路徑比選區(qū)更加精確、靈活。4．路徑選擇工具和直接選擇工具在用法上的主要區(qū)別是：前者是對整條路徑進行操作，后者是對路徑內(nèi)部的錨點進行操作。相關知識一、路徑布爾運算路徑可以進行相加、相減的布爾運算。操作方法：先繪制一個路徑或形狀，如左圖所示，在工具選項欄中單擊“路徑操作”按鈕，在其下拉菜單中選擇一種運算方式，如右圖所示。相關知識二、路徑選擇工具“路徑選擇工具”選項欄如圖所示。1．對齊、分布路徑對齊與分布可以對路徑或者形狀中的路徑進行操作。2．調(diào)整路徑排列方式當文件中包含多個路徑時，路徑的上下順序會影響畫面的效果，此時需要調(diào)整路徑的堆疊順序。思考練習一、操作題試為本地一家經(jīng)營土特產(chǎn)的網(wǎng)店設計并制作一個店標LOGO，并說明設計思路和制作步驟。二、簡答題1．路徑布爾運算有哪幾種操作？分別用圖形展示進行路徑操作后的效果。2．如何設置形狀的無描邊效果、描邊顏色、描邊線粗和描邊選項？3．可以使用哪些工具來移動路徑和形狀并調(diào)整它們的大??？4．常見的網(wǎng)店店標分為哪幾種類型？任務2網(wǎng)店店招的設計項目四

電商圖像設計學習目標●能熟練使用矩形工具和文字工具設計店招背景?！衲苁炀毷褂谩爸萌肭度氲闹悄軐ο蟆泵?。●掌握圖層在店招設計與制作中的應用。●熟悉對齊與分布的類型。任務分析店招就是商店的招牌，網(wǎng)店店招主要用于展示店鋪名稱和經(jīng)營特色，宣傳店鋪。店招設計與制作要做到新穎、醒目、簡明，既要做到引人矚目，又要與店面設計融為一體，制作成與經(jīng)營內(nèi)容一致的形象或圖形，增強招牌的感召力，給人以完美的外觀形象。本任務要求為網(wǎng)店“匯精展示用品”設計店招。任務分析網(wǎng)店中的店招設計十分重要。店招如果設計得好，可以為店鋪的轉(zhuǎn)化率帶來很多的流量，并且提升網(wǎng)店的影響力?！皡R精展示用品”店招設計主要由矩形背景圖、店標LOGO、小圖標和文字說明組成。在使用Photoshop進行設計時，首先使用矩形工具和移動工具制作背景外形，置入不同的背景圖片制作背景，然后導入店標和小圖標，最后添加說明文字。本任務學習的重點是店招設計的要點和基本思路。任務實施1．新建圖像文件單擊“文件”菜單中的“新建”命令，彈出“新建”對話框，設置寬度為950像素，高度為150像素，分辨率為72像素/英寸，顏色模式為RGB顏色、8位，背景內(nèi)容為白色。任務實施2．制作背景（1）單擊工具箱中的“油漆桶工具”按鈕，單擊“設置前景色”按鈕，設置顏色為#ebece6，填充背景為淺灰色，如圖所示。任務實施2．制作背景（2）新建圖層1，單擊工具箱中的“矩形工具”按鈕，在工具選項欄中設置模式為“形狀”、顏色為#1a305d，在畫布上繪制一個矩形。按“Ctrl+T”鍵，出現(xiàn)自由變換控件，按住“Ctrl+Shift”鍵，選中矩形左上角的控點向右水平拖動鼠標，按“回車”鍵確定，效果圖如圖所示。任務實施2．制作背景（3）按“Ctrl+J”鍵復制矩形1圖層，生成“矩形1拷貝”圖層。（4）單擊“矩形1”圖層，設置前景色為#a4c7e3，按“Alt+Delete”鍵填充前景色。單擊“移動工具”按鈕，按鍵向左移動10像素（單獨按“←”鍵，二次移動1px，按住“Shift”鍵，按“←”鍵一次，移動10px），效果圖如圖所示。任務實施2．制作背景（5）單擊“背景”圖層，新建圖層，將圖層名稱命名為“素材1”。單擊“矩形1拷貝”圖層，新建圖層，將圖層名稱命名為“素材2”，如圖所示。（6）選中“素材1”圖層，單擊“文件”菜單中的“置入嵌入的智能對象”命令，導入“素材1”圖片，調(diào)整圖片大小和位置，按“回車”鍵確定。任務實施2．制作背景（7）選中“素材2”圖層，單擊“文件”菜單中的“置入嵌入的智能對象”命令，導入“素材2”圖片，調(diào)整圖片大小和位置，按“回車”鍵確定。效果圖如圖所示。任務實施2．制作背景（8）選中“素材2”圖層，按“Ctrl”鍵單擊圖層面板中的“矩形1拷貝”圖層縮覽圖，選“矩形1拷貝”圖層選區(qū)，單擊圖層面板下方的“添加圖層蒙版”按鈕，為“素材2”圖層添加蒙版，效果圖如圖所示。（9）選中“素材1”圖層，在圖層面板中設置不透明度為75%。任務實施3．導入店標（1）新建圖層，圖層名稱為“LOGO”，單擊“文件”菜單中的“置入嵌入的智能對象”命令，導入“l(fā)ogo.png”店標圖標。（2）按“Ctrl+T”鍵，出現(xiàn)自由變換控件，按住“Alt+Shift”鍵，向左上方拖曳右下方控點，使店標圖標大小合適，按“回車”鍵確定。用移動工具將店標圖標調(diào)整到合適的位置，如圖所示。任務實施4．輸入文字（1）單擊“橫排文字工具”按鈕，在工具選項欄中設置字體為方正大黑簡體，大小為100點，輸入“匯聚精品展示精彩”。若需調(diào)整文字大小，可以按“Ctrl+T”鍵，出現(xiàn)自由變換控件，按住“Shift”鍵，拖曳四個頂角控點中的任意一個按比例放大或縮小。（2）單擊“橫排文字工具”按鈕，選中“匯聚精品”，將文字顏色設置為#1a305d；選中“展示精彩”，將文字顏色設置為#ebece6。（3）單擊“橫排文字工具”按鈕，輸入“專注于商品展示拍攝方案”，按“Ctrl+T”鍵對文字進行自由變換，調(diào)整文字的大小和位置，將文字顏色設置為#0d4f18，在切換字符和段落面板中調(diào)整字間距，如圖所示。任務實施5．導入小圖標（1）新建3個圖層，選中“圖層1”，單擊“文件”菜單中的“置入嵌入的智能對象”命令，導入素材“小圖標-1.psd”，用同樣的方法，分別導入素材“小圖標-2.psd”和“小圖標-3.psd”。（2）單擊移動工具，按“Ctrl+T”鍵，出現(xiàn)自由變換控件，在工具選項欄中單擊“垂直居中對齊”按鈕和“水平居中分布”按鈕，將三個小圖標移到合適的位置，如圖所示。任務實施5．導入小圖標（3）單擊“橫排文字工具”按鈕，在小圖標對應的位置分別輸入“專業(yè)廠家”“誠信經(jīng)營”“品質(zhì)保證”，字體為黑體，顏色為白色，用移動工具調(diào)整好文字的大小和位置，如圖所示。任務實施6．保存圖像文件在圖層面板隱藏背景后，單擊“文件”菜單中的“存儲為”命令，在彈出的對話框中選擇以PNG格式保存。完成后退出PhotoshopCC2015。注意事項1．使用“自由變換”命令進行變換的操作方法：單擊“編輯”菜單中的“自由變換”命令（或按“Ctrl+T”鍵），出現(xiàn)自由變換控件，將光標移動到角點處的控制點上，當光標變成

后拖曳可以進行縮放，當光標變成

后拖曳可以進行旋轉(zhuǎn)，按“Ctrl”鍵拖曳控制點可以進行斜切、扭曲等操作。2．使用“橫排文字工具”創(chuàng)建的文字無法自動換行，需按“回車”鍵手動換行。3．雙擊文字圖層的縮覽圖即可選中該文字圖層中的所有文字。4．在文字輸入的過程中，如果要移動文字的位置，可以將光標移動到文字的附近，當光標變?yōu)?/p>

后，按住鼠標左鍵拖曳調(diào)整文字的位置。相關知識一、網(wǎng)店店招的類型常見的有以下三種類型：（1）標準型：將店鋪LOGO、店名和主營業(yè)務等元素全部展示出來。（2）普通型：主要展示店名和商品關鍵詞這兩個元素，這樣突出了銷售產(chǎn)品。（3）營銷型：主要展示品牌推廣和主營業(yè)務，吸引買家點擊瀏覽。相關知識二、對齊與分布在處理圖像時，經(jīng)常要將圖像進行對齊和分布設置。在Photoshop中，圖層的對齊方式分別有頂對齊、底對齊、左對齊、右對齊、垂直居中對齊和水平居中對齊。圖層的分布方式有按頂分布、垂直居中分布、按底分布、按左分布、水平居中分布和按右分布。1．對齊圖層操作方法：若要對圖層進行對齊操作，首先要選中多個需要對齊的圖層，單擊“移動工具”按鈕，在工具選項欄中選擇相應的對齊按鈕進行設置，如圖所示。相關知識2．分布圖層分布是將所選的圖層以上下、左右兩端的對象為起點和終點，將所選圖層在此范圍內(nèi)的圖像進行均勻的排列，得到圖層之間距離相等的效果。操作方法：選中要進行分布的圖層，單擊“移動工具”按鈕，在工具選項欄中選擇相應的分布按鈕進行設置。思考練習一、操作題試為一家流行鞋網(wǎng)店設計一個店招。二、簡答題1．為圖層添加蒙版，如何顯示和隱藏圖層中的局部內(nèi)容？2．如何將對象居中對齊和平均分布間距？3．可以使用哪些工具來移動路徑和形狀并調(diào)整它們的大?。咳蝿?網(wǎng)店詳情頁設計項目四

電商圖像設計學習目標●能熟練運用Photoshop中的顏色漸變填充工具?！裾莆找欢ǖ膱D文排版和配色技巧?！衲苁炀氝\用畫筆工具、直線工具、橢圓工具、圓角矩形工具、矩形工具及自定形狀工具等繪制圖形?！衲莒`活運用圖層蒙版、圖層樣式及濾鏡功能制作圖像特效?！裾莆站W(wǎng)店詳情頁的設計思路和基本方法。任務分析一個好的產(chǎn)品需要有好的網(wǎng)店詳情頁來支撐，詳情頁是店鋪產(chǎn)品是否能夠交易成功的關鍵因素，成功的詳情頁可以有效地吸引客戶并激發(fā)購買欲望。本任務要求對“匯精展示用品”網(wǎng)店的詳情頁進行設計，效果圖如圖所示。任務分析詳情頁包含的主要元素有商品焦點圖、商品展示圖、商品基本信息和商品細節(jié)圖。首先利用工具欄中的矩形工具和鋼筆工具將詳情頁面分為上、中、下三個部分；然后用文字工具對上下兩部分導入的商品圖進行文字說明，展示商品的優(yōu)勢和基本信息；詳情頁的中間部分通過導入圖片，使用文字工具對商品的功能進行詳細說明；最后對詳情頁背景中的圖片進行濾鏡處理，形成最終效果圖。本任務的學習重點是各種繪圖工具在詳情頁設計中的靈活運用及網(wǎng)店詳情頁的設計思路和基本方法。任務實施1．新建圖像文件單擊“文件”菜單中的“新建”命令，彈出“新建”對話框，設置寬度為750像素，高度為1800像素，分辨率為72像素/英寸，顏色模式為RGB顏色、8位，背景內(nèi)容為白色。設置完成后，單擊“確定”按鈕。任務實施2．繪制參考線（1）單擊“視圖”菜單中的“標尺”選項或按“Ctrl+R”鍵，打開標尺。（2）在上方標尺處按住鼠標左鍵不放，分別向下拖動參考線至畫布上邊緣、中線處和下邊緣，當參考線自動吸附至上邊緣、中線處和下邊緣時松開鼠標左鍵。（3）在左側標尺處按住鼠標左鍵不放，分別向右拖動至畫布左邊緣、中線處和右邊緣，當參考線自動吸附至左邊緣、中線處和右邊緣時松開鼠標左鍵。效果圖如圖所示。任務實施3．制作背景（1）新建圖層1，單擊“矩形選框工具”按鈕，吸附參考線繪制上半部分選框。（2）單擊“漸變工具”按鈕，在工具選項欄中設置漸變類型為線性漸變，在“漸變編輯器”對話框中編輯漸變顏色,，如圖所示。任務實施3．制作背景(3)新建圖層2，單擊“矩形選框工具”按鈕，吸附參考線繪制下半部分選框。(4)單擊“漸變工具”按鈕，在工具選項欄中設置漸變類型為線性漸變，在“漸變編輯器”對話框中編輯漸變顏色，將漸變色條左邊的色標設置為#e7e6dd，將漸變色條右邊的色標設置為#b9c7c8，從選區(qū)的左上角向右下角拖曳進行填充。按“Ctrl+D”鍵取消選區(qū)，效果圖如圖所示。任務實施4．導入商品（1）新建圖層，命名為“展臺1”，單擊“文件”菜單中的“置入嵌入的智能對象”命令，導入“展臺1.png”，用“移動工具”調(diào)整好圖像的位置，按“Ctrl+T”鍵，出現(xiàn)自由變換控件，用鼠標拖曳控點調(diào)整圖像的大小。(２)新建圖層，命名為“展臺２”，用步驟（1）導入“展臺2.png”并調(diào)整圖像的大小，效果圖如圖所示。任務實施5．為商品圖片制作陰影效果（1）按住“Ctrl”鍵，單擊“展臺1”圖層左邊的圖層縮覽圖，選中圖像選區(qū)。（2）新建圖層，將新建圖層移到“展臺1”圖層的下方。（3）單擊“漸變工具”按鈕，在工具選項欄中設置漸變類型為線性漸變，在“漸變編輯器”對話框中編輯漸變顏色。（4）對陰影圖層進行變形。按“Ctrl+T”鍵，出現(xiàn)自由變換控件，按住“Ctrl”鍵拖曳調(diào)整控點，圖像右下方形成陰影效果，如圖所示。任務實施5．為商品圖片制作陰影效果（5）單擊“濾鏡”菜單中的“模糊”命令，選擇“高斯模糊”，設置半徑為7像素。（6）參照上面的步驟為“展臺2”圖層添加陰影效果，如圖所示。任務實施6．繪制圖形（1）新建圖層，命名為“形狀”，單擊“矩形工具”按鈕，在工具選項欄中設置模式為“形狀”，填充色為#043b5b，無描邊，W=750像素，H=356像素，如圖所示。在畫布中繪制矩形，單擊“移動工具”按鈕，將矩形移動到合適的位置，如圖所示。任務實施6．繪制圖形（3）單擊鋼筆工具組中的“添加錨點工具”按鈕，在矩形上方右側適當?shù)奈恢锰砑渝^點，并調(diào)節(jié)錨點，效果圖如圖所示。用同樣的方法制作左側變形效果圖。任務實施6．繪制圖形（4）單擊“形狀”圖層，按“Ctrl+J”鍵復制形狀圖層，生成“形狀拷貝”圖層，將“形狀拷貝”圖層移至“形狀”圖層下方。用“移動工具”將圖形調(diào)整到合適的位置，設置填充色為#93cbe3，效果圖如圖所示。任務實施6．繪制圖形（5）單擊“形狀拷貝”圖層，按“Ctrl+J”鍵復制生成“形狀拷貝2”圖層，用“移動工具”將圖形調(diào)整到合適的位置，效果圖如圖所示。（6）新建圖層，命名為“窗戶”，將“窗戶”圖層移至“展臺1”陰影圖層的下方。單擊“矩形工具”按鈕，在工具選項欄中設置模式為“形狀”，填充色為#f3f4f0，無描邊，在圖像的左側繪制矩形。按住“Ctrl”鍵拖曳“窗戶”圖層到圖層面板的“創(chuàng)建新圖層”按鈕上，生成3個窗戶拷貝圖層任務實施6．繪制圖形（7）按住“Ctrl”鍵，選中“窗戶”圖層及3個窗戶拷貝圖層，單擊“直接選擇工具”按鈕；按住“Ctrl”鍵，選中錨點，將“窗戶”圖形調(diào)整為透視形狀，繪制窗戶的投影，效果圖如圖所示。（8）按住“Ctrl”鍵，選中“窗戶”圖層及3個窗戶拷貝圖層，按“Ctrl+E”鍵合并圖層。任務實施6．繪制圖形（9）單擊“濾鏡”菜單中的“模糊”命令，選擇“高斯模糊”，設置半徑為8.2像素，效果圖如圖所示。（10）在“展臺1”陰影圖層的下方新建圖層，命名為“不透明度”。效果圖如圖所示。任務實施6．繪制圖形（11）在“展臺2”陰影圖層的下方新建圖層，命名為“畫筆”。效果圖如圖所示。（12）選中“畫筆”圖層，為圖層添加矢量蒙版，用鼠標單擊“圖層蒙版縮覽圖”，再單擊“畫筆工具”按鈕，設置畫筆為柔邊圓，前景色為黑色，在光線的下方涂抹，以達到漸隱效果。任務實施7．輸入文字（1）單擊“橫排文字工具”按鈕，輸入文字“LED炫彩旋轉(zhuǎn)展臺”，在工具選項欄中設置字體為方正大黑簡體，大小為67點，顏色為#094060。效果圖如圖所示。（2）單擊“橫排文字工具”按鈕，輸入文字“產(chǎn)品參數(shù)”。任務實施7．輸入文字（3）單擊“橫排文字工具”按鈕，在畫布上按住鼠標左鍵拖曳出段落文本框，輸入文字效果圖如圖所示。（4）新建圖層，繪制直線，效果圖如圖所示。任務實施7．輸入文字（5）繪制標注線段。（6）新建圖層，單擊“自定形狀工具”按鈕，在工具選項欄的形狀中選擇箭頭圖標，繪制箭頭。（7）用同樣的方法繪制垂直標高，并輸入文字“6cm”，如圖所示。任務實施8．繪制裝飾線（1）新建圖層，單擊“圓角矩形工具”按鈕，在工具選項欄中設置為無填充色，描邊為3像素，描邊顏色為#185e19。如圖所示。（2）單擊鋼筆工具組中的“添加錨點工具”按鈕，在圓角矩形上下邊線上文字邊緣各添加2個錨點。任務實施8．繪制裝飾線（3）新建圖層，單擊“橢圓工具”按鈕，繪制小正圓，效果圖如圖所示。（4）新建圖層，單擊“圓角矩形工具”按鈕，在工具選項欄中設置填充色為#185e19，無描邊，圓角半徑為10像素，繪制圓角矩形。任務實施8．繪制裝飾線（5）新建圖層，單擊“橢圓工具”按鈕，繪制組合圖形，效果圖如圖所示。（6）新建圖層，單擊“矩形工具”按鈕，大小和位置如圖所示。任務實施8．繪制裝飾線（7）新建圖層，單擊“自定形狀工具”按鈕，在工具選項欄的形狀中選擇皇冠圖形，在矩形框內(nèi)的上方繪制皇冠，設置填充色為#b0a169，畫布水平居中對齊，如圖所示。任務實施9．導入素材素材包含圖標、植物和音符素材。圖標可以繪制，也可以導入已有的圖標。（1）新建9個圖層，分別單擊“文件”菜單中的“置入嵌入的智能對象”命令，導入素材“圖標1.psd”……“圖標9.psd”。進行編輯，

效果圖如圖所示。任務實施9．導入素材（2）單擊“橫排文字工具”按鈕，在工具選項欄中設置字體為黑體，大小為18點，顏色為白色，在畫布中輸入文字，效果圖如圖所示。任務實施9．導入素材（3）新建圖層，命名為“植物”，單擊“文件”菜單中的“置入嵌入的智能對象”命令，導入“植物.png”。調(diào)整好位置和大小，效果圖如圖所示。任務實施9．導入素材（4）選中“植物”圖層，單擊“濾鏡”菜單中的“模糊”命令，選擇“高斯模糊”，設置半徑為11像素。（5）按住“Alt”鍵，同時拖曳鼠標復制植物，按“Ctrl+T”鍵，右擊，在彈出的快捷菜單中選擇“水平翻轉(zhuǎn)”，再右擊選擇“垂直翻轉(zhuǎn)”。單擊“移動工具”按鈕，將翻轉(zhuǎn)后的植物移至右側的位置上，效果圖如圖所示。任務實施9．導入素材（6）新建圖層，命名為“音符”，單擊“文件”菜單中的“置入嵌入的智能對象”命令，進行編輯，使音符圖像在商品展臺的右后方。（7）雙擊圖層面板中的“音符”圖層，彈出“圖層樣式”對話框，勾選“漸變疊加”，單擊“漸變疊加”選項中“漸變”右側的顏色條，彈出“漸變編輯器”對話框，進行設置，再單擊“確定”按鈕，效果圖如圖所示。任務實施10．保存圖像文件在圖層面板隱藏背景后，單擊“文件”菜單中的“存儲為”命令，在彈出的對話框中選擇以PNG格式保存。完成后退出PhotoshopCC2015。注意事項1．單擊圖層面板中的圖層即選中一個圖層；按“Ctrl”鍵的同時單擊其他圖層即可選中多個圖層。2．使用“移動工具”移動圖像時，按“Alt”鍵拖曳圖像，可以復制圖像并生成一個新圖層。當圖像中存在選區(qū)時，按“Alt”鍵拖曳圖像，可以復制圖像而不會產(chǎn)生新圖層。3．圖像形狀變換按“Ctrl+T”鍵，縮放按“Shift”鍵，將鼠標放在角點上拖曳可以等比例縮放圖像，在縮放時按“Alt”鍵可以以中心點為基準縮放圖像，按“Ctrl”鍵拖曳控點可以進行斜切、扭曲操作。相關知識一、網(wǎng)店詳情頁的尺寸要求適合計算機端的網(wǎng)店商品詳情頁其圖片寬度一般不超過750像素，容量一般不超過2MB。用于手機端的網(wǎng)店商品詳情頁其圖片寬度要求為480~1242像素，高度不超過1546像素，圖片總容量不超過2

560KB。相關知識二、網(wǎng)店詳情頁包含的內(nèi)容（1）商品基本信息：這是網(wǎng)店詳情頁最基本的內(nèi)容之一，主要用來介紹商品的名稱、品牌、型號、結構、材質(zhì)、作用、尺寸及質(zhì)量等。（2）商品展示圖：精選少量商品圖片用來展示商品，讓顧客對商品建立直接印象。（3）商品焦點圖：通過挖掘商品的特點，表現(xiàn)商品的獨特優(yōu)勢，呈現(xiàn)商品的賣點，吸引顧客。（4）商品細節(jié)圖：主要對商品的一部分關鍵細節(jié)進行詳細描述，讓顧客近距離地了解商品的優(yōu)點相關知識三、模糊濾鏡在“濾鏡”菜單的“模糊”子菜單中有11種用于模糊圖像的濾鏡。這些濾鏡應用的場合各不相同，如“高斯模糊”是最常用的圖像模糊濾鏡；“模糊”“進一步模糊”屬于無參數(shù)模糊，適合于輕微模糊；“表面模糊”“特殊模糊”常用于圖像降噪；“動感模糊”“徑向模糊”可沿一定方向進行模糊；“方框模糊”“形狀模糊”是以特定的形狀進行模糊；“鏡頭模糊”常用于模擬大光圈攝影效果；“平均”用于獲取整個圖像的平均顏色值。下面重點介紹高斯模糊、徑向模糊、方框模糊3種濾鏡。相關知識1.高斯模糊高斯模糊是最常用、最重要的模糊濾鏡，它可以向圖像中添加低頻細節(jié)，使圖像產(chǎn)生一種朦朧的模糊效果。2.徑向模糊徑向模糊是一種特殊的模糊濾鏡，是模擬縮放或旋轉(zhuǎn)相機時所產(chǎn)生的模糊，可以將圖像圍繞一個指定的圓心，沿著圓的圓周或半徑方向進行模糊，從而產(chǎn)生一種柔化的模糊效果。3.方框模糊方框模糊是基于相鄰像素的平均顏色值來模糊圖像的，生成的效果類似于方塊模糊。思考練習一、操作題設計并制作一件商品的詳情頁。二、簡答題1.在Photoshop中如何繪制表格？2.給圖像對象填色除了運用油漆桶工具和漸變工具外，還有什么方法？3.在漸變編輯器中如何設置多顏色的漸變效果？4.詳情頁由哪些元素構成？任務4霓虹燈字設計項目四

電商圖像設計學習目標●掌握電商中藝術字體的設計思路和方法?！衲苁炀氝\用快捷鍵進行圖層的復制和移動?！襁M一步熟悉描邊、內(nèi)陰影、內(nèi)發(fā)光、外發(fā)光、投影等圖層樣式。任務分析文字是網(wǎng)店展示商品的重要形式，是傳達商品信息的主要載體，經(jīng)過精心設計的藝術字體更加能吸引觀眾，增強視覺體驗。藝術字體不管是在電商設計中還是在廣告設計中，都有廣泛的應用。任務分析本任務以“3.8”霓虹燈字的設計為例，介紹電商文字設計的基本思路和方法，效果圖如圖所示。霓虹燈字體的制作主要通過做出文字立體感，并疊加圖層樣式來實現(xiàn)。本任務的學習重點是運用圖層設計電商特效文字。任務實施1．新建圖像文件單擊“文件”菜單中的“新建”命令，彈出“新建”對話框，命名為“霓虹燈字效果”，設置寬度為800像素，高度為500像素，分辨率為72像素/英寸，顏色模式為RGB顏色、8位，背景內(nèi)容為黑色，如圖所示。設置完成后，單擊“確定”按鈕。任務實施2．繪制背景、添加文字（1）新建圖層，單擊“畫筆工具”按鈕，在工具選項欄中設置畫筆為柔邊緣，畫筆大小為1000像素，硬度為0%，模式為濾色，不透明度為100%，顏色為#450578。調(diào)整好畫筆后，在畫布的中上方單擊一下，單擊圖層面板中的“圖層1”，設置不透明度為60%，效果圖如圖所示。任務實施2．繪制背景、添加文字（2）單擊“橫排文字工具”按鈕，在工具選項欄中設置字體為ArialBoldItalic，大小為160點，顏色為#5d00a6，分三個圖層在畫布中輸入“3.8”三個字符，用“移動工具”調(diào)整三個字符的位置。效果圖如圖所示。任務實施3．制作立體文字（1）單擊文字圖層“3”，按“Ctrl+T”鍵對文字進行變形，顯示“3”的變換控件，按“↓”鍵，再按“回車”鍵確認，文字就向下移動了一個像素。（2）再按10次“Ctrl+Alt+Shift+T”鍵，得到10個拷貝圖層。圖層面板如圖所示。任務實施3．制作立體文字（3）用同樣的方法，做出另外兩個字符的立體效果，如圖所示。任務實施4．描邊（1）選中文字圖層“3”并右擊，在彈出的快捷菜單中選擇“混合選項”，彈出“圖層樣式”對話框，勾選“描邊”選項，設置大小為2像素，位置為內(nèi)部，字體顏色為白色，如圖所示。任務實施4．描邊（2）復制描邊圖層，在圖層面板中復制的描邊圖層上右擊，在彈出的快捷菜單中選擇“柵格化圖層樣式”，增加描邊效果，將圖層名字改為“3柵格化圖層樣式”，調(diào)整好位置。任務實施4．描邊（3）用同樣的方法做出另外兩個字符的樣式，效果圖如圖所示。任務實施5．設置內(nèi)部文字樣式單擊圖層面板中的“3拷貝10”圖層，依次添加“內(nèi)陰影”“內(nèi)發(fā)光”“外發(fā)光”“投影”4種圖層樣式，具體參數(shù)設置依次如圖所示。任務實施5．設置內(nèi)部文字樣式任務實施5．設置內(nèi)部文字樣式設置圖層樣式后的效果圖如圖所示。任務實施6．調(diào)整線條效果單擊文字“3”圖層（即描邊圖層樣式圖層），依次添加“描邊”“內(nèi)陰影”“內(nèi)發(fā)光”“外發(fā)光”“投影”幾種圖層樣式，其中“描邊”中的漸變參數(shù)為橙黃橙漸變，具體參數(shù)設置依次如圖所示。任務實施6．調(diào)整線條效果任務實施6．調(diào)整線條效果任務實施6．調(diào)整線條效果任務實施6．調(diào)整線條效果設置圖層樣式后的效果圖如圖所示。任務實施7．保存圖像文件單擊“文件”菜單中的“存儲為”命令，在彈出的對話框中選擇以JPG格式保存。完成后退出PhotoshopCC2015。注意事項1．在設計藝術字時，最好將文字單個分開制作，以方便后期的調(diào)整。如先制作一種文字效果，再用同樣的方法迅速完成其他文字效果。2．描邊類型的藝術字體應選擇筆畫相對較粗的字體進行處理，以便更好地展示出效果。3.Photoshop中的文字工具是最常用、最重要的工具之一，可以使用文字工具在圖像中添加文字及各種效果的文字圖片。相關知識圖層樣式是一種附加在圖層上的“特殊效果”。Photoshop中共有10種圖層樣式，這些樣式既可以單獨使用，又可以多種樣式同時使用。本任務中用到了“描邊”“內(nèi)陰影”“內(nèi)發(fā)光”“外發(fā)光”“投影”等圖層樣式。相關知識一、描邊描邊效果可以用顏色、漸變以及圖案來描繪圖像的輪廓邊緣。圖所示為“描邊”圖層樣式設置界面，在該界面中可以設置描邊大小、位置、混合模式、不透明度、填充類型等。相關知識二、內(nèi)陰影內(nèi)陰影效果可以在緊靠圖層內(nèi)容的邊緣添加陰影，使圖像內(nèi)容產(chǎn)生向畫面內(nèi)側凹陷的效果。圖所示為“內(nèi)陰影”圖層樣式設置界面。相關知識三、內(nèi)發(fā)光與外發(fā)光內(nèi)發(fā)光效果是指沿圖層內(nèi)容的邊緣向內(nèi)創(chuàng)建發(fā)光效果，其設置界面如圖所示。相關知識四、投影投影效果是指為圖層模擬出投影效果，用于增加某部分的層次感和立體感，其設置界面如圖所示。思考練習一、操作題制作“爆款”字樣的霓虹燈字，效果圖如圖所示。思考練習二、簡答題1.圖層樣式“描邊”有什么作用？2.“外發(fā)光”“內(nèi)發(fā)光”分別可以制作什么效果？3.在Photoshop中，文字圖層與其他圖層之間有何異同？任務5網(wǎng)店Banner設計項目四

電商圖像設計學習目標●掌握直線工具、多邊形套索工具和文字處理工具的使用方法?！衲苁炀毷褂米远ㄐ螤罟ぞ摺！裾莆請D片排版的基本技巧?！裾莆账囆g字體的運用。任務分析在電商裝修中，Banner作為一個網(wǎng)店的招牌，是商品能否吸引顧客點擊購買的關鍵，也是橫幅廣告的一種表現(xiàn)形式。橫幅廣告又稱旗幟廣告，它是橫跨于網(wǎng)頁上的矩形公告牌，當用戶點擊這些橫幅時，通常可以鏈接到廣告的主網(wǎng)頁。網(wǎng)店Banner制作需要學生綜合運用Photoshop中所學的工具來完成。任務分析某運動用品網(wǎng)店需要在“6·18”大促活動日來臨之際，設計制作一組網(wǎng)店Banner圖片，完成店鋪裝修，效果圖如圖所示。任務分析橫幅廣告設計主要由圖形、文字和矢量圖形組成。首先用多邊形套索工具和直線工具繪制多彩的背景效果，用文字工具處理文字效果，用自定形狀工具繪制裝飾的五角星形，形成最終效果圖。本任務的學習重點是自定形狀工具的使用和文字的排版技巧。任務實施1．新建圖像文件單擊“文件”菜單中的“新建”命令，彈出“新建”對話框，如圖所示，設置寬度為727像素，高度為416像素，分辨率為72像素/英寸，顏色模式為RGB顏色、8位，背景內(nèi)容為白色。設置好參數(shù)后，單擊“確定”按鈕。任務實施2．制作背景（1）新建圖層組，圖層組命名為“背景”。（2）在“背景”圖層組中新建圖層2，在工具箱中設置前景色為#e8e5d4，按“Alt+Delete”鍵填充前景色，降低背景明度，提升圖片質(zhì)感。（3）新建圖層3，單擊“多邊形套索工具”按鈕，在左上角繪制三角形選區(qū)。（4）新建圖層4，單擊“多邊形套索工具”按鈕，在三角形下方繪制四邊形選區(qū)。任務實施2．制作背景（5）重復使用多邊形套索工具，分別繪制右下角的四邊形，并填充相應的顏色（從下往上的顏色：#274f57、#941f16、#466b7e、#274f57、#466b7e和#274f57），背景效果圖如圖所示，圖層排列順序如圖所示。任務實施2．制作背景（6）在“背景”圖層添加線條裝飾。單擊“直線工具”按鈕，繪制三條直線，線條顏色為#274f57，填補背景留白處，如圖所示。任務實施3．打開素材圖像文件單擊“文件”菜單中的“打開”命令，彈出“打開”對話框，選中“籃球.jpg”，單擊“確定”按鈕打開素材圖片。任務實施4．摳選素材圖片（1）因素材圖片背景為白色，顏色單一，可選用“快速選擇工具”或“魔棒工具”對籃球進行摳圖。（2）在選框內(nèi)右擊，在彈出的快捷菜單中選擇“選擇反向”命令（或按快捷鍵“Ctrl+Shift+I”），即可選取籃球區(qū)域，如圖所示。任務實施4．摳選素材圖片（3）單擊圖層面板中“背景”組左側的下三角形，隱藏“背景”組下面的圖層，如圖所示。（4）選中“背景組”圖層，單擊“移動工具”按鈕，將選取的籃球拖曳到新建的Banner畫布中，按“Ctrl+T”鍵調(diào)整大小并移至合適的位置，如圖所示。任務實施5．制作廣告字（1）單擊“橫排文字工具”按鈕，輸入“WANG-ZHE籃球”，字體為方正粗黑宋簡體Regular，顏色為白色，字號為100點。（2）按“Ctrl+T”鍵對文字進行自由變換，調(diào)整尺寸大小和擺放位置，如圖所示。任務實施5．制作廣告字（3）按“Ctrl+J”鍵復制文字圖層，將前景色設置為#941f15，按“Alt+Delete”鍵將復