用AI创建出一套苹果产品UI图标教程(3)

来源:网络   作者:热心网友   发布时间:2016-09-21    浏览次数:417

步骤2:使用【圆角矩形】工具创建一个76×12、2圆角半径的圆角矩形,颜色c69d4b,打开【变换】面板,将其下面两个圆角设置为0px。放置在下图中的位置。

adding-the-top-darker-section-to-the-tablet-icon

步骤3:添加一个长度为76px、角度为0的粗线,描边设置4像素,颜色303338。放置在上一步创建的形状的下面,如下图所示。

adding-the-horizontal-delmiter-line-to-the-tablet-icon1

步骤4:使用【矩形工具(M)】,创建一个64 x 34像素的矩形,颜色303338,放置在下图中的位置,距离左、上、右、下均为6像素。

adding-the-drawing-surface-to-the-tablet-icon

步骤5:使用【椭圆工具(L)】,添加两个5x5px的圆,放置在上半部分的中间,距离边缘6个像素。

使用【直线段工具(\)】添加一条12px的直线,设置描边为4,颜色303338,打开【描边】面板,将端点设置为【圆头端点】,变成下图中的样子。

tablet-icon-finished

第九步、添加细节我们完成了图标的主要部分!这意味着我们现在可以添加一些亮点和阴影的细节了。步骤1:选中iPod图层,选择iPod中的【所有】形状,按CTRL+G组合它们。选中组合后的形状,右键,选择【隔离选定的组】。

using-isolation-mode-to-add-the-finishing-touches-to-the-icons

进入到隔离模式后,你会看到其他图标变灰了。此时选中iPod的机身本体,将其填充颜色设置为【无】,只留下描边颜色,然后CTRL+C这个形状,再CTRL+B创建一个副本的轮廓,打开【变换】面板,确认宽为66,高为80,描边为4,填充颜色eac363,描边颜色ffffff,使其成为下图中的样子。

打开【描边】面板,将【对齐描边】选择为第二个,如下图。

aligning-the-all-around-highlight-toward-the-inside

步骤2:打开【透明度】面板,不透明度降低到60%,将其【混合模式】设置为柔光。

adjusting-the-blending-mode-of-the-all-around-highlight

步骤3:使用【矩形工具(M)】,创建一个5×20的矩形,颜色ffffff,使用【直接选择工具(A)】同时选中底部两个锚点,向左移动12px。再创建一个8×20的矩形,颜色ffffff,使用【直接选择工具(A)】同时选中底部两个锚点,向左移动12px。打开【透明度】面板,混合模式设置为柔光,不透明度40%,变成下图中的样子。

adding-the-diagonal-highlights-to-the-ipod-icon步骤4:使用钢笔工具(P)绘制出一个可爱的星形,打开【透明度】面板,降低其不透明度为40%,混合模式为正常。然后简单地将它放置在屏幕的某个地方,如下图。

adding-the-star-shaped-highlight-to-the-ipod-icon

步骤5:用相同的方式为iPod图标的按钮添加一个内阴影。记住一定要把颜色设置为黑色000000,不透明度为30%。当你完成了以上所有步骤后,你就可以按下ESC键退出隔离模式啦。一旦你完成了第一个图标,便可以继续制作下一个图标的高光及细节,遵循相同的工作流程。(保持耐心~)

ipod-icon-with-details-added

恭喜你!四枚高端大气上档次的图标完成啦!不要忘记交作业哦~

我们不仅学会了制作这四个APPLE产品图标,还学会了如何使用AI的形状工具、基本图形以及各种不同的面板来工作,我们可以使用这些简单的方法扩展我们的创作并创建更多的扁平图标!

all-icons-finished1

继续加油吧!(^ω^)越努力,越幸运~!

123共3页
联盟广告
×

感觉还不错,那就赞助一下吧!您的鼓励就是我们坚持的动力!

打赏说明:您的赞助我们将用于购买网络带宽和优质设计资源,提升用户体验!

相关推荐

http://www.shejixf.com/shejijiaocheng/uisheji/4965.html
×

一键快速登录后才能下载本站资源

新会员登录即可获取5学币奖励,超爽下载!

×

一键快速登录后才能下载本站资源

新会员登录即可获取5学币奖励,超爽下载!

×

充值学币 立即开通