钢笔工具怎样绘制曲线(钢笔工具画曲线的技巧)

在力力初学 UI 的时候,临摹了很多作品,每次临摹基本都可以分为两个步骤,第一步是用钢笔工具和形状工具把物体勾勒出来,第二步是往形状上填充颜色,然后加一些渐变或者投影。在填充颜色和细节的时候是很享受的,但是在勾轮廓的时候总是很崩溃,画出来的曲线总是不流畅,也不知道问题出在哪里,其实就是钢笔工具没有掌握好。

后来看到一篇外文文章,写的是在 Illustrator 中使用钢笔工具的技巧,才明白了怎样才能用钢笔工具画好曲线,今天结合那篇文章加上我的感悟来聊一聊 UI 设计中的难点,钢笔工具。

准备工作,勾选橡皮带工具

钢笔工具大家应该都很熟悉了,中间一个节点,两边两个手柄,调节手柄的方向可以控制曲线的走向,调节手柄的长度可以控制曲线的弧度。上面的动效设计表达的就是这个意思。

在使用钢笔工具的时候有个能帮助我们的选项,叫橡皮带,勾选上以后,曲线会随着鼠标移动,方便我们预览曲线的走向,看下图,在图片最右边,点击齿轮勾选上:

节点手柄方向和位置是画好曲线的关键

接下来就要开始用钢笔工具画曲线了,在画以前我们可以看看高级 UI 设计师们是怎么处理曲线的节点的,看下面两张图:

从图片里我们能发现,这些节点的方向都是有规律的,都遵循了一种秩序,第一个规律是:除了曲线结束的角,所有节点的手柄不是水平的就是垂直的,具体情况要根据曲线的走向,如果曲线横着走,手柄方向就水平,如果竖着走,方向就垂直。第二个规律看下面的两张图:

图片中红色的圈代表水平的节点,蓝色的圈代表垂直的节点,从图片里可以看出,不仅仅是手柄的方向有规律,节点的位置也是有规律的,第二个规律就是:所有的节点都在曲线的 “最” 外侧或者 “最” 内侧。简单得说就是如果曲线是凸出来的,节点就放在最凸的那个地方,如果节点是凹进去的,节点就要放在最凹的那个地方。掌握了这两个规律就可以轻松画出完美的曲线了。

实战演示一下

比如说用钢笔工具画上图这个 “ S ”

根据第二个规律,所有节点都在曲线最凸或最凹的地方,在这些位置依次画上节点。

根据第一个规律,手柄的方向不是垂直就是水平的,鼠标长按钢笔工具,在菜单的最后找到转换点工具,就是图片里 “T” 上面的那个,按住 shift 点击节点拖动,在每个节点上把手柄拖出来,这时候拖出来的两个手柄是一样长的,位置大概正确就行,不用刻意调整。

在把所有手柄拖出来以后,我们开始调细节,还是用转换点工具,按住 shift ,分开拖动每个手柄使曲线吻合。

所有手柄都调整完成后就大功告成啦!

今天的教程主要讲了钢笔工具的使用技巧,只要熟练掌握了就可以画出世界上任何的造型,再加上颜色和质感,我们就能创造出精彩的设计。一定要多多练习,钢笔工具可以说是基础,但也是 UI 设计中的一个难点,大家加油!下期想说说线框小图标的设计心得。

(0)

相关推荐

  • ppt2007使用曲线工具和任意曲线工具画曲线教程

    ppt如何画曲线?PPT的自选图形工具里有曲线工具和任意曲线工具,可以根据需要进行选择使用.接下来我们小编带你熟悉一下这两种工具的用法,教大家在ppt2007中如何使用曲线工具和任意曲线工具画曲线,感 ...

  • PPT2007如何使用曲线工具画曲线?

    PPT的自选图形工具里有曲线工具和任意曲线工具,可以根据需要进行选择使用.今天小编带你熟悉一下这两种工具的用法. 操作方法 01 打开PPT2007,新建一个幻灯片. 02 右击幻灯片,选择空白版式, ...

  • Creo样条曲线怎么绘制? Creo画曲线的教程

    Creo中想要绘制曲线,该怎么画曲线呢?下面我们就来看看详细的教程. 1.首先在工具栏中,鼠标左键点击“样条”曲线. 2.然后在草绘图中随机点几个点. 3.接着点击鼠标中键进行适当的调整. 4.最后样 ...

  • Ps怎么画曲线

    Ps是一款多功能软件,现在有很多朋友都在使用这个软件,但是还是有一些新手对这个软件不是特别熟悉,今天的这篇就和大家聊一聊关于Ps怎么画曲线的问题,希望可以帮助到大家. 操作方法 01 鼠标左键双击打开 ...

  • PPT怎么画自由线? ppt画曲线的教程

    PPT中可以使用自由曲线工具绘制线条,下面我们就来看看ppt画曲线的教程. 1.新建的PPT文件,为了增强效果,我们给PPT增加一个有颜色的背景. 2.设置完成背景色后,点击工具导航的插入按钮. 3. ...

  • PS怎样画曲线

    在使用 PS 进行作图的过程中,很多时候都需要绘制圆滑的曲线.那么,PS 究竟应该怎样绘制曲线呢? 操作方法: 01 首先,打开 PS 以后,在左侧选择"钢笔"工具. 02 然后, ...

  • dwg文件查看器怎么画曲线

    如何画曲线?怎么在CAD中添加曲线?经常需要在CAD中添加曲线,但是很多的CAD新手朋友们不知道如何添加曲线.下面来看看如何添加曲线吧. 操作方法 01 需要先打开电脑中CAD编辑器,如果经常需要编辑 ...

  • SolidWorks怎么画曲线?

    SolidWorks怎么画曲线? 三维绘图中,对于复杂的曲线,可以通过XYZ点来创建,具体步骤如下. 1.打开SolidWorks软件,并单击"新建"按钮. 2.在"新建 ...

  • Creo3.0笛卡尔方程曲线怎么画? Creo制作笛卡尔曲线的技巧

    今天我们就来看看使用Creo绘制笛卡尔方程曲线的教程,图文很详细,请看下文详细介绍. 1.下载并安装Creo软件,双击打开Creo软件: 2.在Creo软件的创建窗口中新建一个零件: 3.按图所示进入 ...