图文 文字 矩形 在我刚大学毕业时,每次遇到折页设计都有点无从下手,有一次,我的总监跟我说,你可以试下先用色块将信息进行分组。这么一来,思路果然清晰了很多,后来我知道,并不是设计折页就一定要用色块,但它确实是一种高效的排版方式。与色块相对应的是线框,我把这二者统称为图文框,即可以用来插入文字或图片的排版神器,这是在版式设计中运用非常广泛的手法,大家肯定也用过,所以,今天我们就来聊聊,如何通过正确使用图文框来使你的设计变得更优秀?往期回顾:高手的平面课堂!用「线」排版必须做好的6个细节在做版式设计的时候,我们经常会用到一种元素来辅助排版——线,“线”具有区隔内容、强调信息、平衡版面、指引、组合、连接、装饰等诸多功能,能有效解决很多版式问题,但“线”的使用并没有表面上看起来那么简单,很多设计新人在用“线”排版时会出现:冗余、死板、不平衡、不美观等问题,所以,葱爷今天就来阅读文章 > 一、图文框的种类不同造型和形态的图文框,其气质以及用途也会有所差别,常用于排版的图文框有以下几种:1. 几何图文框几何图形是最简单的图文框,最常见的有矩形、圆形、椭圆形、圆角矩形等等,主要用于信息分组、信息强调。2. 异形图文框这类图文框常用于海报设计中,像一块补丁一样,把文字插入在画面中,有点拼贴艺术的感觉。3. 对话框对话框具有一定的指向性,常用于排版对话文案、海报标题、插入补充性文字等。4. 爆炸框爆炸框具有很强的视觉冲击力,以往最常用于商品价格之类的促销信息,近几年,爆炸框在海报设计中非常受欢迎,变成了一个很时尚的设计元素。5. 立体框即在平面图文框的基础上增加 3D 效果,这种图文框视觉效果更突出,而且可以加强版面的空间对比,是设计促销海报的不错选择。6. 虚线框虚线框比起线框在视觉上更精致、更可爱,如果你想用图文框进行排版,但又不想图文框很突出,或者是做与儿童相关的设计时,虚线框会是一个不错的选择。二、如何选择合适的图文框前面我们介绍了几种不同造型的图文框,但其实除了造型上的差异,图文框还有圆角和尖角、直线和曲线、填色和描边等方面的差异,我发现很多设计师经常会用错图文框,那么,该如何来选择正确的图文框呢?通常是根据视觉调性和内容的多少来选。如果想要高级、简约的效果,适合用几何形图文框,如矩形、圆形、椭圆形、拱门形等,而且一般是用描边图文框,当然描边自然不能太粗。如果想要时尚一点、酷一点,通常要用填色图文框,即我们平常所说的色块,而且图文框的轮廓最好是比较尖锐、硬朗的,比如直角矩形、平行四边形、尖角的爆炸框、像素图文框、不规则的多边形等等。当然,这类图文框的色彩搭配也很重要,通常是使用饱和度较高的对比色。如果想要视觉效果柔和一点、可爱一点,则更适合使用一些圆润、柔软的图文框,比如圆角矩形、圆形、云朵形、曲线异形等等。如果想要复古或中国风的效果,用中式、港式的图形框很容易出效果,这类图文框通常是描边图文框,或者是填色加描边双效果图文框,而且描边通常较粗。圆形、椭圆形、爆炸框之类的图文框,通常只适合文字比较少的情况,文字较多时,矩形框和异形框会比较适合。三、图文框的使用小细节图文框内的文字应该与图文框的边界保留一定的距离,通常来说,在文字是横排的情况下,文字离图文框的上下距离不得小于正文的行距,左右不得小于 1 个正文字符的宽度。当然,重点是视觉要舒适,要便于阅读,如果文字比较多、字号比较大,那么通常会排得比较满,即文字与图文框边界的距离会比较小,反之,则会比较大。如果想要视觉效果比较轻松、高级,那么图文框内的留白可以尽量多一点,比如网页和 UI 中的按钮设计通常就是这么做的。文本框内的文字排列方式,要尽量与文本框的形状相呼应,视觉上才会比较和谐,即矩形框的文字也要排成矩形,圆形框的文字要排成圆形。在下方的长图中,文字排版的轮廓形状基本都是跟所对应的图文框轮廓相呼应。四、如何避免版面变得死板?图文框内的文字尽量不要左右两端严格对齐,可以采用居中对齐或者左对齐等方式,不要把图文框塞得太满,尽量多留一点呼吸空间。给文字信息加上图文框还只是开始,如何排好框内的文字才是重点,要尽量把图文框内的排版做得精致一点。框内的文字必须有着丰富对比关系和清晰的层级关系,比如要有字号大小区分、颜色区分,可以给小标题增加小的图文框、用图文框突出某些重要词句、用线区隔信息、给信息进行分组、加一些装饰元素等等。图文框之间可以错位排版和叠加处理,不要每个图文框都严格对齐和均等分布;图文框之间也可以有大小对比、轮廓对比、方向对比、空间对比等,这样的版面才会有主次,有变化,视觉上不至于太单调。可以对图文框进行适当打破,使一部分元素或文字冲出图文框,比如把部分文字或图片元素叠加在图文框的边界处,创造出框里框外的对比效果,也可以加强版面的灵活性。注:最好不要把版面里的所有元素都放进图文框内。使用不规则图形作为图文框,或者将图文框和文字一同做旋转和扭曲,也可以有效打破传统、常规的视觉效果。结语图文框真的非常强大,结合不同的设计需求和其他设计知识,你可以创造出无限的可能,基本上可以解决大部分的设计问题,以上葱爷分享的内容只是九牛一毛,这些所谓的方法也绝对不是标准,因为设计是不存在标准的,所谓的经验和技巧只是能帮助经验不足的设计师可以更快做对、做好,如果你够强,所有的经验都可以打破。本篇来源:优设网原文地址:https://www.uisdc.com/layout-design
图层 工具 矩形 作者:MUTI来源:UiiiUiii关于教程用图形加噪点的方式,你也可以设计出一幅迷人的郊野风光~教程效果图教程步骤步骤1:新建文档打开Adobe Illustrator,点击文件 – >新建( 快捷键Ctrl+N ),创建一个新文件,参数设置如下:步骤2:创建背景找到AI的图层面板,双击图层名称处,将名称修改为“背景-河”: 选中“背景-河”图层,使用矩形工具(快捷键M),待鼠标变为十字形后,在画板中间点击一下,如下图,输入数值,绘制一个1600x1200px的矩形,颜色填充为#4086C6。步骤3:绘制沙滩3.1将刚刚做好的 “背景-河”图层锁起来,并建立新图层命名为“沙滩”3.2选中 “沙滩”图层,用钢笔工具(P)开始绘制形状,并填充颜色#F2B2523.3使用用钢笔工具(P)绘制好形状后,可以用直接选择工具(A)调整锚点步骤4:绘制草丛4.1建立新图层命名为“草丛,使用椭圆工具(L),绘制4个椭圆,并打开路径查找器,选中四个圆形点击联集选项,如图4.2使用矩形工具(M),绘制1个矩形,打开路径查找器,选中刚刚做好的图形和矩形点击减去顶层选项,如图4.3绘制完成后选中形状填充颜色#A7A6354.4剩下的几个草丛的绘制也是用上面同样的方案,完成后选中形状填充颜色,颜色参数如下:4.5绘制填充完成后按照上图位置摆放好,并选中整个“草丛”图层,将该图层放在“沙滩”图层下面步骤5:绘制河边景物5.1建立新图层命名为“河边景物,景物分成两个部分,一个是草地,一个是沙滩,用钢笔工具(P)绘制以下形状5.2绘制完成并填充颜色,参数如下步骤6:绘制小房子6.1建立新图层命名为“小房子”6.2以下图这个小房子为案列,用矩形工具(M)绘制好门和窗口等几个矩形,如图6.3用多边形工具绘制三角形,颜色填充为# FBFAD5,使用直接选择工具(快捷键A)选中最上方的点,调整三角形的高度大小用矩形工具绘制一个矩形,颜色填充为#ED5131,使用直接选择工具(快捷键A)选中矩形最上方两点,将点向左平移,完成后如下图:6.4第一个小房子已经全部绘制完成,按图片的摆放位置讲图形组合起来6.5剩下的几个小房子做法和上面一样,颜色参数如下,没有标明颜色参数的表示颜色参数相同步骤7:绘制小植物7.1因为这些小植物和小房子之间有互相遮挡的关系,所有所有的小植物都在“小房子”图层进行绘制,先用钢笔工具(P)绘制以下不规则的形状,并填充相应的颜色7.2用绘制草丛的方法绘制以下相对规则的图形,参考如下:7.3将绘制好的小植物按图片组合排列起来变成一颗小数7.4现在小植物已经全部绘制好了,将这些小植物结合小房子的遮挡关系可以随意调整形图层的顺序(右键>排列>置于顶层/底层),排列如下:步骤8:绘制河边小草8.1创建新图层,命名为“河边草”,并用钢笔工具(P)绘制出图案,并填充相应的颜色8.2绘制完成后形状按照图片的位置移动摆放好步骤9:绘制树木9.1创建新图层,命名为“树木”,第一步先用钢笔工具(P)绘制出大的树干,并填充颜色#9339329.2第二步用椭圆工具画出几个圆,打开路径查找器选择联集,然后再用矩形工具画一个矩形置于刚刚做好的那个形状的上方,选中两个形状打开路径查找器选中减去顶层,这样树的部分就做出来了。9.3完成后填充好相应的颜色,参数如下9.4第三步,用钢笔工具(P)绘制出小树枝,并填充颜色#9339329.5大树部分已经全部绘制完成了,接下来继续做画面前面部分的小树,用钢笔工具绘制出以下形状9.6现在“树木”图层所有的绘制已经完成,下面按照图片的位置摆放好这些图形步骤10:绘制餐布10.1创建新图层,命名为“餐布”,用钢笔工具(P)绘制出餐布的形状,并填充颜色# EC432C步骤11:绘制袋子盒子11.1创建新图层,命名为“袋子”,用钢笔工具(P)绘制出以下袋子的形状,并填充颜色11.2袋子绘制好后接下来我们绘制盒子,首先先用矩形工具绘制出一个矩形,然后选中该矩形打开菜单栏的效果>3D>凸出和斜角,调整角度和参数,这样一个立体的盒子形状就出来了11.3确定完成后我们给它修改颜色。首先它现在是一个整体,我们选中这个立体的盒子打开对象>扩展外观,然后选中这个立方体右键>取消编组,然后就可以将这三个面分别填充颜色啦。11.4盒子绘制好后接下来我们来用钢笔工具绘制出盒子上面的装饰物,组合起来就完成了。11.5这个盒子袋子部分全部完成后,可以调整他们的位置关系,将他们按图中位置摆放好就可以了步骤12:绘制食物和物品12.1创建新图层,命名为“食物”,首先我们先绘制出这个玻璃瓶,使用矩形工具(M)和多边形工具,绘制出两个矩形和一个三角形,将它们拼接放在一起,选中这三个图形然后打开路线查找器点击联集,然后就变成一个瓶身的形状了,接着我们选中这个形状打开直接选择工具(A)调整特点锚点,使它的边角变得平滑圆润一点12.2绘制糕点,先用椭圆工具绘制一个椭圆,然后使用钢笔工具绘制出一个斜面的三角形,绘制完成后用直接选择工具调整锚点,使侧面的边变得弯曲的弧度。接着用矩形工具绘制出一个矩形,选中右边的两个锚点向上平移就完成了。12.3.1绘制蛋糕,首先我们先看看蛋糕的分解图,颜色参数如下12.3.2首先我们用椭圆工具画出一个椭圆,那么蛋糕的高度怎么做呢,我们还是用到前面说过的方法。选中这个椭圆,打开菜单栏的效果>3D>凸出和斜角,调整角度和参数,这样蛋糕的高度就出来了,做完之后记得打开对象>扩展外观,然后选中这个形状右键>取消编组,然后就可以分别填充颜色啦。12.3.3接下来我们要绘制蛋糕的装饰。用椭圆工具画出一个椭圆,然后用直接选择工具改变椭圆锚点,将它改为尖角,改完锚点后选中这个椭圆然后用旋转工具(R)按住Alt键点一下下方你想要的中心点的位置,然后会出来这样一个框,调整旋转角度为90°,点击复制,然后就会有两个这样的形状了,接着连续点两下Ctrl+D ,就会出现四个这样相同的图形了12.3.3接下来我们要绘制蛋糕的缺口。用钢笔工具绘制出形状,调整一下锚点即可12.4绘制面包,用椭圆工具绘制出几个椭圆,面包上的三个椭圆使用直接选择工具调整锚点12.5绘制水果,用椭圆工具画出两个圆,然后使用钢笔工具勾勒出小叶子的形状12.6绘制小餐布,使用钢笔工具勾勒出形状12.7绘制篮子,使用钢笔工具勾勒出形状。步骤13:绘制人物13.1.1创建新图层,命名为“女人”,我们先来看看这个人物造型的分解图13.1.2人物部分的造型都是用钢笔工具(P)绘制完成的,完成后组合在一起就可以了,我们主要来看看这个酒杯是怎么做的。第一步先用矩形工具画出一个矩形,然后选中最下面的两个锚点,调整圆角弧度到最大。里面的红酒就可以将刚刚做好的杯子直接复制一个出来,然后可以按住Alt键中心缩小一圈,接着我们使用钢笔工具画出一条斜线,选中该斜线将斜线打开对象>扩展外观。完成之一步后,同时选中这两个形状,打开左侧工具栏的形状生成器点击一下,可以按住Alt键删除不需要的部分 ,这样红酒就做出来了。13.2创建新图层,命名为“男人”,先来看看这个人物造型的分解图,我们直接用钢笔工具勾勒出形状就可以了,酒杯的做法和上面的一样这里就不再重复了。步骤14:保存导出PSD格式文件14.1到现在为止我们AI部分的绘制就已经全部完成啦,我们先来看看整体的效果14.2接着我们就要去PS里面完成质感效果,在这一步之前我们要现在AI里完成很重要的一步。首先我们打开图层面板,选择图层,打开右边提示的这个按钮选项,选择释放到图层(顺序),接下来每一个图层依次安装这个操作进行。14.3等到所有图层都完成释放到图层(顺序)这步骤后,我们点击菜单栏的文件>导出>导出为>选择导出文件为PSD格式,这时会弹出一个提示框,我们选中写入图层和勾选最大可编辑星,现在优化图稿就点击确定,这样就可以导出PSD格式的文件啦。步骤15:在PS添加噪点效果15.1接下来我们要在Adobe Photoshop打开刚刚保存的PSD文件,然后在PS里面完成噪点的质感效果,那么我们的质感效果要怎么添加呢,在这里我们简单示范一下。我们添加的噪点质感分为两部分,一部分是暗面,一部分是亮面。我们要确定好光源位置,然后就可以区分暗面和亮面了。首先我们先选中要做效果的这个形状的图层,然后在该图层上方添加新图层“暗面”,模式改为正片叠底15.2接下来我们使用画笔工具(B)选中柔边缘,模式改为溶解,笔刷可以适当的放大,降低不透明度和流量,颜色用吸管工具(I)吸一下原本形状的颜色即可。15.3这样我们暗部的噪点效果就会出来了15.4做好暗面的噪点之后我们再接着做亮面的噪点,我们在暗面图层的上方添加新图层“亮面面”,模式改为滤色,记得按住Ctrl键点一下下面那个需要做质感图层的图层略缩图,这样我们画面中就会出现一个选区(虚线边框),这样我们的做的效果就会只出现这里里面了,然后我们同样是使用柔边画笔溶解模式下进行涂抹就可以了15.5画面里的所有形状物体的噪点质感都是上面这个方法完成的哦,这里就不展开详说啦!我们来看看添加完噪点质感最终效果图吧。
角形 矩形 椭圆 前言:下图是一张矢量格式的卡通地图,这类矢量插画通常在绘本上或者游戏上比较常见,如果您是初级设计师,可以通过这个AI教程来学习一下简单AI插画的绘制方法。教程软件:Adobe illustrator教程难度:简单教程 & 步骤Step 1.打开Adobe Illustrator后,创建一个宽度和高度均为850像素的新文档(文件 > 新建)。点击椭圆工具(L),添加几个任意形状的椭圆。确保填充色是R=229, G=217, B=180。这些形状将会变成你(设计的)大陆。Step 2.使用变形工具(Shift-R),然后根据需要拖动和拉伸这些椭圆。只要记住选择要变形的对象,否则会使周围的对象变形。变形工具(Shift-R)的选项在这里并不重要,但是如果你不喜欢你现在的选项(例如拉伸笔刷的直径太大或太小),你可以双击这个工具,将会出现一个新的对话窗口,也就是变形工具选项窗口。在该对话窗口上,那里你可以改变全局画笔的尺寸和强度,并勾选“显示笔刷的大小”。Step 3.如果你想让你的大陆的形状更真实,你可以通过应用效果>扭曲和变换>粗糙化来实现。在新的对话框窗口中,您可以改变选项来实现您想要的结果。如果勾选了“预览”选项,就可以实时看到在画板上的所有更改。你可以一个一个地处理,也可以一起处理。当你对它们的外观满意时,点击OK按钮。扩展所有的陆地形状(对象>扩展外观)。Step 4.选择所有的大陆形状,然后选择对象>路径>偏移路径…在新的对话框窗口中,输入大约10像素的偏移量,但这取决于你画得大陆形状的大小。点击OK按钮。一块新的大陆将均匀地出现在每一块大陆上。将这块新大陆形状的填充色改为R=234, G=224, B=195。再次为你的大陆创建一个新的陆地(对象>路径>偏移路径…),使用一个稍微浅的填充色(R=234, G=224, B=195)。在我们的地图上,在颜色较浅的陆地的部分,我们试着表示陆地表面下降到海里的样子。Step 5.使用椭圆工具(L),在各大陆上绘制更多的椭圆,填充色R=232, G=221, B=190。在较大的椭圆上添加较小的椭圆,并改变它们的填充色为(R=235, G=226, B=199)。Step 6.想要变形这些新的椭圆,你有两种选择来实现:使用变形工具(Shift-R)或者选择效果>扭曲和变换>粗糙化…选择任意一个,然后扩展这些形状(对象>展开外观)。Step 7.我们最后要增加到大陆上的是湖泊。在你想要湖泊出现的位置画一些浅蓝色的椭圆(R=167, G=214, B=210)。然后使用变形工具(Shift-R)进行变形。记得在变形前选择每个对象。在较大颜色较浅的椭圆上添加较小颜色较深的椭圆(R=150, G=204, B=200)。使用变形工具(Shift-R)扭曲它们。在较大颜色较浅的椭圆上添加更小颜更深的椭圆(R=141, G=198, B=195)。使用变形工具(Shift-R)扭曲它们。2.如何在卡通地图上绘制海洋Step 1.使用矩形工具(M)并单击画板。在新的对话框窗口中,输入宽度和高度均为850像素,然后点击OK按钮。一个大的正方形会出现在你的画板上,也就是我们地图上的水或海洋。确保水域保持在画板的中间,并改变它的填充颜色为R=141, G=198, B=195。Step 2.选择其中一个大陆颜色最浅的边界,并在其后面拷贝一个副本(Control-C, Control-B)。把它扩大一点,并把填充色改为R=167 G=214 B=210。选中这个副本,使用变形工具(Shift-R)对其进行变形。对每个大洲都重复这种操作。Step 3.选择环绕大陆的浅蓝色形状,并在后面创建一个副本(Control-C, Control-B)。把它扩大一点,并把填充色改为R=150 G=204 B=200。选择这个副本,使用变形工具(Shift-R)对其进行变形。对每个大洲都重复这种操作。Step 4.删除填充色,并将描边颜色设置为R=167, G=214, B=210。使用铅笔工具(N),在描边面板(窗口>描边)上,选择圆头端点和圆角连接。现在开始有趣的部分:在整个海洋中绘制波浪。如果您发现描边太细,请在描边面板上增加描边的重量(窗口>描边)。3. 如何在卡通地图上绘制陆标物体Step 1.让我们从树开始绘制。因为我们的地图是卡通风格的,所以的树(的形状)会非常简单,对于绘制部分也是如此。用矩形工具(M)画一个长矩形,填充色为R=191, G=157, B=106。然后在其上方添加一些椭圆当作树叶(填充颜色R=193, G=191, B=111)。将整个树分组(右击>编组)。复制一些你刚刚创建的不同大小的树,并把它们分散到各个大陆上。Step 2.要绘制云杉,再次从一个矩形开始(填充颜色R=162, G=124, B=102)。使用多边形工具并绘制一个三角形。默认情况下它有六个边。如果你有AI的新版本,当你的多边形被选中时,在选择的右边你会看到一个很小的菱形。如果你逆时针拖动这个小菱形,多边形的边数就会变少,如果你顺时针拖动它,多边形就会增加边数。所以通过逆时针拖动小菱形,从多边形中创建一个三角形。如果你的AI的版本不是很新,选择多边形工具,点击你的画板。在新的对话框窗口中,输入任意半径,边数3,并单击OK。这就用来做云杉的三角形。创建两个绿色三角形的副本(填充色是R=168, G=168, B=108),并将它们相互重叠,从而形成云杉。将整个云杉编组(右击>编组)。复制几棵云杉,把它们铺遍所有的大陆。Step 3.现在,让我们添加一些山脉。创建三个不同大小的棕色三角形(R=162, G=124, B=102)。它们必须重叠,它们的底线必须在同一个水平上。进入路径查找器面板(窗口>路径查找器),选中所有三角形,点击合并按钮。然后,创建更多的白色三角形,并将它们倒置。我们正在山上绘制雪。添加与棕色三角形重叠的白色三角形,如下所示。白色三角形也应该相互重叠。选择所有白色三角形,点击路径查找器中的合并按钮(窗口>路径查找器)。接下来,再次选择棕色三角形(现在它们应该是一个形状),并在其前面创建一个新的副本(Control-C, Control-F)。选中这个副本,并在按住Shift按钮的同时,选择白色三角形(它们也应该作为一个形状连接在一起)。最后,按下路径查找器中的相交按钮。你应该得到一座雪山。一定要将其编组。创建更多的山脉副本,并将它们分散到各大陆上。Step 4.到目前为止,我们一直在创造大自然(的物体),现在我们需要更多人类居住的迹象,所以我们需要房子。从一个没有边框颜色(它的存在只是为了更好地显示)的白色矩形开始(使用矩形工具(M))。添加一个小的灰色矩形(填充色为R=168, G=193, B=192)作为窗户。当按住Shift和Alt键时,将这个小的灰色矩形向右移动。Shift键允许您直接移动它,Alt键创建一个副本。选择这两个小的灰色矩形,当按住Shift和Alt按钮时,将它们向下移动。现在应该有四个窗口了。多次按下Control-D键,你就可以让你的房子在垂直方向充满窗户。Control-D组合允许你重复最后一个动作。让我们添加地下室:这将是房子底部的一个蓝灰色矩形。每个房子需要的最后一个部分就是屋顶。在屋顶上创建一个长、水平的红色矩形(R=219, G=134, B=97),然后再添加一个应该更窄更高的矩形。选中最后创建的那个红色矩形,选择效果>变形>膨胀。在新的对话框窗口中,输入如下所示的选项。第一所房子准备好了!以下是膨胀效果的选项:确保你的房子是编组的,复制几份,然后分散开来。Step 5如果有不止一种类型的房子就好了,所以让我们再创建一种。从一个没有边框的白色矩形开始。然后绘制一个与前一个房子填充颜色相同的窗口。选中这个窗口,转到效果>变形>上弧形,在新的对话框窗口中,输入如下所示的选项。现在创建几个窗口。我们使用与之前相同的方法来增加窗口。然后加上地下室和屋顶。填充你想要的颜色(你想要之前的房子红色填充色),使用滴管工具(I)。选中屋顶,进入效果>变形>弧形,并输入如下选项。第二所房子建好了!以下是上弧形效果的选项:下面是弧形效果的选项:确保第二宫是编组的,复制几份,然后分散在各大陆上。Step 6.为了增加更多类型的建筑,我决定添加一座教堂。它是可选的,所以你自己决定是否添加。我认为现在你知道如何建造这样的房子了,所以你可以尝试自己建造。把教堂放在你想去的大陆上。Step 7.我们最后想要的是一艘船。从一个没有边框颜色的白色矩形开始。添加一个小的灰色圆圈(所有房子的窗户都使用相同的填充色)。按住Shift和Alt键的同时,再创建几个窗口。在船的顶部添加一根长管子,上面用长方形标出两条红色条纹。接下来,继续按照下图创建小船。最后,如果你想要扭曲船的底部,使用直接选择工具(A)并移动红色矩形上方锚点。将绘制好的船编组。制作几艘船的复制品,并把它们放在大海上。来源:design.tutsplus.com 作者:Nataliya Dolotko
拉出 按下 矩形 台湾设计师施博瀚分享的「我用以拉拉拉的」系列。设计师以图文结合的方式,每一期分享一个简单又实用的设计技巧,从2020年3月23日的第一期开始,至今已经更新到了第40期。(注:由于台湾版本的AI界面文字翻译与大陆不同,因此需自行对照软件界面学习)例如第一期分享的「拒绝再画傻瓜双框线」,这是不少设计师常常会犯的小错误,但实际上要在AI画一个正确的双框线并不难。拒绝再画傻瓜双框线选取欲制作物件,点击上方物件→路径→位移复制,设定负值位移,按下确定,完成(点击可查看大图)是不是一看即懂而又非常的实用呢?当然类似的小教程还有非常多,在这里再给大家列举一部分:巧用自动计算大部分软件中都带有自动计算功能,当你需要设定尺寸或者旋转角度的时候,就可以让软件直接帮你算,在数值上直接输入加减乘除(+-*/)即可:快速微调字距与行距:按住option+键盘左右键即可微调字距;按住option+键盘上下键即可微调行距超实用配色技巧:秒配出延伸系列色将配好的颜色区域全选,选择编辑→编辑色彩→重新上色图稿;切换为「编辑」;锁住右下角的连结;接着旋转色环中任一色标,其他色标就会跟着转动;配色完成想在AI画一块立体蛋糕?没问题:拉出蛋糕的断面,将图形们群组;使用效果→3D →回转;调整旋转数值、回转角度(蛋糕大小) ;点开「更多选项」,调整环境光、光源、渐层阶数,按下确定;完成AI虽然作为一款矢量软件,却可以做出不少立体效果,比如最近非常火的:如何做出黑洞效果?拉出矩形与文字转90度重复排列整齐;从视窗中叫出符号,把排列好的图形制作成符号;用钢笔工具拉出一个弧形,使用效果→ 3D →回转;输入旋转数值、自右侧回转、按下「对应线条图」;从符号中叫出刚刚的图形;使用「缩放以符合」、勾选「隐藏几何」,按下确定;使用矩形工具拉出一个矩形放置最上方,圈选两者按下滑鼠右键「制作剪裁遮色片」,完成
步骤 明度 矩形 1.创建背景今天给大家带来一个有些老的教程,但是练习技法什么的还是不会老哈!步骤1我们可以创立两个文件图层,一个叫背景,一个叫游戏机,然后我们确保位于正确的图层上,然后使用矩形工具 (M) 创建一个800 x 600px的形状,我们将使用#F96969进行着色,然后使用”对齐”面板的”水平和垂直对齐中心”来对齐画板的中心位置。步骤2完成后,锁定当前图层,然后我们到下一个继续图层绘制,这个时候我们就将开始绘制我们的游戏机了。2.创建游戏的正面底部有了背景,我们现在可以专注于我们的小游戏机了,我们将使用Illustrator 的一些基本形状创建该游戏机。我们将首先绘制设备的正面部分,完成后将会绘制侧面的厚度部分。步骤1开始绘制设备的主体,创建一个144 x 232px矩形的圆角为 8px,我们将使用#EDE4E4来着色。步骤2使用直接选择工具 (A),选择形状的右下角,并通过在变换面板的矩形属性将其半径设置为 32 px 来调整其圆度。步骤3创建游戏机的侧面部分,选中我们现在绘制好的形状的副本(ctrl-C + ctrl-B),并将其向左移动 24 px,确保将其颜色更改为较暗一些的颜色(#DDCCCC)。步骤4创建一个游戏机主形状的副本 (Ctrl-C), 并将其粘贴到原位 (Ctrl-F),然后通过进入对象 > 路径 >偏移路径,并将偏移的值设置为-4px。步骤5我们将使用此偏移来创建外部的高光,通过选择它的副本,然后使用路径查找器的减去顶层形状模式来切掉不要的部分。然后,选择生成的形状并将其颜色更改为白色(#FFFFFF),将其混合模式设置为”变亮”,并将其不透明度降低到 40%。步骤6此时,最好使用 Ctrl-G 键盘快捷键把做好的元素打组,从而将游戏机的正面与其侧面部分分开。这样,我们只需双击分组对象就可以进入隔离模式,然后就可以向其添加新的东西。使用矩形工具 (M), 创建一个 144 x 4 px 水平分隔线 (#D8C5C5), 我们将会设置一个距离游戏机的顶部16px的间隙.步骤7在它上方添加另一个更暗的144 x 2 px 矩形(#C1A8A8),当添加完第二条水平分隔线后,选择它和较粗的线,并使用 Ctrl-G 键盘快捷键将它们组合在一起。步骤8接下来,我们将在我们刚才创建的两条水平分隔线上添加两个 6 x16px 的矩形 (#D8C5C5),将每个矩形放置在正面边缘距离中心12 px的地方。步骤9将刚才绘制的矩形放在其顶部,然后将它们 (Ctrl-G) 打组,这样就不会因意外而让他们错位。步骤10使用矩形工具 (M), 再创建两个 2 x 10 px 形状,我们将使用白色(#FFFFFF)着色,然后定位到每个垂直分隔器的左侧,确保将其混合模式调整为”变亮”,并将其不透明度降低到 40%。步骤11接下来,我们将开始绘制关闭/打开开关,创建一个10 x 4px 矩形(#D8C5C5),将其对齐正面的顶部部分,并将其定位到第一个垂直分隔器的右侧。步骤12使用圆角矩形工具,创建具有4px 圆角的28 x8px的形状(#D8C5C5),然后添加一个较小的20 x 4px圆角矩形(#EDE4E4),其顶部圆角半径为2px。步骤13创建两个2 x 4px的矩形 (#EDE4E4),然进行圆角处理,然后放到图片中对应的位置。步骤14使用三个2 x 2px的矩形(#C1A8A8)作为阴影,从而赋予此部分更多立体感。步骤15通过添加一些细节(如垂直线下方的阴影)来完成开关,重复使用我们已有的形状,通过将其颜色设置为#C1A8A8来调整它们。添加阴影后,不要忘记将细微的高光绘制到开关的按钮上半部分,使用白色(#FFFFFF),为混合模式提供”变亮”,为”不透明度”设置为 40%。步骤16在较宽的水平分隔线下方添加一个 136 x 2px(#FFFFFF)矩形,通过将混合模式设置为”变亮”并将其不透明度降低到 40%,我们将其作为高光。到现在,我们几乎完成了游戏机的上半部分,这意味着我们现在可以专注于创建显示器了,这是所有的乐趣发生的地方。步骤17选择圆角矩形工具,创建一个 88 x 120px 的形状,具有 4 px 的圆角半径,我们将使用#7E7E89进行着色,然后将其定位在水平高光下方具有4 px 的距离的位置。步骤18显示屏就位后,我们必须稍微调整一下,将其右下角半径设置为 20 px,而不是用默认的4px。步骤19使用前面创建正面的方法创建显示器的厚度感,然后选择形状并将其颜色更改为黑色#000000,将其不透明度降低到 20%。步骤20在使用类似的过程,添加一个2 px宽的内部高光,使用白色(#FFFFFF),为混合模式为”变亮”,不透明度为 20%。步骤21在矩形工具 (M) 的帮助下,创建一个 80 x 64px 的形状,我们将使用#82874D进行着色,因为它将充当显示器的活动区域,并将其放置在灰色图形上,确保将其与其中心对齐。步骤22通过使用偏移路径工具绘制4 px 厚的内阴影(颜色:黑色)为屏幕提供一些厚度感然后不透明度设置为20%。步骤23添加阴影后,选择笔工具 (P) 并跟随几个对角线绘制高光,使用白色(#FFFFFF)作为填充颜色,将混合模式设置为柔光,并将不透明度降至40%。步骤24此时,屏幕已接近完成。我们现在需要做的是添加一些小点缀在游戏机上面,然而你可以使用#6B6B75来着色。步骤25通过添加两对白色垂直矩形来作为高光,将其混合模式改为:变亮;不透明度:20%,然后选择其所有组合元素,并使用 Ctrl-G 键盘快捷键将它们打组在一起。步骤26使用椭圆工具 (L) 创建一个 44 x 44 px 的圆圈(#DDCCCC),他将距离屏幕底部大约 24 px。步骤27创建一个垂直的14 x 36 px 圆角矩形(#6B6B75),其圆角半径为2px ,我们将添加副本并旋转他,确保将它们居中到基础圆的中心。步骤28通过添加一个 12 x 12px 的圆圈(#5E5E68),为按钮提供一些厚度感。我们将圆放置在中心位置。步骤29通过添加几个白色矩形来作为高光,然后混合模式:变亮,不透明度: 20%,和阴影(颜色:#BAA0A0),然后将它们组合在一起(Ctrl-G)。步骤30由于我们将再添加几个按钮,因此现在最好添加垂直高光,这样我们就不必在创建后将它们调整到后面。因此,使用矩形工具 (M) 创建四对高光,对填充颜色使用白色 (#FFFFFF),将混合模式设置为”变亮”,并将不透明度降低到 40%,并将它们定位到游戏机的右侧。步骤31添加高光后,您可以选择椭圆工具 (L), 并用它来创建两个16 x 16px的按钮(#A86578),我们会将他放置在距离游戏机的右侧36px与距离底部62px的位置。(其中一个按钮)步骤32通过创建一个白色的半圆来作为高光,然后混合模式为:变亮,不透明度为: 20%,并使用形状的副本来作为小阴影,我们将使用#DDCCCC进行着色,然后使用 Ctrl-G 键盘快捷键将所有按钮元素组合在一起。步骤33把我们刚才的按钮复制一份放到下图差不多的位置即可步骤34选择钢笔工具 (P),并使用8px带圆角的描边(#7E7E89),绘制一条将用作选择按钮的斜线。步骤35给按钮绘制一个的高光,使用白色大小为2px的线,记得线要用圆角的哦,底层阴影(颜色:#DDCCCC,大小为8px。将它们打组(ctrl-G),并在大约相距4px的位置处创建副本。步骤36在游戏机的右下角添加小扬声器格栅,绘制六条 4px 粗细的描边线(#AD9C9C),带有圆角的哦。步骤37做好了之后我们可以吧之前做的那个开关放置到底部这里来,如图的位置!这样我们的游戏机就差不多做完了。然后我们需要绘制一个圆角矩形!放置到方向键的上面。如图所示!3. 将添加一些细节到游戏机的侧面此时,我们几乎完成了在游戏机正面的工作,这意味着我们现在可以专注于它的侧部。步骤1选择正面部分的主高光的副本,并将其粘贴到侧面,确保将其与左侧对齐,其不透明度设置为60%,然后打组 (Ctrl-G) 并将它们同时放到到背面(右键单击>排列>发送到底部。步骤2创建游戏机正面部分的副本(Ctrl-C + Ctrl-F),然后对其应用 4px 的偏移,我们将在副本的帮助下来创建新的图形。然后,将生成的形状的颜色更改为#BAA0A0,并将其放到其左侧,使其与游戏机侧面可见区域的中心对齐。步骤3现在我们需要把多余的部分用剪切蒙版去掉!对于剪切蒙版的用法不清楚的小伙伴可以看看我以前的教程哦!步骤4使用矩形工具 (M) 创建一个 10 x 4px 的形状,我们将使用#BAA0A0进行着色。步骤 5接下来,在我们刚刚创建的水平分隔线上方添加一个10 x 2px的矩形作为阴影(#A58888),并在下面绘制10 x 2 px的白色矩形作为高光,混合模式:变亮,不透明度: 60%。步骤6选择矩形工具 (M) 并创建10 个8 x 2 px形状,我们将使用#A58888进行着色,并彼此垂直分布6px,确保将它们到游戏机的底部有48px。步骤7使用我们刚刚创建的矩形组,并将它们下移2px,将其颜色更改为#BAA0A0,这些图像更有厚度感!步骤8通过在我们刚刚创建的线条下面添加第三个副本来完成侧格栅的高光,我们需要通过将宽度从8px 更改为4px 来调整这些矩形。然后,将其颜色更改为白色(#FFFFFF),并将混合模式设置为”变亮”,同时将其不透明度降至 60%。步骤9如果你已经到达了最后一步,这意味着你已经成功地完成了我们的小游戏机。现在我们要创建一个阴影,只需选择椭圆工具 (L) 并绘制一个 148 x 16 px 的椭圆,我们将使用较深的红色(#DD5252)着色,然后放在游戏机下方,距离它 12 px的位置就好了。原文地址:ENVATO TUTS+译文地址:UI中国作者:Andrei Stefan译者:米夏小雨
矩形 文本 形状 今天的教程,来自一个自学成才的矢量艺术家:Andrei Marius的分享!在这个教程中,我们将告诉大家,如何设置简单的网格,使用使用简单的矩形和变换效果。同样的我们也提供一个AI源文件供大家下载,以便学习与交流!点击下载AI源文件 提取码8owx一. 如何创建新文档并设置网格1. 首先,我们新建文档,宽度850px,高度900px,颜色模式RGB。2. 执行“视图”>“显示网格”“对齐网格”。3. 执行“编辑>首选项>参考线和网格>”。4. 设置网格线间隔为10px,次分隔线为1。5. 执行“编辑>首选项>单位”。6. 将单位都设置为像素。7. 执行“窗口”,勾选“信息”。二.如何创建彩虹背景8. 选择矩形工具,创建一个 850 x 150 像素的矩形,刚才我们勾选了信息,我们可以很方便的查看矩形的位置,选择填充并将其颜色设置为R = 255 G = 0 B = 0。有了网格与信息,将矩形对齐,将是一个非常简单的事情。9. 确保选中矩形,然后执行“效果>扭曲和变换>变换”。10. 将“ 移动 – 垂直”滑块拖动到150像素,在“ 副本”输入字段中输入5,然后单击“ 确定”。11. 确保仍然选中矩形,执行“对象>扩展外观”。12. 然后取消组合。13. 接下来,我们逐个选择矩形,并用下面显示的填充颜色替换现有的填充颜色。三. 如何创建文本效果框架14. 选择矩形工具,并创建一个380 x 440像素的形状。用白色填充这个新形状(R = 255 G = 255 B = 255)并将其放置如下所示。15. 选择路径选择工具,并选择白色矩形,执行“效果>风格化>圆角”。16. 在圆角半径选项中输入 10px。17. 选择矩形工具,并创建一个340 x 400像素的形状。用 R = 255 G = 0 B = 0 填充这个新矩形,将其不透明度降低到30%左右,并将其放置如下图所示。四. 如何创建和对齐文本效果18. 选择“文本工具”,添加我们的文本,颜色设置为黑色,效果如下所示。19. 选择文本,右键“创建轮廓”。20. 执行“对象>取消编组”。21. 下面,我们适当的为文本进行对齐。22. 选择红色矩形,然后将其删除。五. 如何样式化文本效果23. 执行“窗口”,勾选“路径查找器”,选择所有字母形状和白色形状,然后单击“ 分割”按钮。24. 逐个选择字母形状,并粗略地调整旋转,如下图所示。25. 选择所有白色形状,将它们转换为复合路径(对象>复合路径>建立)。26.复合路径建立完后,我们将其置于顶层。27.下面,选择住这些黑色文本形状,也给它们应用一个10像素的圆角。28. 不要取消这些黑色文本形状,然后执行“效果>风格化>阴影”。(这里的截图有问题,黑色文本已经是圆角了,我没有重新截图,见谅)29. 投影的参数设置,如下图所示。(这里的截图有问题,黑色文本已经是圆角了,我没有重新截图,见谅)30. 同样的,我们选择白色形状,也给它添加一个阴影。31.投影的参数设置,如下图所示。最终效果
图层 如下图 矩形 今天分享用Photoshop如何绘制一个实用的UI金属元素,效果很逼真,光影控制得非常好,步骤也不多,很容易学会。童鞋们抽空学一下吧。1.使用矩形工具与椭圆工具创建圆环的形体。2.现在到了神奇的一步,应用图层样式,如下图所示。我们得到这样的效果:3.现在我们将创建好的金属环图层复制一层,并删除如下图所示的矩形路径。我们得到这个:4.应用下面的图层样式:我们得到这个:5.现在我们将创建环的阴影。使用矩形和椭圆形工具来创建如图所示的形状。6.将图层转换为智能对象,应用高斯模糊,数值为5像素。现在,为了创建一个扩散的效果,创建一个蒙版,在如下图所示的开始点与结束点拉出一条径向渐变。降低该层的不透明度为60%最终效果如下图:完成咯~来源:radesign 译文地址:psdreamworks
矩形 设置为 颜色 本教程主要使用Illustrator绘制扁平化风格的快餐图标教程,教程的难度不大,新朋友可以快速的学习,希望大家可以喜欢。先来看看最终的效果图吧:具体的制作步骤如下:1.创建新文档和设置第1步按Cmd/Ctrl+N创建新文档。将单位设置为像素,大小设置为800 x 600px。在高级选项中,将色彩模式设置为RGB,分辨率设置为72ppi。在首选项(Cmd/Ctrl+K)中,在"键盘增量"中输入1px。单击确定。您可以转到窗口>信息,以预览形状的大小和位置。记住在首选项>单位中将单位设置为像素。这将帮助您更快地工作。2.绘制桌子我们首先来绘制桌子。第1步对于桌面,我们绘制一个440 x 20px的矩形(颜色:#EBBD63),并将描边设置为6px。具体参数如下图。第2步对于桌腿,我们绘制一个25 x 88px的矩形(颜色:#EBBD63),描边为6px。选择钢笔工具(P),并在下部添加锚点,使用直接选择工具(A)删除它。然后,使用直接选择工具(A)向上移动锚点,如下图所示。复制桌腿(Cmd/Ctrl+C> Cmd/Ctrl+F)并将其放在桌子的另一边。3.绘制饮料第1步绘制一个86 x 156px的矩形(颜色:#F04903),描边为6px。用直接选择工具(A),选择下方的锚点,将其向内移动10px,进行梯形化。现在在杯子的中间绘制一个44 x 44px的椭圆(颜色:#EFC206)。选择钢笔工具(P)并在杯子上绘制两个三角形(颜色:#FFFFFF)。绘制汉堡包,我们将通过制作汉堡的面包来开始绘制汉堡包,先绘制一个的矩形,在变换面板中为其上面两个角添加圆角。使用圆角矩形工具将一个140*13PX的矩形,添加到汉堡肉中。将高度设置为7PX,描边为6PX。然后,复制生菜,放在汉堡肉的下方。绘制炸薯条,现在我们绘制一些美味的炸薯条,首先,我们需要绘制一个102*94PX的矩形,搭边为6PX,并使用直接选择工具选择下方的锚点,将锚点向内移动8PX。添加炸薯条,绘制一个大小合适的矩形,并将描边设置为5PX,制作各种副本,旋转一些,并将它们放置在包装盒后面。我们来给它们一些明暗来使他们更立体。让我们从汉堡开始吧。选择面包的内部形状并复制两次。然后,向右移动第二个副本,稍微向右移动,然后选择减去顶层,填充颜色。现在我们来绘制面包上的芝麻,在顶部的汉堡包止添加十二个5PX的圆圈。对饮料杯重复相同的过程。对薯条包装盒也一样。现在是添加一些暗面的时候了,应用下图所示的填充颜色。最后的细节,我们现在要添加一些装饰,作为我们的插图的最后部分。绘制一个800*600PX的矩形,将矩形放在插图的最底层。
矩形 网格 字母 这种标志简约又能突出主题,2.5D效果显得比较有科技感,是多数新手设计师做标志设计的备选方案,今天我们就使用用AI制作2.5D风格的LOGO图标,希望大家可以喜欢。先看看效果图:那么下面就来讲讲一讲这种2.5D的标志该如何制作吧首先我们使用AI新建一个1280*720的画板双击“矩形网格工具”进入工具参数设置做如图设置在画板上按住“Shift”键拖动出一个正方形的网格按住“Shift+Alt”键向左拖动这个网格以复制它按“Ctrl+D”重复一次这个操作这样我们就获得了三个一样的网格选中这三个网格按键盘上的“Ctrl+5”就能快捷把他们变为参考线我们先来绘制第一个字母使用“矩形工具”沿着参考线绘制这样的矩形这里我们绘制的是一个字母C选中刚刚绘制的所有矩形在“路径查找器”中将他们“联集”然后为得到的字母C替换一个填色下面我们要制作B这个字母来到第二个网格先绘制一个这样的矩形接着在上方绘制一个这样的矩形使用“路径查找器”中的“减去顶层”这样就扣去了中间的部分这里我们切换成“直接选择工具”选中上下两个角点将这两个圆点向内拖动变为一个圆角
矩形 像素 将其 在今天的Illustrator教程中,我将带领大家学习如何使用Illustrator软件的一些基本几何形状和工具来创建复古风格的火车插图。希望朋友可以喜欢。先看看效果图设置新文档首先创建一个新文档(文件>新建或控制+ N),并进行以下设置:画板数量: 1宽度: 1200像素高度: 640像素单位:像素进入“ 高级”选项卡:色彩模式: RGB光栅效果:屏幕(72 ppi)设置图层创建好了新文档,接下来创建图层。打开“ 图层”面板,创建两个图层,将其命名如下:第1层>背景第2层>火车创建背景图标开始之前我们首先创建背景图层第1步选择矩形工具(M)创建一个1200x640 px矩形,使用#EA7B54进行着色,然后选择“ 对齐”面板的“ 水平”和“ 垂直对齐中心”选项,将其中心对齐到底层的“ 画板”。第2步创建一个808x16 px矩形作为铁轨,使用#434F59进行着色,然后定位距离画板底部边缘108 px的位置。第3步创建两个16x16 px圆圈(以绿色突出显示)并将它们放置在矩形的两边,然后使用路径查找器减去多余部分。第4步使用Shift + X键盘快捷键将生成的形状转换为轮廓,然后在“ 笔触”面板中将“ 笔触的权重”设置为8 px,将“ 角”设置为“ 圆形”。第5步创建17个8x8像素正方形(#434F59)作为铁轨上的小螺栓,将彼此间隔调整为36 px,将它们定位在轨道的下边缘。然后选择它们和铁路使用Control + G键盘快捷键将它们组合在一起。第6步完成了背景的绘制,我们可以锁定它的图层然后继续进行下一步开始构建火车的图层。创建火车底盘完成了铁轨的绘制,我们就可以开始绘制火车的底盘部分了。第1步创建火车底盘的主形状,首先建立508x16像素的矩形调整8像素的轮廓(#434F59),我们将其定位在距离铁轨左边缘84像素,上方88像素的位置。第2步创建两个相距4 px的4x4 px圆(#434F59)给火车底盘上添加第一对螺栓,我们将分组(Control + G),然后定位到底盘的左侧,如参考图像所示。第3步创建六组由两个4x4 px圆圈(#434F59)组成的螺栓,放置到参考图像中的位置。完成后,使用Control + G键盘快捷键选择并将所有螺栓和底盘组合在一起。创建火车头的后端一旦我们完成底盘的工作,我们就可以绘制火车头的后端了。第1步首先创建一个176x112像素的矩形,添加一个8 px的轮廓(#434F59),将定位它在底盘上方,距离其左边缘4 px。第2步创建24x48像素矩形(#434F59)放置在先前创建的形状的左侧,将两者的边缘对齐。第3步选择钢笔工具(P)创建一条”L”形状8 px的圆角线条(#434F59)。第4步创建8 px轮廓(#434F59)的64x120 px矩形作为棚顶支柱,调整到距离下部矩形左边缘40 px的位置。第5步创建一个160x24像素的矩形,使用#434F59进行着色,然后定位到参考图像中看到的位置。第6步创建168x8 px矩形(#434F59)添加水平的细节装饰,然后在其上方添加9个8x16像素的较小矩形(#434F59),将彼此间隔调整为8 px。完成所有形状后,使用Control + G键盘快捷键选择并分组,然后再继续下一步。第7步创建16x112 px矩形(#434F59)创建车厢阴影,将其与当前部分的右边缘对齐,然后使用直接选择工具(A)选择其左下锚点进行调整,使用“ 移动”工具向外移动16像素(右键单击>“变换”>“水平”> -16像素)。完成后,使用Control-G键盘快捷键选择所有形状组合在一起。第8步创建84x36像素大小8 px轮廓的矩形(#434F59)创建车厢上的小箱子,将其定位在火车车身上,距离车身左边缘20 px的位置。第9步创建一个较小的84x12像素、8 px的矩形(#434F59)放置到箱子的上半部分,将其放置到上一个形状的顶部,使它们的轮廓重叠。第10步花一些时间在箱子上添加一些细节,例如4x4 px螺栓(#434F59)和12x16 px锁(#434F59),使用参考图像作为参考。完成后,选择并分组(Control + G)所有的组成形状,然后再继续下一步。第11步创建较小的8x52 px矩形(#434F59)创建箱子阴影,选择左下锚点并向外推动8 px(右击>变换>移动>水平> -8来调整px)。完成后,将生成的形状放在箱子边框的左侧,选择并将两者组合在一起(Control + G),然后再转到下一步。创建火车的车厢一旦我们完成了火车后端的工作,我们可以向右移动几个像素开始创建舱室。第1步首先创建一个8 px轮廓(#434F59)136x232 px矩形,将其定位到机箱上,确保其左边缘与前一部分的右边缘重叠。第2步创建一个112x88像素的矩形(#434F59)添加窗口,将矩形堆叠在一个120x8像素(#434F59)的矩形上方,将两个矩形选择并进行分组(Control + G),然后定位在距离车舱中心16 px的位置。第3步创建8x28 px矩形作为门把手,使用#434F59进行着色,然后如参考图像中所示定位到车舱的左侧。