创建一组精美的足球图标


建立新文档

我们首先建立一个新文档(文件>新建或控制-N),进行以下调整:

画板数量: 4

版面设置:从右向左

间距: 64像素

宽度: 128像素

高度: 128像素

单位:像素

高级”选项:

色彩模式: RGB

光栅效果:屏幕(72 ppi)

设置图层

一旦我们建立了新文档,接下来我们则需要设置几个图层,以便将参考网格与图标分开,这将有助于我们简化工作流程。

打开“ 图层”面板,创建两个图层,将其命名:

第1层>参考网格

第2层>图标


创建参考网格

接来下开始创建参考网格,这将有助于我们对齐图标和调整图标大小。

第1步

选择矩形工具(M)创建一个128x128像素的正方形,使用#F15A24进行着色,然后使用“ 对齐”面板的“ 水平和垂直对齐中心”选项定位到第一个画板的中心。

第2步

创建另一个较小的120x120像素正方形(#FFFFFF),将其定位到前一个形状的中心,用作我们的绘图区域,提供4像素的轮廓。

第3步

使用Control + G键盘快捷键选择两个形状并将它们组合在一起,然后创建它们的副本(Control + C)添加到剪贴板,然后我们使用(Control + F)粘贴到每个剩余的画板上。组合并锁定背景图层,进行下一步操作。


创建足球鞋图标

定位到第一个画板选择第一图层,我们开始创建足球鞋图标。

第1步

选择椭圆工具(L),然后使用120x120 px的圆创建背景,使用#5FB3FF对其进行着色,然后定位到底层画板的中心。

第2步

接下来的创建一个112x12像素的矩形,使用#FFFFFF进行着色然后放在位置绘图区域底边40像素的位置。

第3步

选择“ 变换”面板的“ 矩形属性”中将其底角的半径设置为8 px,调整我们刚刚创建的矩形的形状。

第4步

使用描边方法为形状赋予轮廓,然后创建它的副本(Control + C),粘贴在图形前面(Control + F),将其颜色更改为#19649B进行调整。使用填色(Shift + X)填充颜色,将生成的形状的权重设置为8 px,将角设置为圆形。

第5步

使用12 px高8 px宽的画笔(#19649B)绘制垂直线条,放置在位于距离鞋底左边缘24 px的位置,使用Control +G选择并将所有三个形状组合在一起。

第6步

创建一个8x10像素的矩形(#19649B)开始处理鞋底的锯齿,使用直接选择工具(A)单独选择其底部锚点进行调整,然后使用箭头键或移动工具(右键单击>变换>移动>水平>±2 px将其推入内部方向2像素的距离(具体取决于你从哪一侧开始)。将生成的形状添加为4 px的轮廓(#19649B),分组(Control + G),然后将绘制的图形定位在鞋底的底部边缘上,距离左锚点4像素的位置。

第7步

给刚刚创建的图形添加四个副本(Control + C> Control + F四次),将他们放置在参考图像中看到的位置。创建完成时,不要忘记选择并分组(Control + G)当前创建的形状,然后再继续下一步。

第8步

创建一个112x36 px的矩形开始绘制靴子的上部分,使用#9FDFFF进行着色,然后将其放置在鞋底的顶部边缘上方。

第9步

使用添加锚点工具(+)给刚刚创建的形状添加几个新锚点,通过使用直接选择工具(A)单击并拖动它们调整到它们在参考图像中看到的位置。

第10步

调整其底部和右侧脚踝的锚点使用平滑选项进行调整,然后重新选择锚点的把手,进行调整,直到你得到一个不错的弧度。

第11步

给刚刚创建的形状添加副本(Control + C> Control + F)添加内部的高光,将其与内部对齐的并添加8 px的轮廓(#FFFFFF)。

第12步

选择并将其底部锚点向下推进4 px(右键单击>)来调整其高度。(变换>移动>垂直> 4像素)。

第13步

使用20x16 px矩形(#FFFFFF)添加鞋子的脚跟,将其左上角的半径设置为“ 变换”面板的“ 矩形属性”中的16 px。为生成的形状添加8 px的轮廓(#19649B),给图形进行分组(Control + G),然后将两者放在上部填充形状的右下角。

第14步

创建三条24 px宽36 px高的斜线(#19649B)绘制阿迪达斯鞋子的线条,彼此间隔16 px,进行分组(Control + G)然后定位在如参考图像所示的位置。


第15步

创建一个32x16 px的矩形(#19649B)添加脚趾部分的侧面部分,我们将对齐到鞋子上部分的左下角,然后通过重新定位其右上方的锚点,使其最终与第一个条纹平行。

第16步

创建4x4 px的圆创建鞋带孔眼,使用#19649B进行着色,然后定位到参考图像中高光的上部。

第17步

靴子的上半部分完成以后我们就可以进行分组(Control + G)了,我们选择前面粘贴底层填充形状的副本(Control + C)来掩盖它们(Control + F)然后选择副本和组,右键单击>制作剪贴蒙版。

第18步

接下来给靴子的上部添加8 px粗轮廓(#19649B)完成图标,选择所有完成的图形并进行分组(Control + G),然后对整个图标执行相同操作。


创建足球场图标

一旦我们完成了第一个图标的处理,我们就可以跳到下一个画板,我们将逐步在该区域创建足球场图标。

第1步

首先使用120x120 px的圆创建背景,使用#5FB3FF对其进行着色,然后将中心对齐到底层的画板。

第2步

接下来创建一个56x64 px矩形(#9FDFFF)开始处理足球场的左半部分,给矩形创建8 px的内部高光(#FFFFFF)和8 px的轮廓(#19649B),我们将绘制的图形进行分组(Control + G)然后居中对齐到绘图区域的左边缘。

第3步

创建一个8 px轮廓(#19649B)12x24像素的矩形(#FFFFFF),将其进行分组(Control + G),然后将中心对齐到上一步骤形状的左边缘。

第4步

创建12x16 px的矩形(#FFFFFF),将其右角的半径设置为8 px进行调整,将图形定位在上一步创建图形的下方(右键单击>排列>向下一层移动) 。完成后,选择刚刚创建的图形并进行组合(Control + G)。

第5步

给我们刚刚完成图形创建副本(Control + C> Control + F)移动到右半部分,给图形做垂直反射(右键单击>变换>反射>垂直),然后定位到绘图区域的另一侧。

第6步

创建24x24 px的圆(#FFFFFF)创建8 px的轮廓(#19649B)给圆形的中间添加一个24 px高8 px宽的直线(#19649B),使用Control + G键盘快捷键将三个图形组合在一起。

第7步

完成图标,创建几个4x4 px圆圈(#19649B)作为球员,调整到参考图像中看到的阵型或您自己选择的阵型进行定位,选择所有图形并进行分组(Control + G)。


创建裁判口哨图标

一旦我们完成了第二个图标的处理,我们就可以转到相邻的画板,创建裁判哨子。

第1步

创建120x120 px的圆圈添加背景,使用#5FB3FF对其进行着色,然后将中心对齐到下面的活动绘图区域。

第2步

使用64x64 px圆圈为哨子的圆形部分创建主要形状,我们将使用#9FDFFF进行着色,然后将其定位在距活动绘图区域左边缘中心16 px的位置。

第3步

使用添加锚点工具(+)在圆形的右上部分添加新锚点来,然后使用直接选择工具(A)择顶部锚点并删除它(Delete)。

第4步

选择钢笔工具(P),创建参考图像中的形状。

第5步

使用“ 实时角”工具将其内侧角的半径设置为8 px,然后使用“ 移动”工具选择并将其右侧部分的底部锚点向内推动4 px的距离来调整生成的路径(右侧单击>变换>移动>水平> -4 px)。

第6步

给我们刚刚创建的图形添加8 px的内部高光(#FFFFFF)和8 px的轮廓(#19649B),在移动之前选择并将它们组合在一起(Control + G)进行下一步。

第7步

创建16x16像素的圆(#FFFFFF)添加哨子的装饰,在其上方我们再添加一个较小的8x8像素(#19649B)圆,将其分组(Control + G)然后定位到哨子圆形的中心部分。

第8步

创建20x4 px矩形(#19649B)创建哨子上方的小口,通过选择并将其左下锚点向内推动4 px(右键单击>变换>移动>水平> 4 px)进行调整。为生成的形状创建8 px的轮廓(#19649B),给图形进行分组(Control + G),然后将两个定位在参考图像中的位置。

第9步

使用8x4 px矩形(#19649B)和8 px粗轮廓(#19649B)添加凸起部分,将它们分组(Control + G)然后定位在喙顶部。

第10步

创建12x12 px和8 px轮廓的圆(#19649B)添加哨子底部的小圆,将其定位在哨子圆形部分的前端。完成后,选择并将所有组成形状组合(Control + G)在一起,然后对整个图标执行相同操作。


创建扩音器图标

接下来我们跳转到最后一个画板,开始进行扬声器的绘制。

第1步

首先创建120x120像素的圆作为背景,使用#5FB3FF对其进行着色,然后将中心对齐到下面的绘图区域。

第2步

使用112x64 px矩形为扩音器创建主要形状,使用#9FDFFF进行着色,然后将中心对齐到底层画板。

第3步

选择并将左锚点向内推动20 px的距离来调整我们刚刚创建的矩形的形状(右键单击>变换>移动>垂直>±20像素,具体取决于从哪一侧开始)。

第4步

将生成的形状赋予8 px内部高光(#FFFFFF),完成之后,继续进行下一步。

第5步

创建四条44 px宽64 px高的直线(#19649B)为扬声器添加细节,将彼此的间隔调整为24 px,给完成的图形进行分组(Control + G),然后将它们居中对齐到底层画板。

第6步

创建一个88x64像素的矩形并添加8 px的轮廓(#19649B)放置在下图所示的位置,创建它的副本(Control + C> Control + F)来屏蔽对角线细节(选择副本形状>右侧单击>制作剪贴蒙版)。完成后,选择蒙版形状和矩形,并使用Control + G键盘快捷键将它们组合在一起。

第7步

使用填充形状的副本(Control + C> Control + F)遮住我们刚刚创建的形状,添加8 px的轮廓,然后再继续下一步。

第8步

创建32像素和72像素高同样宽8像素的直线(#19649B)分别放置在圆形的后部和前部。完成后,使用Control + G键盘快捷键选择并分组刚刚创建的形状。

第9步

完成图标,创建24x24 px和8 px轮廓的圆(#19649B),将其放置在扬声器的后面(右键单击>排列>向后排列),如参考中所示图像。完成图形以后,将所有图形选择并组合(Control + G)在一起。

完成

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 199,175评论 5 466
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 83,674评论 2 376
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 146,151评论 0 328
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 53,597评论 1 269
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 62,505评论 5 359
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 47,969评论 1 275
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,455评论 3 390
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,118评论 0 254
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,227评论 1 294
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,213评论 2 317
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,214评论 1 328
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,928评论 3 316
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,512评论 3 302
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,616评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,848评论 1 255
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,228评论 2 344
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 41,772评论 2 339

推荐阅读更多精彩内容