时钟图标作品,又是一次进步
很想学图标设计,看着前辈们设计的图标非常的漂亮,自己也临摹了一个,附上作品和大概的设计思路:
具体的设计步骤如下:
1.新建一个大小为283 x 152像素的文档,然后选择“椭圆工具”画一个正圆,填充浅灰色,色值为“f1f1f1",将这个图层命名为“灰色正圆”。
2.使用椭圆工具再画一个正圆,这次使用的填充颜色是蓝色,色值为”3f84e2"。同样的,将这个图层也进行命名,命名为蓝色正圆。
3.现在我们载入图层2(就是那个蓝色正圆的图层)选区(具体方法是按住CTRL键点击需要载入选区的图层),然后在顶部菜单里点“选择”=>“修改”=>“收缩”,收缩量为1像素。
4.在载入选区的状态下回到最初创建的那个图层,就是“灰色正圆”那个啦,在主菜单上点“图层”--“栅格化”--“形状”。下一步到编辑菜单,最后选择“清除”,以消除中间部分的灰色圆。现在可以取消选区啦(快捷键CTRL+D),把之前的那个“蓝色正圆”的图层拖到“灰色图层”的下面。
5.现在双击“灰色正圆”图层,开始设置图层样式,首先是“内发光”:正常、35%、0%、#000、柔和、边缘、0%、4px、其他参数不变。
6.继续设计图层样式,选择“斜面和浮雕”,参数为:内斜面、平滑、100%、上、2px、0px、113度、使用全局光、30度、滤色、100%、正片叠底、21%。
7.设置“渐变叠加”,参数为:正常、85%、#747474-#c6c7c7-#ffffff-#ffffff、线性、与图层对齐、90度、100%。
8.现在来给“蓝色正圆”设置图层样式,依然是双击图层弹出图层样式设置,我们先来设置“内阴影”。参数为:颜色减淡、#008aff、100%、-11度、其他参数不变。
9.现在设置“光泽”,参数为:颜色减淡、#0d619c、59%、19度、3px、3px、其他参数不变。
10.这里又要设置“渐变叠加”了哦,参数为:正常、80%、#20a7ed-#042b3a、径向、90度、100%。
11.现在选择“圆角矩形工具”画一个半径为3像素的圆角矩形,颜色色值为“3f84e2",命名这个图层为“铃”。这个图层就是时钟顶部的两个小耳朵的雏形啦,所以大小大家要自己衡量一下哦~
12.现在我们要给这个“铃”的图层设置图层样式啦~,首先设置“投影”,参数为:正片叠底、#000、73%、113度、0px、0%、1px、其他参数不变。
13.现在设置一下“内阴影”,参数为颜色减淡、#008aff、-11度、1px、0%、0px、其他参数不变。
14.继续图层样式的设置,现在是“内发光”,参数为:正常、36%、0%、#000、柔和、边缘、0%、2px、50%、0%。
15.现在点击“光泽”来继续设置,参数为:颜色减淡、#0d619c、59%、19度、3px、3px、其他参数不变。
16.设置“渐变叠加”,参数为:正常、78%、#20a7ed-#042b3a、线性、-45度、100%。
17.正如你所见,我们的时钟通常都有两个“铃”的,并且是都有所倾斜的在时钟顶部。那么,我们现在回到“铃”那个图层,从主菜单上选择“编辑”--“自由变换”(其实这里CTRL+T就可以)。然后呢,按住Shift键旋转这个层,直到你看到面板上(就是最顶部那一行的),显示角度为“-30度”。复制“铃”这个图层,CTRL+T,单击右键,选择“水平翻转”。将水平翻转过后的“铃”和之前的“铃”移动到合适的位置,当然,这两个层需要在“灰色正圆”的图层之下哦~
18.选择“椭圆工具”,画一个比较扁一些的椭圆,颜色使用色值为“3f84e2",将这个图层命名为“时钟腿”,这个图层是要放在“灰色正圆图层”下面的哦~,然后我们需要调整这个“时钟腿”的锚点,使最初的椭圆形状变为时钟腿的模样。
19.现在来对“时钟腿”设置图层样式,先设置“投影”,参数为:正常、#000、73%、113度、0px、0%、1px、其他参数不变。
20.现在点击“内阴影”进行设置,参数为:颜色减淡、#008aff、100%、-11度、1px、0%、0px、其他参数不变。
21.点击“内发光”,参数为:正常、36%、0%、#000、柔和、边缘、0%、2px、其他参数不变。
22.现在设置“光泽”,参数为:颜色减淡、#0d619c、59%、19度、3px、3px、其他参数不变。
23.现在使用“钢笔工具”把时钟的表针画出来,对于不太熟悉钢笔工具的人,可以使用表针形状。做完表针以后,记得把表针放到时钟的中心位置,然后加上一个图层样式“投影”,参数为:角度:113,距离:1,大小:2
24.现在选择“椭圆工具”,用黑色画一个扁扁的椭圆,命名这个图层为“时钟投影”,把这个层放到所有图层的下面。(它可是时钟的投影耶,大家画的时候注意大小哦)
25.现在双击“时钟投影”图层设置图层样式,混合选项(默认):正常、28%、其他参数不变。
26.点击“外发光”,参数为:正常、100%、0%、#000、柔和、0%、9px、其他参数不变。
27.大家最后可以对自己的图图进行一定调整,比如阴影部分的透明度啦,模糊啦,还有高光什么的,这里就不细说了。