全部新闻提供最新行业动态,分享前沿设计理念
【学UI设计】AI人字拖拟物图标
时间:2024-09-12 来源:朝夕友人 点击:

注:此教程为英翻教程,软件操作不娴熟的小伙伴儿,谨慎尝试哦。翻译不足之处或者有错别字,自行脑补一下哦。

1.新建文档

文件”>“新建”以打开空白文档,如图设置。

2.创建图标的底部

抓住矩形工具(M),然后绘制一个256 x 256像素的正方形。暂时选择一个黑色笔触,然后转到“效果”>“风格化”>“圆角”并应用25px半径。要扩展此效果,请转到“对象”>“扩展外观”,然后取消分组(Shift + Ctrl + G)。

3.创建沙子纹理

步骤1

用指示的颜色填充基本形状,然后查看“外观”面板。选择此填充属性后,按面板底部的Duplicate Selected Item图标。结果,您将在上方获得第二个填充。用可以在Swatch库>模式>基本图形>基本Graphics_Textures中找到的名为“ USGS 17A流沙”的模式替换颜色。将此模式的混合模式更改为柔光。

步骤2

现在,像在上一步中一样复制第二个fill属性。将现有模式替换为“ Stipple Fine ”,您可以在“ Basic Graphics_Textures”类别中找到该模式。将混合模式设置为“颜色减淡”。

步骤3

复制第一个填充属性,然后将裸色替换为棕色。将此属性拖动到面板底部,然后转到“效果”>“扭曲和变形”>“变形”并应用如下所示的设置。您将在底座的右上角得到棕色边缘。

步骤4

在基础形状的前面复制并粘贴(Ctrl + F),并删除所有现有外观。选择棕色作为填充颜色,然后转到“效果”>“艺术”>“胶片颗粒”并应用显示的设置。设置为“混合模式叠加”。

步骤5

我们仍在使用上一步中的形状。选择一个1pt的白色笔触,并将其设置为Blending Mode Soft Light。

步骤6

现在,转到外观面板,然后从弹出菜单中选择添加新填充。使用所示的线性渐变并将角度设置为-90度。在第一个填充和笔触之间移动此填充属性,然后将“混合模式”设置为“颜色加深”,并将“不透明度”减小为50%。

4.将详细信息添加到沙底

步骤1

现在,让我们改善沙滩外观,使其更逼真。为此,我们将使用Illustrator中提供的一些美术笔刷,并按照它们的顺序将它们一一拿下。

抓住钢笔工具(P),并在底座的左下角绘制一条如下所示的路径。给它一个2pt的棕色笔触(1)。另外,使用名为“ Dry Ink 2 ”的美术画笔在画笔库> Artistic> Artistic_Ink(2)中找到该路径。仍然选择此路径,转到“效果”>“模糊”>“径向模糊”,然后应用下一张图像(3)中显示的设置。将混合模式设置为叠加,并将不透明度降低到40%(4)。

在径向模糊窗口中选择Spin方法,良好的质量和数量的20。

步骤2

使用钢笔工具(P)绘制第二条路径,并为其绘制1pt的棕色笔划(1)。这次使用名为“粉笔”的美术画笔,您可以在“画笔库”>“ Artistic”>“ Artistic_ChalkCharcoalPencil ”中找到该画笔。双击“外观”面板中应用的画笔笔触以打开“笔触选项”窗口,然后选中“沿对象翻转”选项,然后单击“确定”(2)。使用相同的设置(3)再次应用“径向模糊”效果,然后将其设置为“颜色加深”(4)。

步骤3

让我们继续第三条路径,并给它2pt的棕色笔触(1)。再次使用“粉笔”艺术画笔对其进行描边(2),然后转到“效果”>“模糊”>“径向模糊”并应用下一张图像中显示的设置(3)。设置为混合模式叠加,并将不透明度降低到40%(4)。

在径向模糊窗口中选择缩放方法,良好的质量和数量的20。

步骤4

抓住钢笔工具(P),然后绘制另一个波浪形路径,如下所示。给它一个2pt的棕色笔触(1),然后再次使用“粉笔”美术笔刷对其进行笔触(2)。使用上面显示的设置应用“径向模糊”效果,然后将其设置为“颜色加深”并将不透明度降低到40%(3)。

步骤5

在底座的左下角绘制下一条路径,然后选择一个1pt的棕色笔触(1)。这次使用“ Dry Ink 2 ”美术画笔对其进行描边(2)。使用此步骤开始时显示的设置(4.1)应用“径向模糊”效果,然后将其设置为“颜色加深”(4)。

步骤6

您尚未完成。采取钢笔工具(P)并绘制下一条路径,然后选择一个2pt的棕色笔触(1)。使用“粉笔”美术笔刷对其进行描边(2),然后应用“径向模糊”效果(设置-4.1)。设置为混合模式颜色加深,并将此路径的不透明度降低到75%(3)。

步骤7

在底座的左上角绘制另一条路径,并为其绘制2pt的棕色笔划。使用“干墨2 ”美术画笔对其进行描边(2),然后应用“径向模糊”效果(设置-4.1)。设置为混合模式颜色加深(4)。

步骤8

最后,在右上角绘制最后一条路径,并为其绘制1pt的棕色笔划(1)。使用“粉笔”美术笔刷对其进行描边(2),然后应用“径向模糊”效果(设置-4.1)。将其设置为Blending Mode Overlay(4),即可完成此部分。

5.清理图标的边缘

步骤1

我们希望该图标的边缘干净,因此我们需要一个遮罩。首先,在基础形状的前面复制并粘贴(Control + F),然后删除所有现有外观(无笔触,无填充)。通过转到“对象”>“排列”>“置于最前面”,将此副本置于所有内容的最前面。选择此副本以及八个描边路径后,转到“对象”>“剪切蒙版”>“制作”(控制+ 7)。

步骤2

此时,图标的底部应如下所示:

6.向图标添加突出显示

步骤1

再次在基础形状中复制并粘贴(Ctrl + F)并删除所有现有外观。通过转到“对象”>“排列”>“置于最前面”,将其置于所有内容的前面,并使用任意颜色(1)对其进行1pt笔划。使用“添加锚点”工具(+),在左右边缘(2)上添加两个额外的点。接下来,抓住剪刀工具(C)并单击指示的四个点以将路径切成段(3)。删除不需要的路径,仅保留下面显示的两条路径(4)。

步骤2

使用混合艺术画笔在上一步中获得两条路径,我已经在我的霓虹艺术画笔教程中解释了如何进行创建。只是这不是200 x 5px,而是尺寸为100 x 3px。将“笔重”设置为0.75 pt,然后将“不透明度”降低到75%。

7.在图标下方添加阴影

抓住椭圆工具(L)并绘制具有所示尺寸的椭圆。将形状移动到图标的底部,然后通过转到“对象”>“排列”>“发送回”将其发送到所有内容的后面。选择黑色作为填充颜色,然后转到“效果”>“模糊”>“高斯模糊”并应用10半径。

8.绘制人字拖的形状

步骤1

使用椭圆工具(L)绘制具有所示尺寸的椭圆。使用直接选择工具(A)仅选择顶部和底部点,然后拖动其手柄以使其更长。接下来,从形状的中间选择两个点,然后拖动手柄以修改其位置,如图所示。

步骤2

抓住“添加锚点工具”(+),并使用它在鞋底形状的底部添加两个额外的点,并在需要时调整手柄。接下来,使用直接选择工具(A)选择最高点,然后如下所示修改控点的位置。使用添加锚点工具(+)在顶部添加其他两个点,并如下所示移动控点。

9.画出拖鞋的带子

步骤1

采取钢笔工具(P)并绘制如下两条路径,然后使用“锥形尖”美术画笔对其进行笔划,您可以在“画笔库”>“ Artistic”>“ Artistic_Ink ”中找到该画笔。将权重设置为0.3pt。从“对象”>“展开外观”,然后取消分组(Shift + Ctrl + G)两次,您将获得皮带形状。

步骤2

选择左绑带并转到“对象”>“路径”>“添加锚点”,然后选择右绑带并转到“对象”>“路径”>“添加锚点”两次。您将在每种形状上获得一些额外的点。现在,使用直接选择工具(A)仅选择以绿色突出显示的两个点并将它们向左移动一点。接下来,选择以蓝色突出显示的三个点并将它们向右移动。

步骤3

使用直接选择工具(A)仅选择以绿色突出显示的点并将其向下移动一点,然后对以蓝色突出显示的四个点进行相同的操作。

步骤4

抓住直接选择工具(A)并拖动一个选择,如下所示,以仅选择该区域中的点并将其向下移动一点。最后,将两个点从顶部移到另一个,并准备好皮带。

步骤5

使用钢笔工具(P)从下方绘制形状,作为皮带的内部。

10.在鞋底上创建设图案

步骤1

现在我们已经具备了人字拖的基本形状,我们需要将其付诸实践。暂时隐藏皮带,并专注于鞋底。选择指示为填充颜色的粉红色阴影。接下来,使用钢笔工具(P)甚至铅笔工具(N)在鞋底上随机绘制一些波浪形路径。

步骤2

复制并粘贴到鞋底形状的前面(Ctrl + F),然后转到“对象”>“排列”>“置于最前面”,将其置于所有内容的前面。组(对照+ G)的所有波状路径然后选择鞋底的副本和组并按鸿沟在探路者面板。取消分组(Shift + Ctrl + G),然后从顶部和底部删除较大的形状。用指示的颜色填充条纹。

步骤3

再次复制并粘贴到鞋底形状的前面(Ctrl + F),然后将其放到前面。用黑色和灰色(40%黑色)所示的线性渐变填充它,并将角度设置为90度。将混合模式更改为叠加,并将不透明度降低到20%。

步骤4

接下来,使用钢笔工具(P)并绘制一个分段的漩涡,如图所示。当太阳光线在四周画出短路时。为所有路径选择一个1pt浅灰色笔触,然后按“笔触”面板中的“圆帽”选项。

11.给人字拖带子上色

步骤1

首先解开皮带。用指示的粉红色填充右边的皮带。转到“外观”面板,并选择此填充属性,然后按底部的“复制所选项目”图标。结果,您将在上方获得第二个填充。使用从白色到黑色的线性渐变,然后将其设置为“混合模式叠加”,并将不透明度降低到20%。对左皮带重复相同的操作。

步骤2

现在选择左内皮带,并用深粉红色填充它。像以前一样复制此填充属性,这次使用从白色到黑色的径向渐变。将其设置为“混合模式相乘”并将不透明度降低到20%。对右内带重复相同的操作。

步骤3

复制并粘贴在左背带(Ctrl + B)中,然后删除现有外观,然后选择明亮的粉红色作为填充颜色。仅使用“直接选择工具”(A)来选择形状后面指示的两个点,然后通过按一次键盘上的向左箭头键将它们向左移动1px。

接下来,在右皮带上复制并粘贴在背面(Control + B),并更改填充颜色。使用直接选择工具(A)仅选择指示的四个点,并将它们向左移动1px,以在背面显示一些粉红色的形状。

步骤4

复制并粘贴右边的内部背带(Ctrl + B),删除现有外观,然后选择指示为填充色的粉红色阴影。使用直接选择工具(A)仅选择突出显示的两个点,然后通过按一次键盘上的向上箭头键将它们向上移动1px。

接下来,复制并粘贴在左内部背带的背面(Ctrl + B)并更改填充颜色。这一次,通过按一次向右箭头键,将整个内部皮带(不是副本)向右移动。

12.创建脚趾栏

步骤1

抓住椭圆工具(L)并绘制出两个具有所示尺寸的小圆圈。像下面那样排列它们,并用所示的径向渐变填充它们。

步骤2

现在,如图所示,使用钢笔工具(P)在孔和皮带之间绘制一条路径。将“笔划重量”设置为4.5pt,然后在“笔划”面板中按“ Round Cap”选项。从“对象”>“展开并取消分组”,然后用深粉红色填充生成的形状。将脚趾移到皮带的后面。

步骤3

复制并粘贴在脚趾栏的前面(Ctrl + F)并将其缩放一点。将填充颜色替换为所示的渐变,然后将其设置为“混合模式”,然后将不透明度降低到75%。

步骤4

使用内部皮带底部的椭圆工具(L)绘制两个椭圆,并用指示的颜色填充它们。

13.在皮带上添加亮点

步骤1

抓住钢笔工具(P),并沿着皮带的边缘绘制两条路径,如下图所示。使用先前使用的“混合美术画笔”描边这些路径,然后将权重设置为0.25pt,将“混合模式”设置为“覆盖”。

步骤2

沿着皮带的边缘绘制其他两条路径,并使用相同的“混合美术画笔”对其进行描边。将权重设置为0.25pt并将不透明度降低到75%。

14.创建光泽外观

步骤1

如图所示,以矩形工具(M)并在右皮带上绘制一个矩形。用所示的线性渐变填充它,然后将其设置为“混合模式”变亮并将不透明度降低到60%。

步骤2

在顶部绘制一个较小的矩形,然后选择白色作为填充颜色。将其设置为“混合模式叠加”,并将不透明度降低到50%。

步骤3

将右皮带复制并粘贴在正面(Ctrl + F)并删除所有现有外观。通过转到“对象”>“排列”>“置于最前面”,将其置于所有内容的前面。现在,选择两个矩形和皮带的副本,然后转到“对象”>“剪贴蒙版”>“制作”。

步骤4

左侧也会发生类似的情况。首先,绘制矩形并用相同的渐变填充。调整角度,然后将其设置为“混合模式”变亮并将不透明度降低到40%。复制左皮带,并像之前一样将其拉到前面。现在,选择矩形以及皮带的副本,然后转到“对象”>“剪贴蒙版”>“制作”。

15.添加阴影

步骤1

选择内部皮带后面的两个形状,然后将它们复制并粘贴到背面(Ctrl + B)中。给他们黑色填充,然后进入效果>模糊>高斯模糊并应用4px半径。

步骤2

我们不希望在某些区域看到模糊,因此我们将使用遮罩修复此问题。首先,复制并粘贴在鞋底形状的前面(Ctrl + F),然后删除所有现有外观。选择应用了模糊处理的两个形状以及鞋底的副本(应该在它们的前面),然后转到“对象”>“剪贴蒙版”>“制作”。

步骤3

复制并粘贴左背带(Ctrl + B),将其填充为黑色,然后向右移动。使用钢笔工具(P)绘制我们需要的其他两种形状,一种在左内皮带后面,另一种在脚趾杆后面。

步骤4

创建鞋底的另一个副本(无笔触,无填充),然后对第二个和第三个黑色形状进行分组(Ctrl + G)。选择该组和鞋底的副本,然后在“路径查找器”面板中按“相交” 。您将获得复合路径,但转到“对象”>“复合路径”,然后选择“发布”。现在,您应该具有三个形状,可以使用这些形状为内部皮带,左侧皮带和脚趾杆创建阴影。

步骤5

用所示的线性渐变填充这三个形状,并根据每个形状的位置调整角度。将它们设置为“混合模式相乘”(白色变为透明)并将不透明度降低到35%。

16.创建拖鞋底

步骤1

将鞋底形状(鞋垫)复制并粘贴到背面(Ctrl + B),并用指示的颜色填充它。如图中所示,将此形状稍微向下和向右移动。这将是外底。

步骤2

再次复制并粘贴在鞋垫的背面(Ctrl + B)。选择一个0.5pt的白色笔触,删除现有的填充颜色,并将“不透明度”设置为75%。向右下方稍微移动此形状,直到它位于鞋底中间。接下来,复制并粘贴在前面(Ctrl + F),将外底设置为“ none”,将笔触设置为“ none”。选择白色路径和外底的副本,然后转到“对象”>“剪贴蒙版”>“制作”。

17.组合图标

步骤1

人字拖现已准备就绪,您可以创建它的一对。第一组(Ctrl + G)组成右人字拖的所有形状,然后转到“对象”>“变换”>“反射”。选中“垂直”,然后点击“复制”,您将获得左人字拖。将沙滩人字拖布置在您创建的用于组成图标的底座上方。

步骤2

选择合适的外底,然后转到“效果”>“风格化”>“阴影”。应用显示的设置,然后单击“确定”。使用左外底为另一个人字拖做同样的事情

步骤3

此时,海滩图标已准备就绪。如果需要,可以创建其他尺寸,但首先请确保扩展每个画笔和应用的效果。

18.尝试不同的设计和组合

步骤1

您可以使用人字拖的副本来创建各种类型的沙滩人字拖。首先更换鞋垫和外底的颜色对于这次的鞋垫设计,我使用了很多彩色圆圈,然后使用鞋底的副本进行遮罩。另外,请使用指示的绿色阴影为皮带和脚趾杆重新着色。如果需要更多信息,可以使用参考插图文件。

步骤2

完成正确的人字拖操作后,请像以前一样进行反射。这次,我将左侧人字拖的外底移到了右侧,以改变外观。最后应用“阴影”效果。

步骤3

这是另一个例子。下面列出了我使用的颜色,但是,当然,您可以随意使用所需的任何颜色。在设计时,我使用了由矩形和椭圆形组成的覆盖区。

步骤4

现在,您可以使用任何沙滩拖鞋来组成一个新图标:

至此就完成啦!

返回搜狐,查看更多

责任编辑:

如果您也有此需求,欢迎咨询我们立即咨询