• 微课视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
微课江湖
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 微课视频
  • photoshop
  • Fireworks
  • CorelDraw
  • Illustrator
  • Painter
  • Freehand
  • Indesign
  • flash
  • maya
  • autocad
  • 3dmax
您的位置:首页 > 平面设计 >Illustrator > Illustrator基础教程:详细解析AI参考线创建技巧及使用

Illustrator基础教程:详细解析AI参考线创建技巧及使用

作者:佚名 字体:[增加 减小] 来源:互联网 时间:2017-05-23

佚名 向大家分享了Illustrator基础教程:详细解析AI参考线创建技巧及使用,其中包含ai illustrator教程,ai adobe illustrator,ai illustrator,ai论坛 illustrator,illustrator cs6 ai等知识点,遇到此问题的同学们可以参考下

参考线是做版式设计、Web设计和UI设计的重要工具,用来保持版面元素之间的一致性与协调。在AI里,创建参考线有数种办法。本教程就为大家详细解析AI参考线创建技巧及使用方法,介绍的很详细,知识点很多,推荐给大家,希望大家能从中学到很多知识!

简介:

AdobeIllustrator诞生在1986年,运行在Macintosh机上。在当时,AdobeIllustrator是Adobe公司的早期产品之一,甚至早于Photoshop。Adobe的创始人JohnWarnock带头开发这款产品,最初是希望将自己作为平面设计师的妻子从繁琐的工作流程中解放出来。

所以可以说,AdobeIllustrator最初的客户群体是平面设计师。虽然后来Adobe为UI设计、Web设计等给Illustrator新增了一些特性和功能,不过大体上讲,AdobeIllustrator仍然更侧重版式设计领域。自然而然的,AI也拥有较Photoshop更强大的排版工具,比如更加强大的参考线和网格功能,这次就说说AI里的参考线。

参考线是做版式设计、Web设计和UI设计的重要工具,用来保持版面元素之间的一致性与协调。在AI里,创建参考线有数种办法。

第一种办法与PS类似,按Cmd+R,显示标尺,然后点击标尺,将参考线从标尺上拖拽出来,对齐到想要对齐到的对象上,如图:

Illustrator教程:详细解析AI参考线的使用,破洛洛

Illustrator教程:详细解析AI参考线的使用,破洛洛

这样,参考线就建立好可以使用了:

Illustrator教程:详细解析AI参考线的使用,破洛洛

另一种办法更加灵活,AI可以将任何线条转化为参考线。横着竖着斜着的直线都可以转为参考线,甚至画个圆也可以转成参考线。这次,用实战来举例:创建一个iOS7图标模板:

Illustrator教程:详细解析AI参考线的使用,破洛洛

可能很多人都知道了,相对于以前版本的,iOS7的图标形状有两点改变:

1.在iPhone、iPodtouch上,由原先的114×114px(57×57pt)变为120×120px,不再支持非Retina屏幕(图片摘自WWDC2013Session208:What’sNewiniOSUserInterfaceDesign的PDF):

Illustrator教程:详细解析AI参考线的使用,破洛洛

2.使用纯粹的圆角看上去会觉得圆角与直边连接处很「硌硬」,iOS7使用羊角螺线作为缓和曲线解决了这个问题,因为羊角螺线的曲率变化更加平滑。其中缓和曲线「圆角」大小约为38px。如图:

Illustrator教程:详细解析AI参考线的使用,破洛洛

Illustrator教程:详细解析AI参考线的使用,破洛洛

Illustrator教程:详细解析AI参考线的使用,破洛洛

Illustrator教程:详细解析AI参考线的使用,破洛洛

好,知道这些后,我们就做一个图标模板吧。

首先,新建一个文档,尺寸为120×120,颜色模式RGB,不要勾选「使新建对象与像素网格对齐」。

然后,到这里:File:Eulerspiral.svg下载羊角螺线的SVG矢量图像,用AI打开:

Illustrator教程:详细解析AI参考线的使用,破洛洛

打开以后,用选择工具和直接选择工具大开删戒,一直删成这个样子,即只保留曲线右半部分,从原点到原点右边第五个锚点:

Illustrator教程:详细解析AI参考线的使用,破洛洛

之所以截到原点右边第五个点,是因为在这个点曲线切线斜率刚好为1,即在这一点上曲线切线的夹角刚好是45度,方便使用。

然后,把这段曲线复制进刚才新建的文档里:然后再复制出一个,做一下上下对称、旋转-90度,让曲线能够接上。确保两条曲线的端点对上后,使用「连接」命令连接两条曲线。接着把连接好的曲线大小设置为38×38像素。最后放在画板右下角。步骤可能说起来有些繁琐,总之嘛,做好后应该是这样的:

Illustrator教程:详细解析AI参考线的使用,破洛洛

用直线工具和「连接」命令,把这四分之一图标形状其他部分给补上:

Illustrator教程:详细解析AI参考线的使用,破洛洛

把这段曲线复制、镜像几次,图标的大体形状就出来了,最好再用「连接」命令,将四段曲线连接为完整的一圈:

Illustrator教程:详细解析AI参考线的使用,破洛洛

好,图标的形状出来了。接下来要做的是,使用参考线,把图形内部网格线做出来。

用直线和方框工具,给这个图形里面画一个米字和一个方框,这样:

Illustrator教程:详细解析AI参考线的使用,破洛洛

然后重点来了,选中刚才画的米字和方框,右键点击,选择「建立参考线」命令:

Illustrator教程:详细解析AI参考线的使用,破洛洛

就可以根据选择的米字和方框,把参考线建立好了:

Illustrator教程:详细解析AI参考线的使用,破洛洛

如法炮制,在方框里画一个内接圆,并转为参考线:

Illustrator教程:详细解析AI参考线的使用,破洛洛

利用AI的吸附功能,从每个曲线刚刚由直线被掰弯的那个点上画线(不太好描述,总之见图吧),转为参考线:

Illustrator教程:详细解析AI参考线的使用,破洛洛

Illustrator教程:详细解析AI参考线的使用,破洛洛

最后,给最里面的方框画一个内切圆和外接圆,并转化为参考线,就基本完成了:

Illustrator教程:详细解析AI参考线的使用,破洛洛

把参考图放进去对比看一下,matchperfectly!

Illustrator教程:详细解析AI参考线的使用,破洛洛

最后,用「存储为模板」命令,将其存成一个模板。每次做iOS7图标时,使用「从模板中新建」命令,选择这个模板,就可以方便快速地新建一个带参考线的iOS7图标了。

使用参考线相对于直接用普通的线条、线框相比有什么优点呢?首先,参考线显示起来,始终是1px宽度,无论放大还是缩小图稿都能显示清楚,普通的线条就不可以。再有,参考线可以使用快捷键Cmd+;快速隐藏或显示。另外,参考线通常处于锁定状态,不太会被误编辑。还有,参考线在所在图层永远处于最上方显示,等等。

今天就到这里吧,希望对AI参考线创建技巧及使用有所了解,并能灵活地运用到工作当中!谢谢大家观赏!

</div>
分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

  • Illustrator基础教程:详细解析AI参考线创建技巧及使用
  • AI教程:利用Illustrator制作漂亮的螺旋圆点花纹
  • AI( Illustrator)将人物照片制作成黑白矢量图

相关文章

  • 2017-05-23Illustrator(AI)设计制作漂亮的蓝色艺术字实例教程
  • 2017-05-23AI如何保留将正圆和矩形合并在一起的轮廓?
  • 2017-05-23AI结合PS两分钟制作扁平化长投影教程
  • 2017-05-23AI无法打开插图窗口文件空间不足?
  • 2017-05-23Illustrator CS3把作品转化和编辑为灰度模式
  • 2017-05-23Ai简单绘制可爱的雪人图标
  • 2017-05-23AI简单绘制立体魔方教程
  • 2017-05-23AI快速打造可爱的针织毛线字母效果
  • 2017-05-23Ai简单绘制一个篮球APP图标
  • 2017-05-23AI运用旋转复制工具绘制花的图案

文章分类

  • photoshop
  • Fireworks
  • CorelDraw
  • Illustrator
  • Painter
  • Freehand
  • Indesign
  • flash
  • maya
  • autocad
  • 3dmax

最近更新的内容

    • AI偏移路径怎么使用?偏移路径使用方法介绍
    • AI给图片加上漂亮的放射光线效果
    • AI基础理论教程—等角和拼图
    • Illustrator制作唯美网站主页效果图
    • Illustrator cs5 艺术画笔绘制弯曲的铅笔
    • Illustrator(AI)设计绘制常见的传统图案实例教程
    • Ai绘制一只可爱的蓝色章鱼头像
    • AI简单绘制一个漂亮的刺球
    • Illustrator 绘制金属质感的小闹钟
    • Ai怎么绘制一个打开的木窗户?

关于我们 - 联系我们 - 免责声明 - 网站地图

©2015-2018 All Rights Reserved. 微课江湖 版权所有