Photoshop圖像處理課件：網(wǎng)站Banner設(shè)計

Photoshop

圖像處理

電商圖像設(shè)計

網(wǎng)店店標(biāo)設(shè)計

網(wǎng)店店招的設(shè)計

0102電商圖像設(shè)計

網(wǎng)店詳情頁設(shè)計03

霓虹燈字設(shè)計04

網(wǎng)店Banner設(shè)計05網(wǎng)店Banner設(shè)計

電商圖像設(shè)計學(xué)習(xí)目標(biāo)●掌握直線工具、多邊形套索工具和文字處理工具的使用方法?！衲苁炀毷褂米远ㄐ螤罟ぞ?。●掌握圖片排版的基本技巧?！裾莆账囆g(shù)字體的運用。任務(wù)分析在電商裝修中，Banner作為一個網(wǎng)店的招牌，是商品能否吸引顧客點擊購買的關(guān)鍵，也是橫幅廣告的一種表現(xiàn)形式。橫幅廣告又稱旗幟廣告，它是橫跨于網(wǎng)頁上的矩形公告牌，當(dāng)用戶點擊這些橫幅時，通?？梢枣溄拥綇V告的主網(wǎng)頁。網(wǎng)店Banner制作需要學(xué)生綜合運用Photoshop中所學(xué)的工具來完成。任務(wù)分析某運動用品網(wǎng)店需要在“6·18”大促活動日來臨之際，設(shè)計制作一組網(wǎng)店Banner圖片，完成店鋪裝修，效果圖如圖所示。任務(wù)分析橫幅廣告設(shè)計主要由圖形、文字和矢量圖形組成。首先用多邊形套索工具和直線工具繪制多彩的背景效果，用文字工具處理文字效果，用自定形狀工具繪制裝飾的五角星形，形成最終效果圖。本任務(wù)的學(xué)習(xí)重點是自定形狀工具的使用和文字的排版技巧。任務(wù)實施1．新建圖像文件單擊“文件”菜單中的“新建”命令，彈出“新建”對話框，如圖所示，設(shè)置寬度為727像素，高度為416像素，分辨率為72像素/英寸，顏色模式為RGB顏色、8位，背景內(nèi)容為白色。設(shè)置好參數(shù)后，單擊“確定”按鈕。任務(wù)實施2．制作背景（1）新建圖層組，圖層組命名為“背景”。（2）在“背景”圖層組中新建圖層2，在工具箱中設(shè)置前景色為#e8e5d4，按“Alt+Delete”鍵填充前景色，降低背景明度，提升圖片質(zhì)感。（3）新建圖層3，單擊“多邊形套索工具”按鈕，在左上角繪制三角形選區(qū)。（4）新建圖層4，單擊“多邊形套索工具”按鈕，在三角形下方繪制四邊形選區(qū)。任務(wù)實施2．制作背景（5）重復(fù)使用多邊形套索工具，分別繪制右下角的四邊形，并填充相應(yīng)的顏色（從下往上的顏色：#274f57、#941f16、#466b7e、#274f57、#466b7e和#274f57），背景效果圖如圖所示，圖層排列順序如圖所示。任務(wù)實施2．制作背景（6）在“背景”圖層添加線條裝飾。單擊“直線工具”按鈕，繪制三條直線，線條顏色為#274f57，填補背景留白處，如圖所示。任務(wù)實施3．打開素材圖像文件單擊“文件”菜單中的“打開”命令，彈出“打開”對話框，選中“籃球.jpg”，單擊“確定”按鈕打開素材圖片。任務(wù)實施4．摳選素材圖片（1）因素材圖片背景為白色，顏色單一，可選用“快速選擇工具”或“魔棒工具”對籃球進(jìn)行摳圖。（2）在選框內(nèi)右擊，在彈出的快捷菜單中選擇“選擇反向”命令（或按快捷鍵“Ctrl+Shift+I”），即可選取籃球區(qū)域，如圖所示。任務(wù)實施4．摳選素材圖片（3）單擊圖層面板中“背景”組左側(cè)的下三角形，隱藏“背景”組下面的圖層，如圖所示。（4）選中“背景組”圖層，單擊“移動工具”按鈕，將選取的籃球拖曳到新建的Banner畫布中，按“Ctrl+T”鍵調(diào)整大小并移至合適的位置，如圖所示。任務(wù)實施5．制作廣告字（1）單擊“橫排文字工具”按鈕，輸入“WANG-ZHE籃球”，字體為方正粗黑宋簡體Regular，顏色為白色，字號為100點。（2）按“Ctrl+T”鍵對文字進(jìn)行自由變換，調(diào)整尺寸大小和擺放位置，如圖所示。任務(wù)實施5．制作廣告字（3）按“Ctrl+J”鍵復(fù)制文字圖層，將前景色設(shè)置為#941f15，按“Alt+Delete”鍵將復(fù)制的文字顏色填充為前景色，并將拷貝的文字圖層位置調(diào)整到白色文字圖層的下方。單擊“移動工具”按鈕，調(diào)整位置制作出簡單的藝術(shù)投影文字，如圖所示。任務(wù)實施5．制作廣告字（4）單擊“橫排文字工具”按鈕，輸入“CUBA職業(yè)聯(lián)賽官方指定用球”，字體為方正粗黑宋簡體Regular，顏色為白色，字號為33點。單擊“移動工具”按鈕，調(diào)整位置如圖所示。任務(wù)實施6．制作角標(biāo)（1）新建圖層，單擊“矩形選框工具”按鈕，在右上角繪制矩形選框。單擊“選擇”/“修改”/“平滑”，彈出“平滑選區(qū)”對話框，設(shè)置取樣半徑為8像素，單擊“確定”按鈕，如圖所示。前景色設(shè)置為#b23225，按“Alt+Delete”鍵將選區(qū)填充為前景色。任務(wù)實施6．制作角標(biāo)（2）單擊“矩形選框工具”按鈕，框選出圓角矩形的上半部分，右擊選擇“自由變換”，直接向上拉長出畫布，調(diào)整好后放置在合適的位置，如圖所示。任務(wù)實施6．制作角標(biāo)（3）單擊“橫排文字工具”按鈕，輸入“6·18運動上新”，字體為等線Light，顏色為白色，字號為20點，字間距為140，加粗，調(diào)整好位置，如圖所示。任務(wù)實施7．制作“立即搶購”效果（1）新建圖層，單擊“矩形選框工具”按鈕，在右下角繪制矩形選框。單擊“選擇”/“修改”/“平滑”，彈出“平滑選區(qū)”對話框，設(shè)置取樣半徑為8像素。前景色設(shè)置為白色，按“Alt+Delete”鍵將選區(qū)填充為前景色。（2）按“Ctrl+J”鍵復(fù)制圓角矩形，按“Ctrl”鍵并單擊復(fù)制圓角矩形圖層縮覽圖區(qū)域，載入圓角矩形選區(qū)。前景色設(shè)置為#466b7e，按“Alt+Delete”鍵將選區(qū)填充為前景色，將復(fù)制的圓角矩形圖層移至白色矩形圖層下面。單擊“移動工具”按鈕，將復(fù)制的圓角矩形移至合適的位置。任務(wù)實施7．制作“立即搶購”效果（3）選中復(fù)制的圓角矩形圖層，在圖層面板中右擊選擇“混合選項”，在彈出的“圖層樣式”對話框中選擇“投影”，做出與廣告字一樣的樣式設(shè)計，如圖所示。任務(wù)實施7．制作“立即搶購”效果（4）單擊“橫排文字工具”按鈕，輸入“立即搶購>”，在工具選項欄中設(shè)置字體為微軟雅黑Light，顏色為#466b7e，字號為20點，字間距為140，加粗，調(diào)整好位置，如圖所示。任務(wù)實施8．添加裝飾為了使圖像更加豐富，可以在籃球周圍添加五角星圖案。單擊“自定形狀工具”，在工具選項欄中設(shè)置模式為形狀，選擇“五角星”形狀，在畫布中繪制出大小不一的五角星圖案，隨意點綴在畫布中，效果圖如圖所示。任務(wù)實施9．保存圖像文件單擊“文件”菜單的“存儲為”命令，在彈出的對話框中分別選擇以PSD格式和JPG格式保存。完成后退出PhotoshopCC2015。注意事項1．在摳圖時，當(dāng)圖片背景是純色或非常簡單時，可以用“快速選擇工具”和“魔棒工具”來完成摳圖工作。2．要制作具有立體感的字體時，可以通過復(fù)制字體改變顏色，通過兩層字體間的錯位制作出投影的感覺，以增強字體的立體感。3．裝飾畫面時，裝飾物可以通過復(fù)制再自由變換快速地完成。4.使用直線工具繪圖時，同時按住“Shift”鍵，可以繪制水平直線、垂直直線和45°角直線。相關(guān)知識一、直線工具直線工具可以繪制直線或有箭頭的線段。光標(biāo)拖曳的起始點為線段起點，拖曳的終點為線段終點。按“Shift”鍵，可以使直線的方向控制在0、45°或90°。在“直線工具”選項欄中可以調(diào)整線條的粗細(xì)和顏色等，如圖所示。相關(guān)知識一、直線工具單擊“直線工具”選項欄中的，在其下拉菜單中可以設(shè)置箭頭的相關(guān)參數(shù)，如圖所示。相關(guān)知識二、創(chuàng)建自定形狀Photoshop自定形狀工具軟件自帶是有限的，可以在網(wǎng)上搜索下載更多需