怎麼用 Adobe Illustrator 畫出曲率連續的曲線？

11-28

作為平面設計師UI設計師如何用矢量軟體畫出曲率連續呢？

我同 @巴別魚觀點類似，平面設計中不必追求「曲率連續」這個概念。

在這個問題（曲率連續對於手機設計有多重要？）的回答中，我說到了「曲率連續」是一個數學概念而不是視覺能分辨出的特性，所以在實際設計中，絕大多數情況是我們通過曲率連續這個技術工具來獲取高品質的曲面，而不是說達到了曲率連續檢測標準就取得了高品質曲面這個結果。如果軟體環境中沒有相應的檢測工具，那麼也就無法達到這個要求。

對曲率連續的簡單介紹可以見維基百科或者 Autodesk Alias 這個頁面介紹：Help 以及關於曲線數學概念的簡介：Help。如果對曲線這個問題感興趣，而且與平面設計或者字體設計相關，可以參考閱讀這個 PDF 文檔：Raph Levien』s thesis 作者現在是 Android 字體和文字排版方面的工程師，這是他的博士論文。

線與線之間的連接，簡單就分成三種，直線與直線、直線與曲線及曲線與曲線，在從曲線到曲線的連接中，兩條線在這一點連接處的曲率可能相差很大，但是很有可能，不僅眼睛無法識別，而且也不會干擾你對「光滑」的認識，當然沒達到切線連續是容易看出的，也就是連接點兩頭的控制手柄不在一條直線上。

而圓角四邊形是其中一個特例，也就是直線與圓弧的連接，圓是一種二次曲線，每處的曲率都是一樣大小，所以在視覺中，從直線的曲率為 0 過度到一個均勻曲率的圓弧上，連接處的跳動就容易識別出來，但是，同樣是圓角四邊形，不同的 R 角大小對人的流暢識別差別也挺大，比如 iOS 7 之前的圓角四邊形相對於一些大大咧咧隨便一個圓角的圓角四邊形視覺感更好。

Type is Beautiful 有過一篇文章：FF-DIN 圓體之工藝、設計與性感，對平面中的曲線連接有涉及，提到了羊角螺線是一條很特殊的曲線，曲率隨著弧長的增加而線性變化，這條曲線在直線及圓弧連接中使用起來很方便。

但，並不是說，在遇到直線與圓弧結合，就一定要修正，看具體的需求，比如我就需要這種簡單的數學結構的形態，那麼曲率為 0 的直線與曲率統一的一段圓弧就直接連接在一起。

所以，通常情況，只要注重宏觀的視覺可感知的光滑和簡潔即可，但這不是一件簡單的事，而是一門技藝，遊走於自由度與張力之間的技藝。

請先看使用 Adobe Illustrator 繪製複雜光滑曲線的一種策略 - Keep It Tight - 知乎專欄
大概會理解繪製曲線需要技藝，無論在平面軟體還是3維工程軟體都需要一定的技巧和對軟體本身曲線構成的認識。
其次平面設計不用追求「曲率」一詞，視覺上的認知才是平面設計的中心，再者平面作品不會像實物一樣對面的檢視有要求，另外實物產品是有無限角度的審視。

經 @Hi-iD 指正以下這段是錯誤的方法，這個連續是偽曲率連續，不過我覺得這個偽曲率大部分情況下可以騙過眼鏡。目前看 illustrator 中沒有可操作的約束來實現曲率連續。

回到本題 illustator 軟體採用並非三維軟體的 NURBS 描述方式，而是貝塞爾曲線（只能算作 NURBS 的子集），這種三次曲線是曲率連續的最低保證，也就是你可以繪製出曲率連續的圖，但是必須是相鄰兩個錨點的兩個控制棒頂點重合在一起，這是 illustrator 軟體下曲率連續必要的約束，但導致了繪製曲線的靈活性、效率性指數下降，並且在擬合設計稿的時候這樣做不得不大量試錯錨點放置位置，而且你不能輕易地修改，這樣幾乎就是不可能很好的擬合設計稿，也就是說你有可能因為過度追求曲率連續而因小失大，平面軟體曲線的最小構造單位保持曲率連續，和整體曲線順滑關係有一種平衡存在。當然局部採用這種方法是可行的。

圖示：在 illustrator 中繪製曲率連續的曲線。

錨點與控制棒以及梳狀線曲率檢視

看下圖，梳狀線顯示比例放大後檢視到實際未達到曲率連續（不過在視覺極限上我覺得滿足平面需求）

再次補充
來看看 Rhino 繪製曲率連續的線然後導入 illustrator 後發生了什麼。

1、Rhino 導入到 illustrator 時發生了數據轉換，最終表現就是 illustrator 用自己的描述方式擬合 Rhino 中的曲線。
2、本文的兩次曲率連續檢視都是在曲率（梳狀線）比例放大的情況下才被視覺識別出來。
3、從曲率連續的曲線導入的表現看（錨點與控制棒的特徵表現），曲率連續在 illustrator 內不具有可操作性。重點：視覺宏觀上的順滑
數字上的「順滑」和視覺上「順滑」不是同一種東西，視覺是有最小單位的，就像屏幕上低於0.1秒（27日5時訂正：時間改為 1/24 秒由 @郭文龍指正，0.1秒為視覺暫留_百度百科）的圖像顯示不會再腦中留下信息，而軟體上的數字順滑是沒有最小單位只有最小公差，平面上的順滑需求是視覺的，是宏觀的。
順便想起以前一個問題人為什麼喜歡有流暢感的事物？

AI畫NUBRS曲線
所有答案中：不是迴避這個問題，就是用不準確的操作來回答。我來告訴你們如何用AI畫NUBRS曲線。

--------------------------
默認圓形就是曲率連續圖形。
在圓上，只用修改形狀工具添加弧線點，不修改曲線操作棒

參考這一節的內容：
https://zhuanlan.zhihu.com/p/25047065

我用cad畫，然後導過來

一般來說，每添加一個描點的時候拉出平衡桿，那段曲線的曲率就是連續的。不過平面設計中並沒有在追求這個連續，曲線符合整個畫面就好了。
連續的曲線一般會在產品設計中應用，記得大學的時候還會刻意去練習這個。

簡單表述下方法：
1、任何180度之內的弧線只用三個節點，中點兩側調節桿保證在同一直線上。
2、大於180度的弧線或S型等其他特殊曲線均使用180度內三點弧線拼接的方式，相接端點左右兩邊調節桿保持同一直線。

不要問我為什麼。