鋼筆工具，教你如何畫(huà)出完美曲線

Pen Tool Animation byGal Shir

在我初學(xué) UI 的時(shí)候，臨摹了很多作品，每次臨摹基本都可以分為兩個(gè)步驟，第一步是用鋼筆工具和形狀工具把物體勾勒出來(lái)，第二步是往形狀上填充顏色，然后加一些漸變或者投影。在填充顏色和細(xì)節(jié)的時(shí)候是很享受的，但是在勾輪廓的時(shí)候總是很崩潰，畫(huà)出來(lái)的曲線總是不流暢，也不知道問(wèn)題出在哪里，其實(shí)就是鋼筆工具沒(méi)有掌握好。

后來(lái)看到一篇外文文章，寫(xiě)的是在 Illustrator 中使用鋼筆工具的技巧，才明白了怎樣才能用鋼筆工具畫(huà)好曲線，今天結(jié)合那篇文章加上我的感悟來(lái)聊一聊 UI 設(shè)計(jì)中的難點(diǎn)，鋼筆工具。

準(zhǔn)備工作，勾選橡皮帶工具

I Design With Code byChris Gannon

鋼筆工具大家應(yīng)該都很熟悉了，中間一個(gè)節(jié)點(diǎn)，兩邊兩個(gè)手柄，調(diào)節(jié)手柄的方向可以控制曲線的走向，調(diào)節(jié)手柄的長(zhǎng)度可以控制曲線的弧度。上面的動(dòng)效設(shè)計(jì)表達(dá)的就是這個(gè)意思。

在使用鋼筆工具的時(shí)候有個(gè)能幫助我們的選項(xiàng)，叫橡皮帶，勾選上以后，曲線會(huì)隨著鼠標(biāo)移動(dòng)，方便我們預(yù)覽曲線的走向，看下圖，在圖片最右邊，點(diǎn)擊齒輪勾選上：

<點(diǎn)圖片看大圖>