版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請(qǐng)進(jìn)行舉報(bào)或認(rèn)領(lǐng)
文檔簡介
項(xiàng)目九綜合實(shí)戰(zhàn)項(xiàng)目簡介本項(xiàng)目重點(diǎn)圍繞數(shù)碼產(chǎn)品、母嬰產(chǎn)品以及化妝品的首頁設(shè)計(jì)與制作展開學(xué)習(xí)。在綜合實(shí)戰(zhàn)中,分別設(shè)計(jì)了網(wǎng)站首頁、網(wǎng)店首頁及無線端首頁的設(shè)計(jì)三個(gè)任務(wù)。首頁內(nèi)容主要圍繞6.18年中大促、雙十一等活動(dòng)展開,目的是使學(xué)生掌握網(wǎng)站首頁的組成及布局,明確美工崗位的任務(wù)及職責(zé),熟悉網(wǎng)店的常見活動(dòng)類型,以及無線端首頁布局、常用的圖片類型及規(guī)格等。項(xiàng)目目標(biāo)
能讀懂客戶反饋信息。能根據(jù)客戶反饋信息進(jìn)行網(wǎng)站首頁、PC端活動(dòng)首頁、無線端活動(dòng)首頁設(shè)計(jì)。掌握不同類目產(chǎn)品的網(wǎng)頁色彩搭配規(guī)律。能夠結(jié)合活動(dòng)主題進(jìn)行活動(dòng)首頁氛圍營造。能綜合應(yīng)用Photoshop制作完整頁面。培養(yǎng)綜合運(yùn)用所學(xué)知識(shí)、技能和經(jīng)驗(yàn),進(jìn)行全面思考、分析、實(shí)踐和創(chuàng)新的能力。任務(wù)一
制作數(shù)碼產(chǎn)品類網(wǎng)站【任務(wù)介紹】本任務(wù)是為數(shù)碼產(chǎn)品類網(wǎng)站設(shè)計(jì)制作首頁。通過本任務(wù)的學(xué)習(xí),學(xué)生應(yīng)能運(yùn)用合理的排版布局,設(shè)計(jì)出具有網(wǎng)站特色的首頁。在制作過程中,用到較多的知識(shí)點(diǎn)是矩形形狀的繪制與復(fù)制、對(duì)齊等操作,剪貼組的使用,文字的字體、大小以及顏色的靈活變化等。同時(shí),還要能通過繪制不規(guī)則形狀、修改不透明度等操作來完成不同分區(qū)的背景底紋?!救蝿?wù)描述】“數(shù)碼生活商城”主營手機(jī)通信、計(jì)算機(jī)配件、數(shù)碼攝影三大類的主流品牌產(chǎn)品,現(xiàn)需要對(duì)該網(wǎng)站首頁進(jìn)行全面改版。設(shè)計(jì)師和客戶溝通后得到需求信息,見表9-1。同時(shí),客戶提供了主要產(chǎn)品照片、價(jià)格、相關(guān)參數(shù)(店鋪活動(dòng)內(nèi)容等信息見資源包)。【任務(wù)實(shí)施】網(wǎng)站首頁是一個(gè)網(wǎng)站的入口頁面,一般被認(rèn)為具有目錄性質(zhì)。因此,網(wǎng)站首頁應(yīng)該易于消費(fèi)者了解該網(wǎng)站主營產(chǎn)品、整體風(fēng)格等信息,可讀性強(qiáng)、便于閱讀,并引導(dǎo)消費(fèi)者瀏覽網(wǎng)站其他部分的內(nèi)容。第一步:網(wǎng)站首頁設(shè)計(jì)思路分析。設(shè)計(jì)師針對(duì)客戶需求信息表對(duì)網(wǎng)站首頁進(jìn)行規(guī)劃。1.首頁布局(1)首頁自上向下共分為六大版塊:頂部、導(dǎo)航區(qū)、廣告區(qū)、活動(dòng)區(qū)、分類區(qū)以及底部。網(wǎng)站首頁整體效果及頁面布局見圖9-1。圖9-1網(wǎng)站首頁布局(2)頂部、導(dǎo)航區(qū)、廣告區(qū)采用半透明不規(guī)則三角形疊放背景,搭配數(shù)碼產(chǎn)品的金屬質(zhì)感,營造大氣、時(shí)尚的氛圍。(3)活動(dòng)區(qū)商品分類盡量細(xì)化,方便顧客快速找到需要的產(chǎn)品,再搭配幾款主推產(chǎn)品和店鋪主要活動(dòng),采用拼圖的形式進(jìn)行排版。(4)分類區(qū)按照產(chǎn)品分為三個(gè)模塊:1F、2F、3F。每個(gè)模塊都有相應(yīng)的活動(dòng)區(qū)、熱門推薦產(chǎn)品、細(xì)化的分類選項(xiàng),方便顧客了解優(yōu)惠活動(dòng)、熱銷產(chǎn)品,根據(jù)產(chǎn)品分類、產(chǎn)品品牌等多種瀏覽習(xí)慣進(jìn)行閱讀。(5)底部展示消費(fèi)者保障、購物須知等內(nèi)容,體現(xiàn)網(wǎng)站的資質(zhì)和服務(wù)。同時(shí),針對(duì)目前手機(jī)端成交遠(yuǎn)高于pc端的特點(diǎn),可用二維碼引導(dǎo)顧客下載數(shù)碼生活商城APP,對(duì)手機(jī)端應(yīng)用進(jìn)行推廣。2.網(wǎng)站配色由于本網(wǎng)站經(jīng)營的主要是數(shù)碼產(chǎn)品,所以采用的是藍(lán)白色調(diào)系列,再加上橘、紅、黃色的搭配,既能體現(xiàn)出產(chǎn)品的高端品質(zhì)及科技感,又使畫面更加富有生氣,給人一種朝氣蓬勃、與時(shí)俱進(jìn)的感覺。3.技術(shù)處理本任務(wù)中使用較多的知識(shí)點(diǎn)包括以下幾個(gè):(1)繪制大小不同的矩形做基底層,創(chuàng)建剪貼組,如頂部、導(dǎo)航區(qū)、廣告區(qū)效果的制作,就是將半透明不規(guī)則三角形和這三個(gè)區(qū)域不同的小的矩形創(chuàng)建為剪貼組。(2)利用“鋼筆”工具繪制不同的形狀,填充不同的顏色,通過修改不透明度等參數(shù),完成不同的背景制作,如頂部、導(dǎo)航區(qū)、廣告區(qū)的半透明三角形繪制及1F、2F、3F的活動(dòng)區(qū)三角形繪制。使用鋼筆工具精摳圖片的過程非??简?yàn)?zāi)托呐c細(xì)心,同學(xué)們應(yīng)當(dāng)將一絲不茍、精益求精的工匠精神融入每一步操作、每一個(gè)環(huán)節(jié),做出打動(dòng)人心的產(chǎn)品效果,給客戶無可挑剔的體驗(yàn)。(3)利用圖層樣式制作文字的漸變、投影等效果。(4)利用圖層蒙版對(duì)產(chǎn)品進(jìn)行摳圖。(5)通過文字的字體、大小及顏色的靈活應(yīng)用,對(duì)每個(gè)區(qū)域進(jìn)行有效的排版和布局。第二步:操作實(shí)施設(shè)計(jì)師與客戶溝通設(shè)計(jì)思路后形成可行的實(shí)施方案,以下為操作步驟。一、新建文檔新建文件,名稱為數(shù)碼網(wǎng)站首頁,設(shè)置自定義尺寸為1600PX*3186PX,背景為白色,其他取默認(rèn)值。二、頂部制作1.三角形紋理制作(1)繪制矩形形狀,大小設(shè)為1600PX*110PX,無描邊,藍(lán)色填充:#1e9ae4。(2)使用“鋼筆”工具繪制不規(guī)則三角形形狀,無描邊,藍(lán)色填充:#1a8de1,并創(chuàng)建剪貼組。(3)同樣的方法繪制不同大小、形狀的不規(guī)則三角形,填充不同深淺的藍(lán)色,顏色代碼分別為:#35a4e7、#25b2eb、#21a4e7、#26b4eb、#23ace9、#2bc5f0、#21a3e7、#26b3eb、#1b90e1,并創(chuàng)建剪貼組,繪制效果如圖9-2。2.LOGO制作(1)通過橢圓形選區(qū)相減,完成月牙形狀選區(qū)的繪制,填充黑色。圖9-2頂部三角形紋理制作效果(2)為形狀添加斜面和浮雕及顏色疊加效果,參數(shù)設(shè)置見圖9-3和圖9-4。圖9-3斜面和浮雕參數(shù)設(shè)置圖9-4顏色疊加參數(shù)設(shè)置小技巧
藍(lán)色矩形在作為頂部背景的同時(shí),作為剪貼組的基底層可以控制所繪制的三角形紋理的邊緣區(qū)域;對(duì)于所繪制的三角形,通過改變其不透明度,也可以達(dá)到不同的顏色效果。
通過添加“斜面和浮雕”圖層樣式,可以為對(duì)象創(chuàng)建立體效果,而“顏色疊加”樣式的設(shè)置,可以創(chuàng)建不同的顏色效果。(3)通過旋轉(zhuǎn)復(fù)制、更改疊加顏色,完成LOGO的制作,效果見圖9-5。圖9-5完整LOGO效果小貼士
圖形的旋轉(zhuǎn)復(fù)制操作具體如下:1.變形:按組合鍵<CTRL+T>,設(shè)置旋轉(zhuǎn)中心、旋轉(zhuǎn)角度及縮放比例等。2、復(fù)制并重復(fù)操作:按<CRTL+AlT+SHIFT+T>組合鍵進(jìn)行復(fù)制。三、導(dǎo)航區(qū)制作1.背景紋理制作(1)繪制矩形形狀,大小設(shè)為1600PX*40PX,無描邊,深灰色填充:2e3135。(2)使用鋼筆工具繪制多個(gè)不規(guī)則三角形,分別為黑色和白色填充,調(diào)整各個(gè)三角形不同的透明度,并創(chuàng)建剪貼組。繪制效果見圖9-6。圖9-6導(dǎo)航區(qū)三角形紋理2.右側(cè)紅色部分制作(1)使用“鋼筆”工具繪制紅色區(qū)域路徑,見圖9-7。(2)單擊圖層面板底部的“創(chuàng)建新的填充或調(diào)整圖層”按鈕,選擇“漸變”,在“漸變填充”對(duì)話框中設(shè)置為“#fa2c2d”到“#c50404”的線性漸變,對(duì)話框見圖9-8。圖9-7紅色區(qū)域路徑圖9-8漸變填充對(duì)話框(3)同樣使用“鋼筆”工具繪制兩個(gè)類似的形狀圖層,顏色分別為“#e01819”和“#490403”,制作紅色部分的陰影,并將以上各層創(chuàng)建為剪貼組。效果見圖9-9。圖9-9紅色區(qū)域完成效果3.輸入文字,繪制心形等圖標(biāo)(1)輸入“首頁”、“手機(jī)”、“計(jì)算機(jī)整機(jī)”、“筆記本電腦”、“平板電腦”等文字,顏色為白色,消除鋸齒,選項(xiàng)選擇“無”,在深色背景上能夠凸顯出來。(2)利用“自定形狀”工具完成“心形”、“房子”兩個(gè)圖標(biāo)的繪制。導(dǎo)航區(qū)局部效果見圖9-10。圖9-10導(dǎo)航區(qū)局部效果圖四、廣告區(qū)制作1.繪制矩形形狀,大小設(shè)為1600PX*450PX,無描邊,藍(lán)色:#0c53bb。作為整個(gè)廣告區(qū)剪貼組的基底層。2.背景紋理繪制徑向漸變的矩形,以及不同透明度和不同形狀的白色三角形。效果見圖9-11。圖9-11廣告區(qū)背景圖3.將“手機(jī)”素材圖片的置入到文件,使用“魔棒”工具選擇素材白色背景,創(chuàng)建選區(qū),添加蒙版,實(shí)現(xiàn)摳圖效果。4.利用矩形工具繪制紅色矩形,并輸入廣告區(qū)文字,設(shè)置合適的字體、字號(hào)、顏色,完成廣告區(qū)制作。效果見圖9-12。圖9-12廣告區(qū)效果圖五、活動(dòng)區(qū)及分類區(qū)制作1.整體背景制作(1)繪制白色矩形形狀,大小為1200PX*2713PX,同背景層水平居中對(duì)齊。(2)獲取白色矩形選區(qū),設(shè)置羽化值:15-20,在白色矩形圖層下面新建圖層,添加黑白線性漸變,為白色矩形創(chuàng)建陰影效果。效果見圖9-13。圖9-13添加的陰影效果圖(3)利用“鋼筆”工具,分別繪制不同顏色的形狀圖層,制作矩形圖層下方左右兩側(cè)的裝飾效果,完成背景繪制。效果見圖9-14和圖9-15。圖9-14矩形左側(cè)裝飾圖9-15矩形右側(cè)裝飾2.商品分類列表制作(1)利用“矩形”工具,繪制商品分類列表背景。(2)同樣使用“矩形”工具,繪制兩條細(xì)線,制作分類中的分割線條效果,并復(fù)制多條分割線。效果見圖9-16。圖9-16商品分類列表背景及分割線(3)輸入文字,宋體、白色、14點(diǎn)、消除鋸齒的方法:無。效果見圖9-17。圖9-17商品分類列表整體效果3.活動(dòng)專區(qū)制作(1)背景:利用“矩形”工具繪制各個(gè)活動(dòng)專區(qū)背景區(qū)域,并利用“漸變”工具填充相應(yīng)的背景色。(2)摳圖:由于所提供素材,背景均為白色,可置入圖片后,使用“魔棒”工具選擇白色背景區(qū)域,添加黑色蒙版,完成不同圖片的摳圖效果。(3)陰影:為了增加產(chǎn)品的立體感,可在產(chǎn)品的相應(yīng)位置,通過柔角畫筆,繪制與背景色相近的區(qū)域,作為相應(yīng)產(chǎn)品的投影,如“5折優(yōu)惠購買”區(qū)的各個(gè)產(chǎn)品。(4)投影:手機(jī)的鏡面投影,可通過復(fù)制圖層、垂直翻轉(zhuǎn)、降低不透明度等操作完成,并通過圖層蒙版控制其顯示區(qū)域。(5)在不同的位置輸入文字,并設(shè)置文字的屬性。活動(dòng)專區(qū)效果見圖9-18。圖9-18活動(dòng)專區(qū)效果4.今日推薦制作(1)使用“矩形”工具繪制各個(gè)背景色塊。(2)輸入文字并設(shè)置文字屬性。(3)使用“自定形狀”工具,繪制“時(shí)鐘”效果。今日推薦區(qū)效果見圖9-19。圖9-19今日推薦專區(qū)效果5.分類區(qū)制作對(duì)于分類區(qū),只對(duì)手機(jī)通信類左側(cè)的活動(dòng)區(qū)背景的制作加以說明。(1)繪制藍(lán)色矩形形狀作為背景,同時(shí)作為剪貼組的基底層,顏色:#2e84ee,大小為360PX*420PX。(2)繪制多個(gè)寬度不同的白色矩形形狀,降低其不透明度,并以上面創(chuàng)建的藍(lán)色矩形作基底層,創(chuàng)建剪貼組,效果見圖9-20。(3)繪制大小、顏色不同的圓,并且創(chuàng)建剪貼組,效果見圖9-21。圖9-20繪制線條效果圖圖9-21繪制不同的圓形效果圖(4)選擇“自定形狀”工具,繪制矩形平行線條,效果見圖9-22。(5)再次選擇“橢圓”工具,并在選項(xiàng)欄中選擇“與形狀區(qū)域相交”命令,繪制圓形,參數(shù)及效果見圖9-23、圖9-24。圖9-22矩形平行線效果圖9-23選項(xiàng)欄參數(shù)圖9-24取交集后的結(jié)果(6)繪制大小、顏色不同的自定形狀,效果見圖9-25。(7)用“鋼筆”工具繪制不同的三角形狀,設(shè)置不同的填充色,效果見圖9-26。圖9-25自定形狀繪制效果圖9-26繪制不同三角形狀后的效果六、底部制作(1)繪制不同大小的矩形形狀,填充相應(yīng)的顏色,作為底部背景。(2)設(shè)置不同的字體、大小及顏色,輸入相應(yīng)的文字。(3)運(yùn)用“橢圓”工具設(shè)置相應(yīng)的描邊大小及顏色(無填充色),完成相應(yīng)的圓形繪制。(4)通過復(fù)制等操作,完成數(shù)碼商城底部的制作。效果見圖9-27。圖9-27網(wǎng)站底部效果七、保存文件(1)按組合鍵<Ctrl+S>保存文檔為PSD格式。(2)按組合鍵<Ctrl+Shift+S>保存文檔為JPEG格式?!九e一反三】隨著電子商務(wù)的不斷發(fā)展,某數(shù)碼企業(yè)為了擴(kuò)大經(jīng)營,需要制作網(wǎng)上購物獨(dú)立網(wǎng)站,現(xiàn)需要對(duì)網(wǎng)站首頁進(jìn)行設(shè)計(jì)。設(shè)計(jì)師與客戶溝通后得到需求信息,見表9-2。請(qǐng)根據(jù)以上客戶需求信息,為該網(wǎng)站進(jìn)行首頁模塊布局設(shè)計(jì)(繪制頁面布局草圖,參考圖9-1)。【任務(wù)評(píng)價(jià)】任務(wù)二
母嬰產(chǎn)品類雙十一首頁設(shè)計(jì)【任務(wù)介紹】本任務(wù)是設(shè)計(jì)制作母嬰產(chǎn)品類網(wǎng)店的首頁。通過雙十一活動(dòng)的首頁改版設(shè)計(jì),學(xué)生應(yīng)明確活動(dòng)的常見表現(xiàn)手法、促銷手段等。在制作過程中,用到較多的知識(shí)點(diǎn)仍然是矩形形狀的繪制與復(fù)制、對(duì)齊等操作,圖層蒙版、剪貼組的使用,文字的字體、大小及顏色的靈活變化等,以及不同背景的繪制和圖層樣式的運(yùn)用等。【任務(wù)描述】“愛貝貝”是一家經(jīng)營多年的母嬰產(chǎn)品類網(wǎng)店,雙十一即將來臨,需要對(duì)店鋪首頁進(jìn)行改版,營造雙十一網(wǎng)購狂歡節(jié)節(jié)日氣氛。設(shè)計(jì)師與客戶溝通后得到需求信息,見表9-3。同時(shí),客戶提供了雙十一店鋪活動(dòng)內(nèi)容(主要產(chǎn)品照片、價(jià)格、超值推薦產(chǎn)品等信息見資源包)?!救蝿?wù)實(shí)施】第一步:網(wǎng)店首頁設(shè)計(jì)思路分析1.首頁布局(1)本網(wǎng)店首頁自上向下共分為五大版塊:店招、導(dǎo)航區(qū)、廣告區(qū)、活動(dòng)區(qū)及底部,其中活動(dòng)區(qū)又進(jìn)一步細(xì)分為優(yōu)惠券活動(dòng)區(qū)、禮品區(qū)、超值推薦區(qū)及特惠專區(qū)四種促銷活動(dòng)分區(qū)。(2)因?yàn)槭怯与p十一的活動(dòng),所以網(wǎng)店首頁以活動(dòng)區(qū)為主體,為了營造節(jié)日氣氛,分別在店招、導(dǎo)航區(qū)等區(qū)域添加了雙十一活動(dòng)鏈接,在廣告區(qū)推出了主打產(chǎn)品,在活動(dòng)區(qū)設(shè)置了雙十一活動(dòng)口號(hào),甚至在特惠專區(qū)進(jìn)行了主圖打標(biāo)。(3)關(guān)于各種活動(dòng)的文字表述清晰,不模糊、無歧義,可以讓客戶無憂購物,不會(huì)被欺騙。(4)為了迎合活動(dòng)區(qū)口號(hào),在網(wǎng)頁的各個(gè)區(qū)域都放置了禮物盒圖標(biāo)。網(wǎng)站首頁整體效果及頁面布局見圖9-28。小貼士
常見的促銷手段包括:優(yōu)惠券、滿額贈(zèng)、爆款單品、限時(shí)搶購、打折扣、幸運(yùn)抽獎(jiǎng)、買贈(zèng)、包郵、主圖打標(biāo)等。
還可以在店招、廣告區(qū)、首頁、詳情頁、主圖,以及無線端的店招、首頁等設(shè)置直通車、鉆石展位、推廣圖片制作等。圖9-28網(wǎng)店首頁布局2.網(wǎng)店首頁配色由于網(wǎng)店經(jīng)營的是母嬰產(chǎn)品,所以采用的是純度較高的多種顏色的搭配,既給人一種母親般溫馨、安全的感覺,又體現(xiàn)出嬰兒般活潑、生動(dòng)的氣息,更要給客戶營造一種喜慶、熱烈的節(jié)日氣氛及可信賴感。3.技術(shù)處理:本任務(wù)中涉及以下幾個(gè)較常用的技術(shù)處理方法:(1)利用波浪濾鏡快速制作波浪線效果。(2)利用矩形的變形及顏色亮度的變化,制作立體圖形效果,如“購買即送精品好禮”禮品展臺(tái)制作。(3)通過圖形的旋轉(zhuǎn)、復(fù)制與變形及<Ctrl+T>、<Ctrl+Alt+T>、<Ctrl+Alt+Shift+T>等快捷操作,快速對(duì)圖形進(jìn)行連續(xù)變形及復(fù)制操作,如廣告區(qū)的光射線制作。(4)利用“圖層樣式”的“混合選項(xiàng)”進(jìn)行摳圖,如廣告區(qū)白云圖層的摳圖效果。第二步:操作實(shí)施設(shè)計(jì)師與客戶溝通設(shè)計(jì)思路后形成可行的實(shí)施方案,以下為操作步驟。一、新建文件新建文件“母嬰雙十一.psd”,設(shè)置自定義尺寸為1920PX*5226PX,其他取默認(rèn)值。二、添加輔助線:分別在橫坐標(biāo)360PX、465PX、1455PX、1560PX處拖動(dòng)四條垂直輔助線。小貼士
通常,淘寶首頁寬度為950PX,天貓首頁寬度為990PX,為了美觀,一般都將首頁設(shè)為全屏寬度1920PX,為了兼容不同分辨率的顯示器,通常將網(wǎng)頁的有效范圍設(shè)置在990PX-1200PX,店招及導(dǎo)航條的寬度設(shè)為990PX。三、店招制作1.背景制作(1)繪制矩形形狀,大小設(shè)為1920PX*120PX,無描邊,玫紅色填充:#ff426a。(2)使用“鋼筆”工具依次繪制三個(gè)不同形狀的三角形,無描邊,黃色填充:#fdc901,并同上面的矩形創(chuàng)建剪貼組。2.網(wǎng)店LOGO的制作(1)用“自定形狀”工具繪制兩個(gè)大小不同的心形形狀,無描邊,白色填充:#ffffff。(2)獲取兩個(gè)形狀的交集選區(qū),創(chuàng)建新圖層,填充與矩形形狀相同的背景色:#ff426a;鏈接三個(gè)圖層,完成效果及圖層效果見圖9-29和圖9-30。圖9-29心形效果圖圖9-30圖層效果(3)“愛貝貝”:華康娃娃體W5,40點(diǎn),白色,平滑。(4)LOVEBABY:華康龍門石碑體W9,20點(diǎn),白色,平滑。(5)“有愛相伴,為愛而生”:黑體,14點(diǎn),白色,平滑。3.素材的添加(1)置入相應(yīng)的圖片素材,縮放至合適的大小,通過圖層蒙版完成摳圖,注意他們的擺放位置及圖層順序。(2)相關(guān)圖層進(jìn)行鏈接。4.文字的輸入(1)“鉅惠雙十一”:華康海報(bào)體W12,34點(diǎn),紅色:#f20124,平滑。(2)“母嬰囤貨大作戰(zhàn)”:華康海報(bào)體W12,34點(diǎn),紅色:#f20124,平滑。5.其他(1)漸變矩形條的繪制:繪制矩形,填充白色透明線性漸變,效果及參數(shù)設(shè)置見圖9-31和圖9-32。圖9-31漸變矩形條效果圖圖9-32漸變填充參數(shù)設(shè)置(2)“正、藏”字背景制作:1)繪制矩形形狀,大小為32PX*3PX,無描邊,藍(lán)色填充:#2e68af。2)創(chuàng)建圖層,繪制矩形形狀,大小為30PX*30PX,無填充色,描邊顏色為灰-白-灰的線性漸變,描邊寬度為1PX。3)分別輸入文字“正、藏”,設(shè)為黑體,19點(diǎn),白色,平滑。(3)“正品保障”,“Genulne”,“收藏我們”,”BookMark”:黑體,14點(diǎn),白色,平滑。(4)鏈接相應(yīng)的圖層。小貼士
不同圖層對(duì)象的交集選區(qū)的創(chuàng)建:1.按<CTRL>鍵,同時(shí)單擊圖層縮略圖,獲得一個(gè)圖層的選區(qū)。2、按<CRTL+alt+SHIFT>組合鍵,同時(shí)單擊另一圖層縮略圖,獲得兩個(gè)圖層對(duì)象的交集選區(qū)。小技巧
通過對(duì)多個(gè)圖層設(shè)置鏈接,可以把他們作為一個(gè)整體,以便調(diào)整他們的大小,保證這幾個(gè)圖層上的圖形對(duì)象的相對(duì)位置不變、縮放比例相同。四、導(dǎo)航區(qū)制作(1)繪制矩形形狀,大小設(shè)為1920PX*30PX,無描邊,藍(lán)色填充:#2697f7。(2)繪制矩形形狀,大小設(shè)為217PX*40PX,無描邊,紫色填充:#a10cb7。(3)置入素材文件001,通過選區(qū)工具獲取“雙11全球狂歡節(jié)”文字選區(qū),并調(diào)整至合適的大小及位置,創(chuàng)建圖層,填充白色,并刪除素材文件。(4)輸入導(dǎo)航條中的文字:”所有商品””首頁””貝親專場”……,設(shè)為宋體、14點(diǎn),白色填充,消除鋸齒選項(xiàng)選擇“無”。(5)在文字“首頁”的位置繪制矩形形狀,大小為58PX*30PX,玫紅色填充:#f81131,無描邊,并調(diào)整圖層順序。(6)在文字“關(guān)注我們”的位置繪制矩形形狀,大小為95PX*30PX,黃色填充:#f0ff00,無描邊,并調(diào)整圖層順序。導(dǎo)航條整體效果見圖9-33。圖9-33導(dǎo)航條整體效果五、廣告區(qū)制作1.背景制作(1)在導(dǎo)航條下方繪制矩形形狀,藍(lán)白線性漸變填充,大小為:1920PX*715PX。(2)打開素材文件006,將之復(fù)制到當(dāng)前圖層之上,調(diào)整至合適的位置并創(chuàng)建剪貼組。(3)雙擊圖層縮略圖,打開”圖層樣式”對(duì)話框,在“混合顏色帶”下拉列表中選擇藍(lán)色,按住<ALT>鍵向左拖動(dòng)本圖層右側(cè)的滑塊,使本圖層的藍(lán)色變淺,同下層融為一體,參數(shù)設(shè)置見圖9-34,混合效果見圖9-35。圖9-34圖層混合參數(shù)設(shè)置圖9-35圖層混合效果(4)新建圖層,繪制矩形選區(qū),填充白色,旋轉(zhuǎn)并復(fù)制白色矩形,生成放射狀效果,設(shè)置圖層的不透明度為66%,創(chuàng)建剪貼組,繪制效果見圖9-36。圖9-36白色矩形呈放射狀效果(5)使用“鋼筆”工具繪制不同的形狀,填充不同的顏色,完成效果見圖9-37。圖9-37繪制不同的形狀效果操作貼士
在對(duì)矩形條做旋轉(zhuǎn)復(fù)制時(shí),按組合鍵<CTRL+ALT+T>,可以將矩形條原位復(fù)制,并可調(diào)整其旋轉(zhuǎn)中心及旋轉(zhuǎn)角度,按住<ALT>鍵可精確拖動(dòng)中心點(diǎn)至合適位置,按組合鍵<CTRL+ALT+SHIFT+T>可重復(fù)操作。2.文字的輸入(1)“好禮送不停點(diǎn)亮11.11”:設(shè)為華康海報(bào)體w12,110點(diǎn)、白色,平滑。設(shè)置外發(fā)光效果。(2)“全店滿599減50上不封頂”:設(shè)為華康娃娃體w5,36點(diǎn),黃色:#f7ec09,平滑,并復(fù)制上面的外發(fā)光圖層樣式。文字效果見圖9-38。圖9-38輸入文字后效果3.素材的添加(1)用“鋼筆”工具繪制多個(gè)不規(guī)則形狀,黃色填充:#f9c401,添加相同的投影,效果見圖9-39。圖9-39繪制不規(guī)則形狀(2)置入相應(yīng)的素材文件,調(diào)整至合適的大小及位置,通過圖層蒙版完成摳圖,注意圖層的順序。選用素材圖片時(shí),應(yīng)注意不能出于商業(yè)目的,隨意去掉圖片水印從而濫用網(wǎng)上圖片。網(wǎng)上水印圖片屬于以水印方式進(jìn)行署名的署名圖片,著作權(quán)人以外的人以裁掉水印方式下載使用這些圖片構(gòu)成侵權(quán),因此同學(xué)們應(yīng)時(shí)刻樹立誠信守法的思想意識(shí)。(3)使用“橢圓”工具繪制大小不同的圓,填充不同的顏色,無描邊。廣告區(qū)最終完成效果見圖9-40。圖9-40廣告區(qū)最終效果六、活動(dòng)區(qū)制作(一)優(yōu)惠券活動(dòng)區(qū)制作1.背景制作(1)繪制矩形形狀,大小為1920PX*540PX,黃色填充:#fecc0d,并通過添加錨點(diǎn),調(diào)整形狀,完成效果見圖9-41。圖9-41繪制矩形形狀效果2)復(fù)制該圖層并進(jìn)行柵格化處理,再添加波浪形扭曲濾鏡,參數(shù)設(shè)置見圖9-42。向下移動(dòng)圖層對(duì)象至合適位置后,合并圖層,添加投影效果,投影顏色為暗紅色:#cc2147其他參數(shù)設(shè)置及完成效果見圖9-43和圖9-44。圖9-42“波浪”濾鏡參數(shù)設(shè)置
圖9-43添加投影效果參數(shù)設(shè)置小技巧
繪制矩形形狀后,選中路徑,通過“鋼筆”工具添加錨點(diǎn),調(diào)整錨點(diǎn)位置,可以使圖形產(chǎn)生變形效果。圖9-44添加投影后效果2.優(yōu)惠券制作(1)新建圖層,創(chuàng)建矩形選區(qū)大小為370PX*145PX,填充白色。(2)選擇選區(qū)選項(xiàng)欄中“與選區(qū)交叉”按鈕后,創(chuàng)建適當(dāng)大小選區(qū),填充暗紅色:#da5a06。(3)選擇“橡皮擦”工具,按功能鍵<F5>打開“畫筆”對(duì)話框,調(diào)整筆觸大小及間距后,按住<SHIFT>鍵沿矩形塊向右側(cè)拖動(dòng),完成優(yōu)惠券右側(cè)鋸齒的繪制。(4)輸入文字,并設(shè)置相應(yīng)的字體、大小及顏色。(5)繪制矩形路徑,大小為360PX*15PX,選中路徑,添加錨點(diǎn),修改路徑形狀,效果見圖9-45。(6)將路徑轉(zhuǎn)換為選區(qū),設(shè)置羽化值為5,創(chuàng)建圖層,填充黑色,設(shè)置圖層的不透明度為40%,完成優(yōu)惠券陰影的制作,效果見圖9-46。(7)調(diào)整圖層及圖層對(duì)象的位置,優(yōu)惠券整體制作效果見圖9-47。(8)以同樣的操作,完成其他優(yōu)惠券的制作。圖9-45修改路徑形狀圖9-46優(yōu)惠券陰影效果圖9-47優(yōu)惠券整體制作效果3.其他文字的輸入“先領(lǐng)券再購物”:設(shè)為華康海報(bào)體w12,67點(diǎn)、深紅色:#da5a06,平滑,添加白色描邊及投影。小技巧
通過繪制選區(qū)、羽化、填充顏色、設(shè)置不透明度,手動(dòng)完成陰影效果的制作,從而達(dá)到事半功倍的效果。(二)禮品區(qū)制作1.背景制作(1)繪制矩形形狀,大小為1920PX*730PX,填充玫色:#ffaa2b7。2)復(fù)制該圖層并進(jìn)行柵格化處理,再添加波浪形扭曲濾鏡,向下移動(dòng)圖層對(duì)象至合適位置后,合并圖層,添加投影效果,投影顏色為深藍(lán)色:#056cc4。背景效果見圖9-48。圖9-48禮品區(qū)背景效果2.形狀繪制(1)繪制矩形形狀,大小為390PX*55PX,填充紫紅色:#db284e,無描邊。(2)復(fù)制該圖層,調(diào)整圖層對(duì)象的位置,透視變形,并修改填充色:#ff426a,完成商品展臺(tái)制作,效果見圖9-49。(3)通過復(fù)制等操作,完成其他兩組商品展臺(tái)的制作。圖9-49商品展臺(tái)效果(4)繪制圓角矩形形狀,大小為350PX*5PX,圓角半徑為10PX,紅色填充:#ff426a。5)為矩形形狀添加描邊、漸變疊加及投影等圖層樣式,效果見圖9-50。(6)通過復(fù)制等操作,完成其他兩組圓角矩形的制作。3.禮品的添加:置入相應(yīng)的素材文件,調(diào)整至合適的大小及位置,通過圖層蒙版完成摳圖。圖9-50圓角矩形制作效果4.文字的輸入(1)“嬰兒護(hù)理濕巾80抽*1包”“軟膠沙灘玩具10件套裝”“嬰兒洗衣液1.2L*3瓶”:設(shè)為黑體,33點(diǎn),白色,平滑。(2)“單筆訂單實(shí)付滿218元”“單筆訂單實(shí)付滿438元”“單筆訂單實(shí)付滿658元”:華康儷金黑體W8,34點(diǎn),白色,平滑。(3)“購買就送精品好禮”:華康海報(bào)體W12,67點(diǎn),深藍(lán)色:#6b448f,平滑,并添加大小為6PX的白色描邊。禮品區(qū)整體制作效果見圖9-51。圖9-51禮品區(qū)整體制作效果(三)超值推薦區(qū)制作1.背景制作用禮品區(qū)背景制作的方法制作超值推薦區(qū)背景。2.標(biāo)題制作(1)“超值推薦”:華康娃娃體W5,72點(diǎn),火紅色:#ff426a,平滑,并添加大小為3PX的白色描邊。(2)“超值推薦產(chǎn)品不再參加其他雙十一活動(dòng)”:黑體,30點(diǎn),純黑色,平滑。(3)“雙11全球狂歡節(jié)”:同導(dǎo)航條中“雙11全球狂歡節(jié)”的制作。(4)繪制圓角矩形形狀,大小為750PX*90PX,圓角半徑為10PX,無填充,白色描邊,大小為2PX,柵格化矩形形狀,并擦除部分區(qū)域,完成效果見圖9-52。圖9-52超值推薦區(qū)標(biāo)題效果3.下部廣告1區(qū)的制作(1)繪制矩形形狀,大小為590PX*300PX,無描邊,淡粉色填充:#fef5f0。(2)復(fù)制該圖層,并將矩形形狀原位縮小至565PX*270PX,作為剪貼組的基底層。(3)用“鋼筆”工具繪制不規(guī)則形狀,填充線性漸變,并創(chuàng)建剪貼組。(4)復(fù)制該圖層,修改漸變填充顏色,調(diào)整至合適位置,創(chuàng)建剪貼組,效果見圖9-53。圖9-53廣告1區(qū)背景效果(5)置入相應(yīng)的素材,縮放至合適的大小,調(diào)整位置,圖層蒙版摳圖,完成素材的添加。(6)輸入相應(yīng)的文字,設(shè)置不同的字體、大小、顏色及圖層樣式等,完成廣告1區(qū)的制作,效果見圖9-54。圖9-54廣告1區(qū)整體制作效果4.下部廣告2區(qū)的制作(1)繪制矩形形狀,大小為590PX*300PX,無描邊,淡粉色填充:#fef5f0。(2)繪制矩形選區(qū),大小為565PX*270PX,填充徑向漸變,效果見圖9-55。(3)繼續(xù)繪制矩形選區(qū),大小為565PX*72PX,填充徑向漸變,創(chuàng)建剪貼組,效果見圖9-56。圖9-55廣告2區(qū)背景效果1圖9-56廣告2區(qū)背景效果2(4)創(chuàng)建白色矩形形狀,設(shè)為半透明,復(fù)制若干個(gè),對(duì)齊,平均分布后合并圖層,并復(fù)制該圖層,生成圖層副本,對(duì)該圖層創(chuàng)建剪貼組。(5)選中圖層副本,對(duì)其進(jìn)行透視變形,創(chuàng)建剪貼組,效果見圖9-57。(6)置入相應(yīng)的素材文件007、016、017,縮放至合適的大小,并調(diào)整其位置及圖層順序,通過圖層蒙版完成摳圖,完成效果見圖9-58。圖9-57廣告2區(qū)背景效果3圖9-58廣告2區(qū)添加素材效果(7)通過柔角畫筆,在三個(gè)素材所在圖層的下面為其繪制陰影,并創(chuàng)建剪貼組,效果見圖9-59。(8)為活動(dòng)區(qū)添加文字,效果如圖9-60。(9)使用圓形畫筆,通過疊加完成白色云朵的繪制,并添加斜面和浮雕及陰影效果,再通過復(fù)制、縮放完成多個(gè)云朵的繪制,效果見圖9-61。圖9-59廣告2區(qū)素材添加陰影效果圖9-60廣告2區(qū)添加文字效果圖9-61廣告2區(qū)添加云朵后效果(10)繪制兩個(gè)相交的圓形形狀,設(shè)置“與形狀區(qū)域相交”完成月亮的繪制,并設(shè)置斜面和浮雕及投影樣式,完成效果見圖9-62和圖9-63。圖9-62繪制月亮圖9-63月亮的最終效果(11)使用“自定形狀”工具及”矩形”工具完成五星形狀的繪制,并設(shè)置斜面和浮雕及投影效果,參數(shù)設(shè)置同月亮,調(diào)整圖層的順序,并創(chuàng)建剪貼組。廣告2區(qū)完成效果見圖9-64。圖9-64廣告2區(qū)完成效果小技巧
為產(chǎn)品繪制陰影,可增強(qiáng)立體感,使效果更逼真。
一個(gè)基底層可以為多個(gè)連續(xù)的內(nèi)容層創(chuàng)建剪貼組。5.下部廣告4區(qū)的制作(1)繪制矩形形狀,大小為590PX*300PX,無描邊,淡粉色填充:#fef5f0。(2)復(fù)制該圖層,并將矩形形狀原位縮小至565PX*270PX,作為剪貼組的基底層,填充藍(lán)色線性漸變,背景效果見圖9-65。(3)置入木質(zhì)素材文件028,柵格化圖層,完成效果見圖9-66。圖9-65廣告4區(qū)背景效果圖9-66木質(zhì)素材效果(4)復(fù)制該圖層,調(diào)整新圖層對(duì)象的位置、透視變形,并對(duì)這兩個(gè)圖層創(chuàng)建剪貼組,效果見圖9-67和圖9-68。圖9-67木質(zhì)素材透視效果圖9-68木質(zhì)素材創(chuàng)建剪貼組后效果(5)繪制藍(lán)色矩形條,置入童車素材,縮放至合適大小,調(diào)整其位置,通過圖層蒙版完成摳圖,用柔角畫筆繪制童車的陰影效果,并調(diào)整圖層的順序,完成效果見圖9-69。(6)添加其他素材,輸入文字,設(shè)置相應(yīng)的字體、大小及顏色,完成廣告4區(qū)的制作,效果見圖9-70。圖9-69添加童車效果圖9-70廣告4區(qū)完成效果(四)特惠專區(qū)制作(1)背景及頂部文字的制作及超值推薦區(qū)的制作相似。(2)通過文字等工具完成一款主圖的制作后,通過復(fù)制圖層組,修改相應(yīng)的產(chǎn)品素材及產(chǎn)品名稱、價(jià)格等文字,即可完成其他主圖的制作。(3)通過選項(xiàng)欄中的“對(duì)齊”、“分布”按鈕同樣可以實(shí)現(xiàn)圖層組的分布與對(duì)齊操作,見圖9-71。圖9-71特惠專區(qū)部分效果七、底部制作(1)新建圖層,繪制矩形選區(qū),填充相應(yīng)的顏色。(2)使用“文字”工具設(shè)置不同的字體、大小及顏色,完成文字的輸入。(3)使用“矩形”工具,完成矩形框的繪制。見圖9-72。圖9-72底部效果圖八、禮盒的制作(1)置入相應(yīng)的素材文件,調(diào)整至合適的大小及位置,通過圖層蒙版完成摳圖。(2)降低圖層透明度,完成禮盒的添加,注意圖層的順序。九、保存文件(1)按組合鍵<Ctrl+S>保存文檔為PSD格式。(2)按組合鍵<Ctrl+Shift+S>保存文檔為JPEG格式?!九e一反三】某母嬰類產(chǎn)品網(wǎng)站,需要在雙十一活動(dòng)期間對(duì)首頁進(jìn)行設(shè)計(jì),營造購物狂歡節(jié)日氣氛。設(shè)計(jì)師與客戶溝通后得到需求信息,見表9-4。請(qǐng)根據(jù)以上客戶需求信息,為該網(wǎng)站進(jìn)行首頁模塊布局設(shè)計(jì)(繪制頁面布局圖,參考圖9-28)?!救蝿?wù)評(píng)價(jià)】任務(wù)三
化妝品類618無線首頁設(shè)計(jì)制作【任務(wù)介紹】隨著移動(dòng)設(shè)備的逐漸普及,無線端網(wǎng)購已經(jīng)成為人們最主要的購物手段之一,因此本任務(wù)是通過制作618年中大促的網(wǎng)店首頁裝修,進(jìn)一步掌握相關(guān)活動(dòng)的頁面布局及常用的促銷手段,使整個(gè)無線端的頁面設(shè)計(jì)既符合產(chǎn)品的特點(diǎn),又能滿足客戶的夏日需求,更要達(dá)到網(wǎng)店的促銷目的。在制作過程中,用到較多的知識(shí)點(diǎn)仍然是不同形狀的繪制,圖層的復(fù)制、對(duì)齊等操作;圖層蒙版、剪貼組的使用;文字的字體、大小及顏色的靈活變化等;畫筆及圖層樣式的運(yùn)用等?!救蝿?wù)描述】某化妝品網(wǎng)店要在618年中大促中推出以防曬系列為主打的產(chǎn)品促銷活動(dòng),為了配合618活動(dòng),需要對(duì)手機(jī)端首頁進(jìn)行設(shè)計(jì)。店主對(duì)美工提出設(shè)計(jì)要求:網(wǎng)店采用多種促銷手段,讓客戶感受到實(shí)實(shí)在在的優(yōu)惠;頁面在保持清晰美觀、方便客戶瀏覽的同時(shí),也要讓客戶感受到“絲絲涼爽”,從而提高購買率。設(shè)計(jì)師與客戶溝通后得到需求信息,見表9-5。同時(shí),客戶提供了618年中大促店鋪活動(dòng)內(nèi)容(主要產(chǎn)品照片、價(jià)格等信息見資源包)。在應(yīng)用案例素材圖片進(jìn)行設(shè)計(jì)的過程中,如果使用非原創(chuàng)素材圖片(尤其是作為商用),使用之前必須取得權(quán)利人的書面授權(quán),避免因知識(shí)產(chǎn)權(quán)侵權(quán)行為給自己帶來不必要的麻煩?!救蝿?wù)實(shí)施】第一步:網(wǎng)店首頁設(shè)計(jì)思路分析:設(shè)計(jì)師針對(duì)客戶需求信息表進(jìn)行設(shè)計(jì)思路分析:1.首頁布局(1)本網(wǎng)店將店招設(shè)計(jì)為750px×254px,首頁設(shè)計(jì)為750px×5625px。(2)本網(wǎng)店首頁自上而下共分為四大版塊:店招、首焦海報(bào)、活動(dòng)區(qū)及底部。其中,店招單獨(dú)作為一個(gè)文件,活動(dòng)區(qū)又分為優(yōu)惠券、特別推薦、防曬專區(qū)、買三送一四個(gè)促銷區(qū),每個(gè)活動(dòng)分區(qū)都統(tǒng)一用醒目的拱形形狀來突出主題,讓人一目了然。首焦海報(bào)中“陪你度夏”四個(gè)字,給人一種溫馨的感覺,讓你情不自禁地進(jìn)入購物狀態(tài),珊瑚、海螺等素材的添加,仿佛讓你置身于海底世界,在炎炎夏日中絕對(duì)是一種享受。(3)因?yàn)?月18日正處于夏日,又是一個(gè)電商盛會(huì),所以本次活動(dòng)主推防曬系列產(chǎn)品,采用了優(yōu)惠券、買就送、主圖打標(biāo)等促銷手段,無處不在的“618年中狂歡節(jié)”字眼更是在時(shí)刻提醒客戶“買到就是賺到”。(4)首頁底部的制作效果,正好同店招做了首尾呼應(yīng)。店招及無線首頁整體效果及頁面布局見圖9-73。圖9-73無線首頁布局
小技巧無線端想要高銷量,不僅是做好無線端推廣引流的問題,還有就是店鋪能夠留住用戶,所以賣家在日常無線端的裝修上面也要花點(diǎn)功夫。首頁就是引流和達(dá)成轉(zhuǎn)化成交的第一步。我們需要通過店鋪真實(shí)成交量及生意參謀等輔助性軟件對(duì)店內(nèi)產(chǎn)品進(jìn)行分析并決定首頁的排布。頁面風(fēng)格的定位主要的目的是吸引消費(fèi)者目光、迎合大多買家的審美以及給自己的產(chǎn)品定位。2.網(wǎng)店首頁配色由于本網(wǎng)店經(jīng)營的是化妝品,活動(dòng)正值夏天,所以采用的是藍(lán)白色系,給人一種涼爽的感覺,同時(shí)背景采用水彩畫的顏色效果,正好給人一種化妝的感覺,再加上深深淺淺的紅、黃色相搭,表現(xiàn)的是一種豐富多彩的生活感。3.技術(shù)處理:本任務(wù)中使用較多的知識(shí)點(diǎn)包括以下幾個(gè):(1)用水彩畫筆繪制水彩效果背景,要結(jié)合畫筆的不透明度、流量、顏色等屬性設(shè)置,重復(fù)鋪色,達(dá)到真實(shí)的水彩畫效果。(2)利用文字工具及路徑文字,輸入“——”,方便快速地制作虛線效果。(3)制作產(chǎn)品的倒影,要注意產(chǎn)品底部的銜接與變形,才不會(huì)出現(xiàn)產(chǎn)品懸空的現(xiàn)象,使倒影更加真實(shí)。(4)利用不同明度的色塊,可以制作出立體效果。如產(chǎn)品的展臺(tái)、“防曬專區(qū)”等標(biāo)題效果等。(5)注意選擇相同風(fēng)格的素材圖片,營造整體夏日度假水彩風(fēng)格。
第二步:操作實(shí)施設(shè)計(jì)師與客戶溝通設(shè)計(jì)思路后形成可行的實(shí)施方案,以下為操作步驟。一、店招制作(1)新建文件“化妝品618店招”,自定義尺寸為750PX*254PX;背景色為白色,其他取默認(rèn)值。(2)選擇“畫筆”工具,在工具選項(xiàng)欄中點(diǎn)按圓形畫筆圖標(biāo),打開“畫筆預(yù)設(shè)”選取器,選擇“舊版畫筆”中的“濕介質(zhì)畫筆”,參數(shù)及類型選擇見圖9-74和圖9-75。圖9-74舊版畫筆圖9-75濕介質(zhì)畫筆(3)新建圖層,選擇“粗頭水彩筆”,將間距設(shè)置為0,通過更改畫筆的筆觸大小、硬度、顏色、透明度、流量等,在新圖層上反復(fù)涂抹,繪制背景底色。(4)選擇菜單“濾鏡”→“雜色”→“添加雜色”,在彈出的對(duì)話框中設(shè)置數(shù)量為2%,高斯分布,單色,為背景添加雜點(diǎn)。參數(shù)設(shè)置及效果見圖9-76和圖9-77。圖9-76雜色濾鏡參數(shù)設(shè)置圖9-77店招背景制作效果(5)打開素材文件001、002、003,利用多種選區(qū)工具分別選取“珊瑚”、“貝殼”、“螃蟹”等圖形,復(fù)制到當(dāng)前文件中,并調(diào)整至合適的大小及位置,注意圖層的排列順序。(6)打開素材文件004,利用多種選區(qū)工具選取“6.18理想生活狂歡節(jié)”,復(fù)制到當(dāng)前文件中,并調(diào)整至合適的大小及位置,注意圖層的排列順序。(7)為當(dāng)前圖層添加“顏色疊加”及“描邊”樣式,疊加顏色設(shè)置為紅色:#fa607a,描邊顏色為白色,大小為2PX。效果見圖9-78。圖9-78店招整體效果二、首頁制作1.首焦海報(bào)制作(1)新建文件“化妝品618首頁”,自定義尺寸為750PX*5625PX;背景色為白色,其他取默認(rèn)值。(2)在380PX的位置新建一條水平參考線,參數(shù)設(shè)置見圖9-79。圖9-79參考線位置設(shè)置經(jīng)驗(yàn)分享
在380PX的水平參考線以上制作首焦海報(bào)效果,利用參考線準(zhǔn)確控制每一部分的尺寸及位置。整體效果完成后也要借助參考線進(jìn)行切圖。以下每一部分的制作都將新建參考線。(3)置入素材文件005,調(diào)整至合適大小及位置,注意圖層的排列順序。(4)打開素材文件004,利用多種選區(qū)工具選取“6.18理想生活狂歡節(jié)”,復(fù)制到當(dāng)前文件中,調(diào)整至合適大小及位置,注意圖層的排列順序。(5)為當(dāng)前圖層添加“顏色疊加”樣式,疊加顏色設(shè)置為紅色:“#fa607a”,效果見圖9-80。圖9-80素材文件004制作效果(6)分四個(gè)圖層分別輸入文字“陪”、“你”、“度”、“夏”,設(shè)為華康簡綜藝體,紅色:#fa607a,其中“陪”、“夏”大小為125PX,“你”、“度”大小為93PX。(7)柵格化“陪”、“夏”兩個(gè)圖層,并分別進(jìn)行透視變形。效果見圖9-81。圖9-81輸入文字后效果(1)(8)使用鋼筆工具沿著“陪你度夏”文字邊緣繪制一個(gè)黑色形狀圖層,以同樣的方法在黑色形狀圖層下方繪制一個(gè)稍大一點(diǎn)的藍(lán)色“2b89e1”形狀圖層,效果見圖9-82。圖9-82輸入文字后效果(2)(9)輸入文字“開啟你的夏日理想生活”,設(shè)為華康娃娃體W5,31點(diǎn),白色,并添加3PX大小的黑色描邊。(10)繪制黑色圓角矩形,圓角半徑為50PX,輸入文字“防曬大作戰(zhàn)
折后再優(yōu)惠”,設(shè)為華康儷金黑體W8(P),26點(diǎn),白色。(11)創(chuàng)建新組“首焦海報(bào)”,將以上各圖層移動(dòng)到“首焦海報(bào)”組內(nèi)。完成首焦海報(bào)制作,效果見圖9-83。圖9-83輸入文字后效果(3)2.“6.18”標(biāo)題制作(1)在660PX的位置新建一條水平參考線。(2)在“首焦海報(bào)”組上方創(chuàng)建新組,命名為“背景”。在組內(nèi)新建圖層,命名為“背景1”。(3)按照制作店招背景的方法,選擇“粗頭水彩筆”,將間距設(shè)置為0,通過更改畫筆的筆觸大小、硬度、顏色、透明度、流量等,在“背景1”圖層上反復(fù)涂抹,繪制背景底色。效果見圖9-84。圖9-84標(biāo)題背景制作效果(4)打開素材文件004,利用多種選區(qū)工具選取“6.18理想生活狂歡節(jié)”,復(fù)制到當(dāng)前文件中,調(diào)整至合適的大小及位置,注意圖層的排列順序。(5)為當(dāng)前圖層添加“顏色疊加”樣式,疊加顏色設(shè)為白色,效果見圖9-85。圖9-85添加標(biāo)題后效果3.優(yōu)惠券制作(1)在842PX的位置新建一條水平參考線。(2)打開素材文件002,利用多種選區(qū)工具分別選取“救生圈”圖形,復(fù)制到當(dāng)前文件中,調(diào)整至合適的大小及位置,注意圖層的排列順序。(3)輸入文字“先領(lǐng)券再購物”,設(shè)為華康儷金黑體W8,30點(diǎn),白色,并添加3PX大小的描邊,藍(lán)色:#0e74a4,效果見圖9-86。圖9-86“先領(lǐng)券再購物”效果(4)新建圖層,繪制矩形選區(qū),填充白色。(5)利用橡皮工具,選擇“粗頭水彩筆”,將間距設(shè)置為0,在白色矩形圖層邊緣進(jìn)行擦除。(6)打開素材文件001,利用多種選區(qū)工具分別選取“海螺”“貝殼”圖形,復(fù)制到當(dāng)前文件中,并調(diào)整至合適大小及位置,注意圖層的排列順序。(7)輸入文字“10”,設(shè)為華康雅宋體W9,90點(diǎn),紅色:#fa607a;輸入文字“全場滿199元使用”,設(shè)為黑體,18點(diǎn),灰色:#9f9f9f,效果見圖9-87。圖9-87單張優(yōu)惠券效果(8)通過復(fù)制完成其他優(yōu)惠券的制作,并利用前面的制作方法,完成“貝殼”“海螺”的添加。效果見圖9-88。4.“特別推薦”標(biāo)題制作(1)在1031Px的位置新建一條水平參考線。圖9-88優(yōu)惠券整體效果(2)繪制矩形形狀,大小為400PX*70PX,玫紅色填充:#fa607a,并通過添加錨點(diǎn)調(diào)整矩形形狀,效果見圖9-89。(3)用鋼筆工具繪制不規(guī)則形狀,玫紅色填充:#e23350,效果見圖9-90。圖9-89變形后的矩形形狀圖9-90繪制不規(guī)則形狀(4)用鋼筆工具繪制形狀圖層,深紅色填充:#be0f2c。(5)復(fù)制以上兩個(gè)圖層,并水平翻轉(zhuǎn),調(diào)整圖層的排列順序。(6)復(fù)制以上多個(gè)形狀圖層并合并圖層,修改為白色填充,調(diào)整圖層的排列順序。(7)打開素材文件004,利用多種選區(qū)工具選取“6.18”,復(fù)制到當(dāng)前文件中,并調(diào)整至合適的大小及位置,注意圖層的排列順序。(8)為當(dāng)前圖層添加“顏色疊加”樣式,疊加顏色設(shè)為白色。(9)用鋼筆工具繪制弧線,沿著弧線輸入文字“特別推薦”,設(shè)為華康海報(bào)體W12(P),45點(diǎn),白色,效果見圖9-91。5.特別推薦產(chǎn)品制作(1)在2157PX的位置新建一條水平參考線。(2)繪制圓角矩形形狀,大小為690PX*225PX,圓角半徑為100PX,藍(lán)色填充:#3b8fdb。圖9-91特別推薦最終效果(3)繪制另一個(gè)圓角矩形形狀,比藍(lán)色圓角矩形稍小,圓角半徑為100PX,無填充,白色虛線描邊,描邊寬度為1點(diǎn)。(4)利用鋼筆工具繪制四個(gè)四邊形形狀,并按照效果圖填充顏色,制作商品展示臺(tái)。(5)打開素材文件002、003,利用多種選區(qū)工具分別選取“珊瑚”“螃蟹”圖形,復(fù)制到當(dāng)前文件中,調(diào)整至合適的大小及位置,注意圖層的排列順序,效果見圖9-92。圖9-92添加素材后效果(6)將素材文件006拖動(dòng)到當(dāng)前文件中,用“鋼筆”工具對(duì)化妝品進(jìn)行摳圖,并利用圖層蒙版隱藏圖片白色背景。(7)復(fù)制當(dāng)前圖層,右鍵單擊該圖層,選擇“柵格化圖層”,選中該圖層蒙版,右鍵單擊圖層蒙版,選擇“應(yīng)用圖層蒙版”,并垂直翻轉(zhuǎn)該圖層,移動(dòng)到相應(yīng)的位置。(8)選中該圖層,按組合鍵<Ctrl+T>后,單擊鼠標(biāo)右鍵盤,在快捷菜單中選擇“變形”,對(duì)圖形進(jìn)行變形,使其更符合投影規(guī)律。設(shè)置效果見圖9-93、圖9-94。圖9-93素材變形設(shè)置圖9-94素材變形效果(9)為該圖層添加圖層蒙版,從上到下填充白色到黑色的線性漸變,并將圖層透明度更改為20%。(10)繪制圓角矩形形狀,大小為98PX*74PX,圓角半徑為5PX,填充紅色:#fa607a,在屬性面板中將左上角和右上角的圓角半徑修改為“0”。(11)為當(dāng)前圖層添加“投影”樣式,并適當(dāng)?shù)恼{(diào)整投影參數(shù),效果見圖9-95。圖9-95添加投影樣式后效果(12)打開素材文件004,利用多種選區(qū)工具分別選取“6.18”“狂歡節(jié)”圖形,復(fù)制到當(dāng)前文件中,并調(diào)整至合適的大小及位置,注意圖層的排列順序。(13)為“6.18”和“狂歡節(jié)”兩個(gè)圖層,添加“顏色疊加”樣式,疊加顏色為白色,效果見圖9-96。圖9-96設(shè)置顏色疊加后效果(14)繪制圓角矩形形狀,大小為180px×37px,圓角半徑為3px,并對(duì)圖層添加“漸變疊加”樣式,疊加顏色為#faf4d9到#fac393的線性漸變,角度為90°,效果見圖9-97。(15)繪制圓角矩形形狀,大小為88px×29px,圓角半徑為3px,并對(duì)圖層添加“漸變疊加”樣式,疊加顏色為#f8555d到#c8334f的線性漸變,角度為90°,效果見圖9-98。圖9-97漸變疊加效果1圖9-98漸變疊加效果2(16)輸入文字“純粹滋潤乳液“¥150”“立即搶購”,并按照效果圖設(shè)置字體、字號(hào)、顏色等,效果見圖9-99。圖9-99輸入文字后效果(17)通過復(fù)制圖層,并修改相應(yīng)的產(chǎn)品、文字、價(jià)格等操作,完成效果見圖9-100。圖9-100特別推薦產(chǎn)品制作效果6.防曬專區(qū)欄目標(biāo)題制作(1)在2344px的位置新建一條水平參考線。(2)新建圖層,按照制作店招背景的方法,選擇“粗頭水彩筆”,將間距設(shè)置為0,通過更改畫筆的筆觸大小、硬度、顏色、透明度、流量等,在圖層上反復(fù)涂抹,繪制背景底色,大約繪制1800px的高度。(3)復(fù)制“特別推薦”標(biāo)題制作“防曬專區(qū)”中的多個(gè)圖層,進(jìn)行相應(yīng)的文字修改,完成防曬專區(qū)標(biāo)題制作,效果見圖9-101。圖9-101防曬專區(qū)標(biāo)題
溫馨提示
- 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請(qǐng)下載最新的WinRAR軟件解壓。
- 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請(qǐng)聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
- 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會(huì)有圖紙預(yù)覽,若沒有圖紙預(yù)覽就沒有圖紙。
- 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
- 5. 人人文庫網(wǎng)僅提供信息存儲(chǔ)空間,僅對(duì)用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理,對(duì)用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對(duì)任何下載內(nèi)容負(fù)責(zé)。
- 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請(qǐng)與我們聯(lián)系,我們立即糾正。
- 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶因使用這些下載資源對(duì)自己和他人造成任何形式的傷害或損失。
最新文檔
- 2025-2030燃?xì)庠O(shè)備行業(yè)市場供需分析及投資評(píng)估規(guī)劃分析研究報(bào)告
- 2025-2030照明行業(yè)智能照明與節(jié)能技術(shù)發(fā)展分析
- 2025-2030熱泵技術(shù)行業(yè)市場需求現(xiàn)狀與產(chǎn)業(yè)鏈發(fā)展前景分析報(bào)告
- 2025-2030濰坊消防裝備行業(yè)市場供需分析及投資評(píng)估規(guī)劃分析研究報(bào)告
- 2025-2030湘菜地方標(biāo)準(zhǔn)制定對(duì)品質(zhì)提升的作用
- 2025-2030消防報(bào)警系統(tǒng)自動(dòng)化行業(yè)市場供需趨勢分析及智能防控規(guī)劃
- 2025-2030消防安全智能監(jiān)控設(shè)備行業(yè)發(fā)展趨勢標(biāo)準(zhǔn)制定與發(fā)展分析
- 2025-2030消費(fèi)級(jí)AR設(shè)備用戶體驗(yàn)痛點(diǎn)與改進(jìn)方向研究
- 2025-2030消費(fèi)級(jí)AR眼鏡光學(xué)方案創(chuàng)新與市場接受度調(diào)研
- 2025-2030消費(fèi)電子設(shè)備微小元器件加工工藝改進(jìn)與發(fā)展極品工藝方案研究
- 2025年中國電熱式脫皮鉗市場調(diào)查研究報(bào)告
- DBJT15-212-2021 智慧排水建設(shè)技術(shù)規(guī)范
- 新課標(biāo)文科全科-2026高考大綱TXT便利版
- (高清版)DBJ∕T 13-91-2025 《福建省房屋市政工程安全風(fēng)險(xiǎn)分級(jí)管控與隱患排查治理標(biāo)準(zhǔn)》
- 民辦學(xué)校退費(fèi)管理制度
- CJ/T 3066-1997內(nèi)磁水處理器
- 院內(nèi)急重癥快速反應(yīng)小組
- 湖南省省情試題及答案
- T/CIE 115-2021電子元器件失效機(jī)理、模式及影響分析(FMMEA)通用方法和程序
- 智能路燈項(xiàng)目立項(xiàng)申請(qǐng)報(bào)告模板
- 臨時(shí)用電變壓器安裝方案
評(píng)論
0/150
提交評(píng)論