當(dāng)前位置:首頁>ps實例教程>ps繪畫教程>鼠繪教程>教程內(nèi)容

ps鼠繪木頭書架教程(5)

來源:designfestival.com 作者:教程盒子 學(xué)習(xí):6060人次

目前,很多小說閱讀類APPS界面設(shè)計都采用了木質(zhì)書架,這種方式無疑是一個完美的方式。
今天,我們將指導(dǎo)您在Photoshop中創(chuàng)建一個木質(zhì)書架。在本教程中,你會學(xué)到如何創(chuàng)造木材紋理等許多的方便、快捷的技術(shù)。所以,廢話不多說,讓我們開始吧!

a570cfed8e2b0840f39db6b4f94486d4 在PHOTOSHOP中設(shè)計木制書架教程

第1步
在Photoshop中創(chuàng)建一個新的文檔,一個600px的寬度和800px高度。
2fa942dd175575e497ae099d3724c0d5 在PHOTOSHOP中設(shè)計木制書架教程

第2步
首先,我們將制作木質(zhì)紋理。創(chuàng)建一個新層,選擇“圖層”>“新建圖層”。使用油漆桶工具填充它可與任何顏色。設(shè)置前景和#dc8a24的背景顏色#ab540f,F(xiàn)在去“濾鏡”>“渲染”>“纖維”。使用以下參數(shù)設(shè)置。
8102c075a8d0d14de1a2600be0b82a19 在PHOTOSHOP中設(shè)計木制書架教程

第3步
現(xiàn)在,請按Ctrl +“T”激活“自由變換”工具。把寬度設(shè)置為50%,并向左移動到邊緣。
7f3d2cf93e7e4d64a100a788d206a212 在PHOTOSHOP中設(shè)計木制書架教程

復(fù)制紋理層,然后垂直翻轉(zhuǎn)。要做到這一點,請單擊“復(fù)制的圖層,轉(zhuǎn)到”編輯“>”變換“>”垂直翻轉(zhuǎn)。“
選擇這兩個紋理層,層上單擊右鍵,然后選擇“合并“圖層的選項。標(biāo)記這個新的合并層“木材紋理。”

第4步
接下來,添加雜色的紋理,去“濾鏡”>“雜色”>“添加雜色”使用下面的值。
7f23de35f65dbbb1dcb5200b5e1ad25e 在PHOTOSHOP中設(shè)計木制書架教程

第5步
現(xiàn)在,使用“濾鏡”>“液化”。使用向前變形工具,設(shè)置如下圖所示,并將其應(yīng)用在不同的地方在紋理隨機。
e1c97fce369951350f3e0c47276f559d 在PHOTOSHOP中設(shè)計木制書架教程

第6步
調(diào)整紋理圖層的大小,使用自由變換工具(CTRL +“T”),以及使用的值的寬度為560px和760px的高度。
35980bd19b9f54594713419d2e24663a 在PHOTOSHOP中設(shè)計木制書架教程

第7步
接下來,我們將制作書架邊緣。首先,選擇矩形工具畫一個矩形,如下圖所示。拉標(biāo)尺線來確定其左右的像素。
169fc6e298616d08f89be9ddd930019e 在PHOTOSHOP中設(shè)計木制書架教程

第8步
接下來,內(nèi)側(cè)的標(biāo)尺線對齊矩形,F(xiàn)在,矩形的寬度略有增加。
44b58d4824a524e5c97b7b1281954d70 在PHOTOSHOP中設(shè)計木制書架教程

現(xiàn)在,按Ctrl +鼠標(biāo)左鍵 點擊圖層縮略圖 ,得到該層選區(qū),選擇“木質(zhì)紋理圖層”按Ctrl +“C”復(fù)制粘貼Ctrl + “V”到一個新的圖層,。標(biāo)簽此層為“左邊框內(nèi)。”
694accd7b6cb6fe60e43bd4d31bfb044 在PHOTOSHOP中設(shè)計木制書架教程

第9步
雙擊“內(nèi)的左邊框”圖層,打開圖層樣式窗口,并使用以下設(shè)置顏色疊加。
f5b5c22ffe55c77b08c7fdcc7c89c66a 在PHOTOSHOP中設(shè)計木制書架教程

第10步
接下來,陰影部分。按Ctrl + “模糊”“高斯模糊”。這里使用的值為2px,向外拖動以使其可見。
9a49b09287aeb3d61ffd5a1de05b1506 在PHOTOSHOP中設(shè)計木制書架教程

第11步
選擇“左邊框”層,陰影跟該層新建為一個組,復(fù)制組,水平翻轉(zhuǎn)。將它放置內(nèi)的右側(cè)指南的創(chuàng)建相反的貨架。
5b0f61635c6fbda81fc0e518b741d539 在PHOTOSHOP中設(shè)計木制書架教程

第12步
繪制一個矩形,如下圖所示。
5eddb8e25787becbfd582c7361a7df52 在PHOTOSHOP中設(shè)計木制書架教程

現(xiàn)在,按Ctrl + ,F(xiàn)在,點擊木質(zhì)紋理,按Ctrl +“C”復(fù)制,然后按Ctrl +“V”粘貼選定的紋理到一個新的層。在那之后,進(jìn)入“編輯”>“變換”>“旋轉(zhuǎn)90⁰。將它放置在底部的紋理,如下圖所示。標(biāo)簽這層“貨架前。”然后,隱藏或刪除的矩形。
558eaba4c092b7197d63a55065617fef 在PHOTOSHOP中設(shè)計木制書架教程

第13步
應(yīng)用以下設(shè)置漸變疊加“貨架前”層。
5b9f6e9814b1c0f54c2265546d582d9d 在PHOTOSHOP中設(shè)計木制書架教程

第14步
復(fù)制“貨架前”該層,將其標(biāo)示為“貨架頂部,”把該層放置在原圖層的頂部,進(jìn)入“編輯”>“變換”>“扭曲”。使用此工具帶來的角落里面作為如下所示。
3d44ecbd1d60100b41d63209b36bd803 在PHOTOSHOP中設(shè)計木制書架教程

第15步
該層,應(yīng)用下面的圖層樣式設(shè)置。
8af836f80f31997a745ec3626664b8f2 在PHOTOSHOP中設(shè)計木制書架教程

a8fccf08c1840c78f68ea8a41799d282 在PHOTOSHOP中設(shè)計木制書架教程

4f98f6a5877e335198735f34e869d992 在PHOTOSHOP中設(shè)計木制書架教程

第16步
使陰影“貨架頂部”層中的相同的方式,如在步驟10中解釋。
7c3dc009944b3bb61b6e67cf9ccb673a 在PHOTOSHOP中設(shè)計木制書架教程

把剛剛做的圖層歸為一個組,并標(biāo)示為“書架底部。”

第17步
現(xiàn)在,在書架中間繪制一個矩形,如下圖所示。
cdcbd4b76cba21dddcda3c4c4e705362 在PHOTOSHOP中設(shè)計木制書架教程

拖動參考線,形成水平的貨架,如下圖所示。
c6aa173e778bd8ef2f8bb5c6b5d0c226 在PHOTOSHOP中設(shè)計木制書架教程

第18步
重復(fù)的“書架底部”層和位置,如下圖所示。
4af1fc2d8ceb1da71c2eace108b1dcdc 在PHOTOSHOP中設(shè)計木制書架教程

創(chuàng)建陰影部分,繪制一個矩形和應(yīng)用7px的高斯模糊濾鏡。
80473fdb1a8609054eccc03136621e57 在PHOTOSHOP中設(shè)計木制書架教程

第19步
現(xiàn)在,使用“多邊形套索”工具,選擇一個三角形區(qū)域上的陰影層。
2b76a8c76e24c01b91e1fad9e8f1bf1b 在PHOTOSHOP中設(shè)計木制書架教程

之后,進(jìn)入“編輯”>“清除”。右側(cè)也用同樣的方式設(shè)置,陰影層的不透明度降低到50%。
0aa32937cfcd72bde3fb34308be21752 在PHOTOSHOP中設(shè)計木制書架教程

第20步
同樣的,為該層歸類分組“中間書架”,”復(fù)制,在每個水平線上面放置改組。如下圖所示,。
627ebaa07a0d50e3097b3e096b091cbe 在PHOTOSHOP中設(shè)計木制書架教程

第21步
創(chuàng)建頂部邊框,從剛剛的中間組里面選擇實用的圖層復(fù)制,移動到標(biāo)尺線的上方。
eae700f31cb4f9baa00cb4c5275eecf6 在PHOTOSHOP中設(shè)計木制書架教程

第22步
我們的木質(zhì)書架已經(jīng)完成,接下來我們將為整個書架創(chuàng)建陰影部分。具體方法不再提示。
3794d321a72ac84ce7eced2003b44664 在PHOTOSHOP中設(shè)計木制書架教程

把剛剛下載的書籍封面放入書架,同樣陰影部分是必須的。有光源的地方必有陰影。
4032e2650913660064533a0c556b3411 在PHOTOSHOP中設(shè)計木制書架教程

學(xué)習(xí) · 提示

  • 一定要打開PS,跟著教程做一遍,做完的圖到這交作業(yè):提交作業(yè)
  • 建議練習(xí)時,大家自己找素材,盡量不要用教程提供的素材。
  • 教程有看不懂的地方,可以到論壇發(fā)帖提問:新手求助
  • 加官方微信,隨時隨地,想學(xué)就能學(xué):ps_bbs,或掃右側(cè)二維碼!
  • 關(guān)注我們學(xué)更多,每天都有新教程:新浪微博 抖音視頻 微信小程序
- 發(fā)評論 | 交作業(yè) -
最新評論
暫無評論,交個作業(yè)支持一下吧~

關(guān)注大神微博加入>>

網(wǎng)友求助,請回答!