PS教程:設(shè)計(jì)BoxedArt網(wǎng)站模板教程(2)
下一步,對(duì)每個(gè)郵票使用自由變換工具(CTRL+T),將他們調(diào)整不同的朝向給他們一種拍打的效果。這一步后,我們切換到文字工具,每個(gè)分類使用一種手寫字體。這里我用到的是 “Loved by the King”.最后我們的導(dǎo)航條就完成了。
第七步開始頂部介紹區(qū)域
首先創(chuàng)建一個(gè)新層(CTRL+SHIFT+N)在工具欄中選擇矩形選框工具。現(xiàn)在在頁(yè)面上創(chuàng)建一個(gè)矩形使用白色來(lái)填充。這塊區(qū)域?qū)⒈挥脕?lái)當(dāng)做一張白紙。
好了我們已經(jīng)完成白色紙張部分了,在白紙圖層下面創(chuàng)建另一個(gè)新層然后填充黑色,這個(gè)將用來(lái)創(chuàng)建陰影。完成之后我們轉(zhuǎn)到濾鏡>模糊>高斯模糊半徑設(shè)置為6.5.之后把這個(gè)層的不透明度設(shè)置為20%,向右移動(dòng)5pixels。然后添加主要的文字,這樣的話短語(yǔ)”Simplify and Save”會(huì)被用到,位于頂部紙張部分。
現(xiàn)在你看在白紙下面有陰影,但是紙張并不是粘在哪里的。所以我們?cè)诩垙埖囊贿厑?lái)添加一些膠帶,如先前的教程一樣,我們?cè)诹硪贿吿砑恿艘粋(gè)郵戳來(lái)保持畫面的平衡。在你的紙張完成后,我們選擇一些手寫字體來(lái)添加一些文字?雌饋(lái)的話想事包裹上的信息。最后加亮這些圖層按下CTRL+T自由變換工具,角度設(shè)為-1.5 degrees 使它看起來(lái)更加具有真實(shí)效果。
第八步 貼上一個(gè)便簽
我們使用了一個(gè)便簽設(shè)計(jì)來(lái)分開空間來(lái)介紹我們網(wǎng)站的優(yōu)惠注冊(cè)信息。這個(gè)在整個(gè)盒子主題上運(yùn)用的非常好,設(shè)計(jì)這樣一個(gè)便簽效果需要?jiǎng)?chuàng)建另一個(gè)新的圖層,選擇鋼筆工具使用鋼筆工具來(lái)繪制一個(gè)方形區(qū)域如下圖所示
在你完成之后轉(zhuǎn)到路徑面板,按住CTRL鍵點(diǎn)擊路徑圖層,接著你會(huì)看到方形區(qū)域已經(jīng)載入選區(qū)了,之后使用前景色#fffb78背景色#fffcd1從左上角到右下角繪制漸變。你將會(huì)看到這樣一個(gè)熟悉的黃色便簽紙形狀。
第九步
現(xiàn)在我們需要再一次添加陰影效果,給這個(gè)便簽紙?zhí)砑由疃,所以?chuàng)建另一個(gè)新層(CTRL+SHIFT+N)。過(guò)程如之前給白紙創(chuàng)建陰影差不多,但是是將不透明度設(shè)置為40%。你需要變換一下陰影來(lái)創(chuàng)建一種傾斜效果,輕微的拖動(dòng)一下如圖所示。
第十步給便簽紙?zhí)砑觾?nèi)容
下一步,給便簽紙?zhí)砑右恍┪淖,在我們的便簽紙中我們要添加一些加入等按鈕,為了創(chuàng)建相似的按鈕首先我們繪制一個(gè)盒子使用綠色填充,然后添加一個(gè)蒙板選擇一種grudge 筆刷。下一步遮住按鈕的一些部分看起來(lái)就像破損一樣,這就是我們創(chuàng)建郵戳的效果。
這個(gè)是最后呈現(xiàn)的效果。
BODY 部分
第十一步卷曲膠帶紙標(biāo)題
我們轉(zhuǎn)到body的內(nèi)容部分。在這個(gè)設(shè)計(jì)中,我們要?jiǎng)?chuàng)建2欄和一些圖標(biāo)。我們使用的是已經(jīng)有的圖標(biāo)因?yàn)槲覀兿矚g這種手寫效果包括Handy Icons and Sketchy icons.。在body開始的區(qū)域我們要一個(gè)標(biāo)題欄用來(lái)羅列我們網(wǎng)站的內(nèi)容。我們把這個(gè)header部分做成卷曲效果。至于說(shuō)到透明膠帶我們使用的來(lái)自bigstockphoto 的圖片。為了增加膠帶的深度,我使用矩形選框工具來(lái)選擇膠帶的一些區(qū)域。在選中選區(qū)后我們復(fù)制這個(gè)圖層按下ALT+SHIFT向左邊移動(dòng),然后在向右移動(dòng)一下使它看起來(lái)顯得長(zhǎng)一些。為了避免縫隙的產(chǎn)生我們使用圖章工具里拼合這些縫隙。可以查看下面的效果。
第十二步預(yù)覽下的小圖標(biāo)
BoxedArt網(wǎng)站的內(nèi)容區(qū)域包含很多網(wǎng)頁(yè)模板的預(yù)覽。創(chuàng)建這種效果我們需要選中矩形選框工具創(chuàng)建一個(gè)小的矩形,然后使用顏色#123057填充。 這些按鈕我們只要復(fù)制第一個(gè)圖層,移動(dòng)它到第一個(gè)圖層下面,設(shè)置這個(gè)圖層的透明度這里我們?cè)O(shè)置的為40%。重復(fù)同樣的步驟處理余下的按鈕。
第十三步使用針腳線來(lái)分開這些區(qū)域
為了分開這些主要的分類,為了創(chuàng)建這些虛線我們可以文字工具角度為90,把這些圖層的樣式設(shè)置為疊加,為了使這些顯眼點(diǎn)我們只需復(fù)制這個(gè)圖層2-3次至于顏色多深取決于你自己。
學(xué)習(xí) · 提示
相關(guān)教程
- 網(wǎng)頁(yè)模版,個(gè)人網(wǎng)站建設(shè)入門知識(shí)
- 網(wǎng)頁(yè)模板,設(shè)計(jì)酒吧主題網(wǎng)頁(yè)模板實(shí)例
- ps設(shè)計(jì)藍(lán)色主題風(fēng)格的網(wǎng)站首頁(yè)模板教程
- 從零手把手教你設(shè)計(jì)網(wǎng)頁(yè)
- ps cs6設(shè)計(jì)時(shí)尚促銷專題頁(yè)教程
- 網(wǎng)頁(yè)設(shè)計(jì)基礎(chǔ)技巧
- ps切片工具怎么用
- 網(wǎng)頁(yè)設(shè)計(jì)的分割布局秘密
- ps設(shè)計(jì)電影網(wǎng)站實(shí)例
- ps設(shè)計(jì)網(wǎng)頁(yè)視頻游戲界面
推薦教程
- PhotoShop設(shè)計(jì)制作懷舊風(fēng)格網(wǎng)頁(yè)的詳細(xì)教程
- PS教程:繪制清新的色彩生動(dòng)的網(wǎng)頁(yè)布局
- Photoshop制作禮品店網(wǎng)站模板
- Photoshop CS5制作放射狀光線網(wǎng)頁(yè)廣告板
- Photoshop繪制好看的老式wordpress主題
- PS教程:制作非常不錯(cuò)的wordpress博客網(wǎng)站模板
- Photoshop網(wǎng)頁(yè)設(shè)計(jì):雜志風(fēng)格網(wǎng)站界面
- Photoshop繪制木質(zhì)紋理的網(wǎng)站首頁(yè)模板
- ps設(shè)計(jì)制作居家風(fēng)格美食Blog網(wǎng)頁(yè)特效
- photoshop網(wǎng)頁(yè)應(yīng)用實(shí)例:制作蘋果導(dǎo)航欄