PS教程:制作美味可口的面包圈字體

2013-11-21    藍(lán)藍(lán)設(shè)計的小編

轉(zhuǎn)載藍(lán)藍(lán)設(shè)計(   sillybuy.com  )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供有效的   BS界面設(shè)計 、 cs界面設(shè)計 、  ipad界面設(shè)計   、  包裝設(shè)計 、  圖標(biāo)定制 、  用戶體驗(yàn) 、交互設(shè)計、   網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)

來源:http://www.uisdc.com/100-things-you-should-know-about-design

如果您想訂閱本博客內(nèi)容,每天自動發(fā)到您的郵箱中,   請點(diǎn)這里

面包圈是一種用面粉做成的甜甜圈類型的面包。當(dāng)它們烤好又閃亮?xí)r,看上去真的可口解饞喲!

本教程將會向大家展示如何使用Photoshop強(qiáng)大的圖層樣式功能、以及一些筆刷和濾鏡來創(chuàng)作一些美味的面包圈(效果字體)。

這是最終效果圖。

clip_image002

注意:

*本教程中使用的Adobe Photoshop CS6,但是你也可以使用CS3以上任何一個版本。

*你可能想要檢查BasixPage 這一頁來了解一些關(guān)于Photoshop基本操作技巧的有用主題,例如加載色板和一些快捷鍵。

(譯者注:教程所用的紋理和字體已經(jīng)上傳,大家可以去下載哦 網(wǎng)盤下載

注意:你可能需要加在本教程使用的等高線,所以可以查看這張圖片來了解如何操作。

clip_image004

第一步

新建1250×1250像素大小的文檔(你可以使用任何你想要的寬度值,但是請確保高度值不小于1250)。

選擇矩形工具,設(shè)置前景色為#d4d0c9,并拉一個眼神到文檔邊框外一點(diǎn)的矩形。

clip_image006

雙擊矩形形狀圖層,設(shè)置如下圖層樣式:

——斜面和浮雕

大?。?

勾選消除鋸齒

陰影模式:正片疊底—顏色# a89a86

clip_image008

——等高線

勾選消除鋸齒

clip_image010

——紋理

圖案:paper_2(譯者注:要把提前下載好的這個圖案在ps中定義成圖案)

深度:318%

clip_image012

——漸變疊加

混合模式:正片疊底

樣式:徑向

縮放:150%

勾選與圖層對齊

clip_image014

創(chuàng)建漸變,你需要單擊漸變條下方添加色標(biāo),而在它上面添加不透明度。這里的漸變是用兩種顏色創(chuàng)建的:左側(cè)的#ffffff,不透明度為0%,右側(cè)的#6e3c32,不透明度是100%

clip_image016

圖案疊加

混合模式:正片疊底

圖案:1181556893.gif(譯者注:要把提前加載下載好的Floral Patterns.pat)

clip_image018

以上將創(chuàng)建主要背景。

第二步

設(shè)置前景色為#d8d1b9,選擇橢圓工具并按住Shift鍵,在文檔內(nèi)單擊拖動創(chuàng)建一個大小適合的圓。

clip_image020

雙擊橢圓形狀圖層,設(shè)置如下圖層樣式:

——斜面和浮雕

方法:雕刻清晰

大?。?5

光澤等高線:內(nèi)凹-深

勾選”消除鋸齒”

高光模式:柔光–不透明度:50%

clip_image022

——等高線

等高線:錘形—不對稱

勾選”消除鋸齒”

clip_image024

——紋理

圖案:白色紋理(譯者注:要把提前下載好的這個圖案在ps中定義成圖案)

深度:10%

clip_image026

——光澤

混合模式:線性光

顏色:#767676

距離:73

大?。?50

等高線:環(huán)形—雙環(huán)

clip_image028

——圖案疊加

混合模式:正片疊底

圖案:wood 411.jpeg(譯者注:要把提前下載好的這個圖案pat加載到ps)

clip_image030

——投影

不透明度:24%

距離:55

clip_image032

這就創(chuàng)作了碗/碟子/盤子。你大可隨心設(shè)置斜面和浮雕的參數(shù),或者使用你喜歡的不同的顏色以及紋理。

clip_image034

第三步

以大寫字母狀態(tài)寫下你想要創(chuàng)作的單詞的第一個字母,使用”Franks”字體(譯者注:需要提前安裝下好的這款字體),顏色為”#e3d1ab”,字體大小為570.

你既可以同時創(chuàng)作所有字母,又可以一個接一個創(chuàng)作,這完全取決于你自己。

clip_image036

如果這個字母內(nèi)的孔徑(洞)太小,你會需要把它轉(zhuǎn)換成形狀去刪除這個孔的鋒利邊緣。

如此去做,右鍵點(diǎn)擊文字圖層,然后選擇”轉(zhuǎn)換為形狀”。

clip_image038

選擇”轉(zhuǎn)換點(diǎn)工具”,圍繞周圍的尖角單擊拖動以選中它,然后單擊并拖動錨點(diǎn)將鋒利尖角轉(zhuǎn)換成曲線。

clip_image039

之后,你可能需要選擇直接選擇工具,單擊并拖動錨點(diǎn)來移動他們,或者單擊并拖動方向點(diǎn)以擴(kuò)大或縮小曲線。

clip_image040

最終的結(jié)果沒有必要一定是完美的,實(shí)際上,不完美更好。

clip_image042

復(fù)制形狀層,改變拷貝層的填充值為0,然后再復(fù)制兩次形狀層。因此你會有一個原始的文字層,拷貝、拷貝2和拷貝3層。

clip_image044

第四步

–雙擊原始的文字圖層并設(shè)置如下圖層樣式。

——斜面和浮雕

大?。?5

軟化:16

陰影模式–顏色:#a98f59

clip_image046

——投影

取消”使用全局光”

角度:80

距離:20

大小:25

clip_image048

這就是一個基本的3D形狀的面包圈了。

clip_image050

第五步

–雙擊B拷貝文字,以設(shè)置如下圖層樣式。

——內(nèi)陰影

顏色:#533416

距離:0

大?。?

clip_image052

——內(nèi)發(fā)光

混合模式:正片疊底

不透明度:85%

填充:選擇漸變填充—稍后我們會創(chuàng)建這個漸變

方法:

源:居中

大?。?3

等高線:高斯

范圍:80

clip_image054

單擊漸變條以創(chuàng)建漸變

使用的三個顏色和他們的位置如下:

#–顏色—位置

1 – #d17a34 – 0%
2 – #ecd8ad – 45%
3 – #e0c09a – 88%

相應(yīng)的不透明的參數(shù)如下:

# – Opacity –Location
1 – 100% – 0
2 – 100% – 45%
3 – 0% – 100%

clip_image056

為內(nèi)發(fā)光使用漸變將會為字母創(chuàng)建一個從中心照向邊緣的由暗到亮的效果。

clip_image058

第六步

雙擊B拷貝2文字圖層,設(shè)置如下圖層樣式

——斜面和浮雕

大?。?2

取消”使用全局光”

角度:68

高度:64

光澤等高線:半圓

勾選”消除鋸齒”

高光模式—顏色:#ffe4bd—不透明度:25%

陰影模式—不透明度:0%

clip_image060

——紋理

圖案:White Texture

clip_image062

這會添加一些紋理(凹凸)到文字上。

clip_image064

第七步

–雙擊”B拷貝3″文字圖層,設(shè)置如下圖層樣式:

——斜面和浮雕

大小:75

取消”使用全局光”

角度:54

高度:42

光澤等高線:對數(shù)

勾選”取消鋸齒”

陰影模式—不透明度:0%

clip_image066

——等高線

等高線:半圓

勾選”取消鋸齒”

范圍:40%

clip_image068

——紋理

圖案:Concrete wall

clip_image070

–這會添加一些光芒效果。在本教程將近結(jié)束的時候,光芒將會被旋轉(zhuǎn),那會讓它更加生動。

clip_image072

第八步

–Ctrl+單擊任何字母圖層的縮略圖以創(chuàng)建選區(qū)

clip_image074

–執(zhí)行選擇>修改>收縮,收縮量設(shè)置成50像素。這會讓選區(qū)向內(nèi)收縮50像素。

clip_image076 clip_image078 clip_image080

–執(zhí)行選擇>修改>羽化,羽化半徑設(shè)置為15.這會使選區(qū)的邊緣軟化。

clip_image082 clip_image084

–設(shè)置前景色為#994b0d,選擇油漆桶工具,在所有圖層上面新建圖層,命名為”棕色”,往選區(qū)內(nèi)填充前景色。

第九步

–再一次Ctrl+單擊任何一個字母圖層的縮略圖來創(chuàng)建一個選區(qū)。新建圖層,命名為”紋理”。前景色設(shè)置為#e4c8a0,背景色設(shè)置為#936d2f。

我們會應(yīng)用一些濾鏡效果來創(chuàng)建一個簡單的紋理,這會加強(qiáng)字母的色彩。

clip_image086

–選擇菜單濾鏡>渲染>云彩。然后執(zhí)行選擇>取消選擇(Ctrl+D)以取消選區(qū)。

clip_image088 clip_image090

–選擇濾鏡>濾鏡庫>素描>基底凸現(xiàn),然后按照下圖改變參數(shù)。

clip_image092

你應(yīng)該得到如下效果。

clip_image094

–選擇濾鏡>濾鏡庫>畫筆描邊>強(qiáng)化的邊緣,同樣按照下圖修改參數(shù)。

clip_image096

紋理做好了, 就是這么簡單。

clip_image098

將紋理圖層的混合模式改為柔光。你可以看到這樣做的不同。

clip_image100

第十步

–選擇畫筆工具,打開畫筆面板(窗口>畫筆)。選擇一個柔角畫筆,然后按照如下所示修改它的參數(shù):

畫筆筆尖形態(tài)

clip_image102

形狀動態(tài)

clip_image104

在所有圖層上新建圖層,命名為”顏色加深筆刷”,改變它的混合模式為顏色加深,它的不透明度為45%,設(shè)置前景色為#cac2b7

clip_image106

單擊并稍微移動筆刷以加厚字母的一些區(qū)域。這回讓金棕色看上去更加真實(shí)。

clip_image108

第十一步

新建圖層,命名為”內(nèi)陰影”,改變它的混合模式為正片疊底。設(shè)置前景色#e7cf93,減小筆刷大小為45px。

clip_image110

在畫筆面板,在畫筆筆尖形狀屬性下,將間距設(shè)置降到25%

clip_image112

選擇之前做好的文本,之后圍繞字母的洞繪制更多的陰影。

clip_image114

新建圖層,命名為”外陰影”,改變它的混合模式為”正片疊底”,設(shè)置前景色為#e3b96d,調(diào)大筆刷大小到175像素。在字母周圍的選區(qū)邊緣外稍微繪制一下,以使得邊緣更暗。

clip_image116

做好之后,取消選區(qū)(Ctrl+D)

這就是面包圈主體。下一步簡單裝飾下就能得到結(jié)果。

clip_image118

第十二步

選擇畫筆工具,打開畫筆面板。選擇一個尖角畫筆,并如下圖所示改變它的參數(shù)值。

畫筆筆尖形狀

clip_image120

形狀動態(tài)

clip_image122

散布

clip_image124

這就是主要的粒子筆刷。

第十三步

在所有圖層之上新建圖層,命名為”芝麻”。

clip_image126

雙擊芝麻圖層,設(shè)置如下圖層樣式:

——斜面和浮雕

勾選”消除鋸齒”

高光模式—顏色:#ecbe8e #c1803a

陰影模式—顏色:#c1803a

clip_image128

——等高線

等高線:錐形

勾選”消除鋸齒”

clip_image130

——投影

不透明度:60%

距離:1

大小:2

clip_image132

復(fù)制”芝麻”圖層,重命名為”罌粟籽”

clip_image134

雙擊”罌粟籽”圖層,將斜面和浮雕陰影模式的顏色改成黑色。

clip_image136

設(shè)置前景色為#d4ad6c,選擇”芝麻”圖層,然后拖動畫筆在面包圈字母的中間部分”撒芝麻”。

一個有效的小提醒,以彎彎曲曲的運(yùn)筆方法去畫,這會更好地讓你做出來的芝麻粒效果更漂亮。

clip_image137

改變前景色為#372f2d,減小筆刷大小到7px,選擇”罌粟籽”圖層,然后在面包圈上畫罌粟籽。

clip_image138

第十四步

現(xiàn)在就做好了面包圈字母。所以,合并所有圖層,然后繼續(xù)創(chuàng)建其他字母。

全做好后,選擇每個圖層組,執(zhí)行編輯>自由變換,旋轉(zhuǎn)移動它到碗里。

clip_image139

單擊”創(chuàng)建新的填充或調(diào)整圖層”圖標(biāo),載入圖層面板,選擇漸變映射。

clip_image141

將調(diào)整圖層的混合模式設(shè)置成正片疊底,不透明度為10%

用三種顏色來創(chuàng)建漸變

#–顏色—位置

1–#7b2800—0%

2–#ffb211—60%

3–#ffffc7—100%

clip_image143

最終,你可以在碗里(譯者注:即橢圓1形狀圖層)撒上一些芝麻和罌粟籽

clip_image145

準(zhǔn)備好你的面包圈!
希望這個教程能讓你高興,發(fā)現(xiàn)它的樂趣。

分享本文至:

日歷

鏈接

個人資料

存檔