PS教程!6個矢量圖標繪制設計的實用小技巧 - 特级毛片www,色综合天天综合网,国产成人综合亚洲 - UISDC

PS教程!6個矢量圖標繪制設計的實用小技巧

2016/05/11 30249評論區

vector-icon-design-6-skills-1

今天竹子要介紹的這6個圖標繪制招數,簡單易懂,但功效卓著。久習可得奇效,達到任何矢量圖形都易如反掌,無論各種橫的,豎的,奇形怪狀的圖形都信手拈來。(以下界面演示以Photoshop CC為演示工具)

第一劍 少商劍 形狀圖層

特點︰劍路雄勁,頗有石破天驚,風雨大至之勢。

PS是一個像素處理軟件,可以做到和AI一樣繪制各種復雜的矢量圖形。有讀者會問為什麼不用AI,而要學習PS繪制路徑,因為PS才是適合UI設計的工具軟件,且各種圖形PS可以做到像素對齊,AI繪制的路徑導入PS還是要二次調節。所以下面教你如何通過形狀圖層來繪制矢量圖標。

ヾ 前景色選擇黑色,前景選擇的顏色就是繪制出形狀圖層的顏色

ゝ 工具模式選擇路徑,一定要選擇路徑,而不是形狀,因為直接生成的形狀黑乎乎一大片,非常不利于二次編輯路徑。

3dca573031ca32f87586275877c5.jpg

ゞ 形狀屬性面板中可以設置圓角。

1lmsj20160512

這是Photoshop CC版本中一個非常棒的功能。尤其是對UI設計師而言。形狀屬性位于屬性面板中,我們可以自由設置各種參數。

例如︰圖形尺寸、填充顏色、描邊顏色、描邊寬度、描邊樣式(包括虛線、對齊方式、線段端點和合並類型)、圓角半徑選項(對橢圓形不可用)

3lmsj20160512

4lmsj20160512

一個矢量的圓角矩形就畫好了。

第二劍 中沖劍 自定義形狀工具

特點︰大開大闔,氣勢雄邁

PS里內置了非常多的形狀,很多基礎圖形不需要自己繪制,直接在使用相應的圖形即可。

5lmsj20160512

首先新建一個圖層,然後使用多邊形工具,選擇3邊

6lmsj20160512

然後用形狀圖層工具繪制一個三角形

7lmsj20160512

如圖︰

8lmsj20160512

第三劍 商陽劍 布爾運算

特點︰巧妙靈活,難以捉摸。

一些復雜的圖形,都是靠各種圖形相加相減得到的。所以我們需要靈活運用布爾運算工具,來達到組合最終圖形的目的。

按住Ctrl同時選中圖層形狀1、形狀2

9lmsj20160512

直接按住Ctrl+E合並兩個路徑︰

10lmsj20160512

通過合並得到一個對話框圖形。

12lmsj20160512

菜單頂部有路徑組合工具,可以嘗試不同的路徑組合,體會一下不同路徑組合布爾運算的效果。

11lmsj20160512

第四劍 關沖劍? 分層繪制

特點︰以拙滯古樸取勝。

很多復雜的基本型不要在一個層上繪制,可以分層繪制,通過各個層的分別繪制,最終再整體合並。

新建圖層,畫三個圓形矢量圖形,必須要新建一個圖層哦。如果直接繪制路徑,新的路徑和原有的路徑混在一起,調整非常不方便,路徑約復雜,你會感受分層繪制的好處!

13lmsj20160512

選中圓圈圖形的圖層,Ctrl+C

14lmsj20160512

在圓角矩形層上Ctrl+V,圓圈路徑粘貼在圓角矩形層上︰

15lmsj20160512

然後︰

16lmsj20160512 17lmsj20160512

第五劍 少沖劍? 路徑選擇工具

特點︰輕靈迅速

當編輯圖標中一堆復雜路徑的時候,想要快速選中某個路徑可能不是一件非常輕松的事情,這時候可以使用路徑選擇工具。

18lmsj20160512

這2個箭頭有什麼區別了,黑色箭頭可以選中全部路徑,而白色箭頭可以選中局部路徑。

19lmsj20160512

第六劍 少澤劍 鋼筆工具

特點︰忽來忽去,變化精微

有一些圖形的形狀,造型奇異,比如下面這個茄子,不可以直接通過基本圖形得到,這時候只能使用大招,鋼筆工具!掌握鋼筆工具,可以自由的畫出各種圖形。

20lmsj20160512

選擇鋼筆工具

21lmsj20160512

繪制一下弧形路徑,按住Alt鍵點選這個路徑的端點,為什麼需要點選一下?大家可以試驗一下,假如不切換這個端點,繪制的下一個路徑就會有一個弧度。不能按照自己想法繪制相應方向的路徑。

22lmsj20160512

點選後的路徑如下

23lmsj20160512

然後我們再繪制下一段路徑

24lmsj20160512

再次點選路徑的端點

25lmsj20160512

依次繪制出如下的路徑

26lmsj20160512

再繪制一個切割圖形的路徑,並用布爾運算工具切除︰

27lmsj20160512

最後用鋼筆工具用如上的步驟繪制茄子的把子。

28lmsj20160512

最終得到這個茄子的矢量圖形︰

29lmsj20160512

今天的課程就講到這里,不知道通過這個六脈神劍的招數大家可以自由繪制各種矢量圖形了嗎?

看的多不如去練習一下,大家可以以這個茄子去練習一下作業。

歡迎關注作者的微信公眾號︰liaosheji2010

fwzqr

【字體設計經驗三部曲】

Step 1︰先從基礎的字體結構學起!

Step 2︰再了解字體設計的方法大全!

Step 3︰實戰經驗幫你全面掌握!
《經驗分享︰超詳細的字體設計方法+案例分析》

作者︰鳳尾竹

yestone-uisdc-2

【特级毛片www,色综合天天综合网,国产成人综合亚洲 原創资讯 投稿郵箱︰02-8993-5275@qq.com】

================關于特级毛片www,色综合天天综合网,国产成人综合亚洲================
“特级毛片www,色综合天天综合网,国产成人综合亚洲“是國內人氣最高的網頁設計師學習平台,專注分享網頁設計、無線端設計以及PS教程。
【特色推薦】
設計師需要讀的100本書︰史上最全的設計師圖書導航︰。
設計微博︰擁有粉絲量112萬的人氣微博 ,歡迎關注獲取網頁設計資源、下載頂尖設計素材。
設計導航︰全球頂尖設計網站推薦,設計師必備導航︰

儒墨堂大課堂

非特殊說明,本文版權歸原作者所有,轉載請注明出處
本文地址︰http://www.rumotanartist.com/vector-icon-design-6-skills

發表評論 加載中....

評論加載中....

uisdc

評論區都快餓癟了,看看我期盼的小眼神...

版式設計 交互設計師 界面設計 排版布局 職場 設計師干貨 儒墨堂專訪 儒墨堂大課堂 設計達人 配色 視覺設計 web前端開發 素材下載 AI教程 設計流程 設計理論 神器下載 字體下載 設計師專訪 psd下載 設計規範 用戶體驗設計 海報設計 平面設計 設計趨勢 動效設計 logo設計 圖標設計 ICON 產品設計 神器推薦 App設計 字體設計 職場規劃 酷站推薦 交互設計 ui設計 優秀網頁設計 設計師職場 ps技巧 酷站 用戶體驗 PS教程 網頁設計 經驗分享

您還沒有登錄

儒墨堂啟用更安全省心的 微信掃碼登錄

微信掃碼

300萬設計師聚集地!特级毛片www,色综合天天综合网,国产成人综合亚洲是極具人氣的設計師平台
2012年成立至今,一直專注于設計師的學習成長交流

特级毛片www|色综合天天综合网|国产成人综合亚洲

打開微信,掃碼分享
學設計 特级毛片www,色综合天天综合网,国产成人综合亚洲 在這里