首頁技術(shù)文章正文

UI設(shè)計之電商中常用流線感光線打造方法

更新時間:2018-01-11 來源:黑馬程序員 瀏覽量:

電商中常用流線感光線打造方法

最終效果如下(此方法塑身類服飾或時尚電子產(chǎn)品用的較多):

UI設(shè)計

1、通過PhotoShop打開模特照片,此圖為美體塑身服飾模特照。

UI設(shè)計

2、通過PhotoShop的鋼筆工具繪制曲線路徑,注意屬性欄必須選擇路徑選項。

UI設(shè)計

3、在模特身上能體現(xiàn)出塑身的個別部位分別繪制路徑線,一共七段。

UI設(shè)計

4、新建圖層,選擇畫筆工具,調(diào)節(jié)畫筆大小為1個像素,硬度為100%。

UI設(shè)計

5、選擇畫筆在畫筆屬性欄開啟“壓力”功能。

UI設(shè)計

6、切換至鋼筆工具,在畫面中右擊選擇“描邊路徑”。

UI設(shè)計

7、在彈出的選項中,第一項選擇“畫筆”,第二項選擇“模擬壓力”

UI設(shè)計

8、此時畫面中多了幾條中間粗兩端細(xì)的白線,中間粗兩端細(xì)效果正是因開啟模擬壓力所打造,顏色是由前景色決定。

UI設(shè)計

9、給白線圖層右擊選擇“混合選項”,開始添加圖層樣式。

UI設(shè)計

10、添加“外發(fā)光”圖層樣式,參數(shù)如下圖。

UI設(shè)計

11、此時我們可以看到發(fā)光的線條已經(jīng)呈現(xiàn)。

UI設(shè)計

12、我們還想讓效果更佳出彩,所以在模特的腹部我們繼續(xù)繪制出2條路徑線,打造虛線類型的光線進行搭配。

UI設(shè)計

13、新建圖層,選擇畫筆工具,調(diào)節(jié)畫筆大小為5個像素,硬度為100%。

UI設(shè)計

14、選擇窗口菜單,打開畫筆面板,將畫筆間距屬性調(diào)大至180%左右。

UI設(shè)計

15、使用“路徑選擇工具”選擇兩根路徑后切換至畫筆工具。

UI設(shè)計

16、切換至畫筆工具后選擇新建的空白圖層,直接按回車,即可完成描邊操作。如圖:

UI設(shè)計

17、選擇白色光線圖層右擊選擇”拷貝圖層樣式”,選擇虛線光線圖層后右擊選擇“粘貼圖層樣式”即可復(fù)制白色光線的樣式。

UI設(shè)計

18、最終效果完成:

UI設(shè)計


       

本文版權(quán)歸黑馬程序員UI設(shè)計綜合設(shè)計師學(xué)院所有,歡迎轉(zhuǎn)載,轉(zhuǎn)載請注明作者出處。謝謝!

作者:黑馬程序員UI設(shè)計綜合設(shè)計師培訓(xùn)學(xué)院

首發(fā):http://ui.itheima.com/


分享到:
在線咨詢 我要報名
和我們在線交談!