AI绘制精致APP图标

彩虹网

这篇教程教的AI学习者们使用AI绘制精致APP图标,教程制作出来的图标挺漂亮的,绘制难度也不大。推荐一下的朋友们一起分享学习了,我们先来看看最终的效果图吧:

AI绘制精致APP图标

消息/聊天应用程序图标,头脑风暴你会联想到什么,这里想到的是送邮件的小鸟。本教程主要讲解图标从最初的草图到矢量图标设计思路。简易教程,大神勿喷。

开始绘制草图

把头脑中的想法大概画出来,多画几版,可以不用画的很细。前期也可以收集一些相关的素材,设计应用程序图标时就要考虑图标放在应用程序商店时怎样识别度更高。所以这里选了小鸟的头部为主体,加上邮递员的帽子。

AI绘制精致APP图标

多画几张草图 从中挑选一个合适的

接下来风格的定位,可以到Dribbble找找灵感。

AI绘制精致APP图标

色彩线条风格确定

第1步:

新建尺寸1024 x 1024文档,这是图标最大尺寸。本教程制作的是ios应用程序。

设置网格线间隔:编辑>首选项>参考线和网络(10px,10)

视图>显示网络;视图>对齐网络;

AI绘制精致APP图标

新建文档 设置尺寸和色彩

第2步:置入草图

文件>置入,然后置入草图,在链接的文件中点击嵌入,不透明度50%,重命名为素描,并点击眼睛旁边图标锁定该图层。在"素描"层上新建一层来绘制形状。

分析草图,看看用什么几何形状可以更方便的勾勒出来,用不同的颜色描边,可以更好的区分。主要用的到是钢笔工具、路径查找器(圆形,矩形,三角形,曲线等)详情请看下图:

AI绘制精致APP图标

第3步:调整图层

文件管理,把每一个元素放在单独的图层并命名。图层顺序如下:

1. 帽子

2. 头发

3. 眼睛

4. 嘴

5. 颈

6. 头

7. 背景圈

8. 素描

AI绘制精致APP图标

有条理的排序

第4步:着色

在画好基本形后,接下来就是调整颜色(颜色数量最好不要过多)。这里选用的是ios7中常用的颜色。

AI绘制精致APP图标

ios7 色值表

这是给图形上的基本颜色,在这里左边和右边是分开的,左边75%不透明度和右边100%不透明度相同颜色,这样看起来不会很平。打开窗口>颜色参考(Shift+F3)设置不同的颜色。选择四色组合2,吸管工具(I)吸取ios7中的颜色,就可以在颜色参考中选择合适的颜色;

AI绘制精致APP图标

颜色设置

这里顺便介绍一 形状生成器工具(Shift+M),它可以方便快捷的合并和减去形状。

如果你想把左边和右边的图形组合在一起,可以同时选中左右图形在使用形状生成器工具(Shift+M),然后单击其中一个图形拖动到另一个,你会看到一个加号,表示形状将被添加到当前形状,按下Alt将显示一个减号,表示减去当前选中的形状;

AI绘制精致APP图标

形状生成器工具

第5步:添加细节

画上眉毛,给眼睛、头发、嘴、头、帽子加上淡淡的阴影,可尝试不同用颜色看看效果,细节不宜太多,因为我们这是扁平的风格。

为了更能突出小鸟,复制整个图形,合并图形,并调整图层放在圆与头之间。打开窗口>外观。设置白色描边为6pt,添加新红色描边12pt。在组件面板下中选择风格化>阴影,添加淡淡的阴影,如下图:

AI绘制精致APP图标

添加细节

AI绘制精致APP图标

添加阴影效果

第6步:图标ios7模板

把我们画的图标放在ios7应用程序图标模板上展示效果;

AI绘制精致APP图标

图标在iOS模板效果

第6步:生成图标

使用Photoshop的动作模板来生成不同尺寸的图标,在把做好的图标放进模板;

AI绘制精致APP图标

iOS图标模板

传统的像素画创作过程异常耗时,需要创作者孜孜不倦的保持创作热情,可能画好一幅看似简单的像素画要耗时十数小时。可有的时候急需怎么办呢?今天将展示一个AI小技巧,可以利用马赛克效果迅速打造16位像素画。

1.我们任意打开一张图像,开始先用PS打开,先进行色彩调整和对比度调整,然后用钢笔工具"抠图"

AI绘制精致APP图标

2.不用抠的太精细,等会像素化之后,很多细节会丢失的。

AI绘制精致APP图标

3.将图像导入到AI中,选择对象->创建对象马赛克

AI绘制精致APP图标

4.拼贴数量取决于你想要的细节,拼贴数量越高,画面精细度越高。设置完后一定要点一下"使用比率"按钮来进行调整,以保证每个像素块都是正方形。最后选择删除栅格

AI绘制精致APP图标

5.右键单击,选择取消编组,可重复操作,直到能单独选取每个像素块。

AI绘制精致APP图标

6.从背景中选一小块白色区域,选择->相同->填充颜色。按一下"DEL"全部删除掉。

AI绘制精致APP图标

7."清理"掉像素画中任何不够整洁的地方。可能像素间会有一些白色的细线,这是AI渲染失败所致。不过导出后,这些细线就没了。

AI绘制精致APP图标

8.16位像素画打造完成,怎么样?有没有DOS游戏的感觉呢?

AI绘制精致APP图标

问:还有更偷懒的招吗?

答:PS的 滤镜->像素化->马赛克,不过,不能精细调整。

AI绘制精致APP图标

AI绘制精致APP图标

AI绘制精致APP图标

AI绘制精致APP图标

AI绘制精致APP图标

AI键盘增量巧绘像素画图标

AI描边工具巧应用:齿轮制作

AI制作渐变描边文字

AI使用混合工具模仿制作祥云图案

AI绘制卡通男孩

AI印刷中的实色叠印与透明叠印

巧用AI实时上色工具绘制切面风格插画

AI CS3模仿绘制矢量效果的荷花插画实例教程

AI绘制性感美女

Illustrator文字编辑工具介绍

免责声明:由于无法甄别是否为投稿用户创作以及文章的准确性,本站尊重并保护知识产权,根据《信息网络传播权保护条例》,如我们转载的作品侵犯了您的权利,请您通知我们,请将本侵权页面网址发送邮件到qingge@88.com,深感抱歉,我们会做删除处理。