ps手机计算机图标教程,PS手机图标绘制教程:手绘时尚大方的扁平化风格手机APP图标。PS-站长资讯中心...

PS手机图标绘制教程:手绘时尚大方的扁平化风格手机APP图标。初稿

步骤 02 制作时钟底盘

2.1 新建540*540px的圆,命名为【圆-1】并为其添加图层样式。

26a8a97ba6d3ebd0d291f35db976b9cf.png

2.2 新建460*460px的圆,命名为【圆-2】并为其添加渐变叠加。

6f57af54447eef498c67f8948ab5b4df.png

2.3 新建442*442px的圆,命名为【圆-3】并为其添加图层样式。

d333069d881e013e431018e3bf812738.png

2.4 选中【底座】、【圆-1】、【圆-2】、【圆-3】 并使用移动工具—“垂直居中对齐”、“水平居中对齐”使其四者居中对齐。

324107668927aff1071f3daa45fe0fb6.png

步骤 03 制作时间刻度

3.1 用参考线定出图标的中心点。新建6*46px的矩形制作大刻度,放在指针12点处。并自由变化(快捷键Ctrl+T),

按Alt键将变换中心点调至图标中心,将矩形旋转90°并回车,然后一直按Ctrl+Shift+Alt+T键重复上一步,

直至做完大刻度。

3.2 新建4*24px的矩形制作中刻度,使用同样的方法将矩形旋转30°做出中刻度。

3.3 新建2*24px 的矩形制作小刻度,使用同样的方法将矩形旋转6°做出小刻度。

3.4 然后合并所有刻度图层,为其添加上渐变叠加。命名为【刻度】

95736accf6a6c6e15e370f5e84604cf0.png

bea2171b6fe621475acb2245c1f1cb7a.png

步骤四:制作指针

4.1使用形状工具绘制一个36*36px的圆和一个16*92px 左右上圆角半径为8px的矩形,填充色为#242424。

合并两个形状,并为其添加上斜面和浮雕,命名为【时针】

ac6c51ce0c8c50a09cd64c678dfe2267.png

63eb01ebedf43764ec8e393d67345d1d.png

4.2 使用形状工具绘制一个18*18px的圆和一个6*24px圆角半径为3px的圆角矩形,填充色为#f7f7f7。

分别命名为【时针装饰 -1】、【时针装饰 -2】

1bc612b04825e4f17c58d7fcf6fa2e81.png

4.3 新建12*174px左右上圆角半径为6px的矩形,填充色为#242424,并为其添加上斜面和浮雕,命名为【分针】

bc44922fba0d6de62db2317bb3fb52d0.png

4.4 新建4*230px的矩形,填充色为#ff5a5a,命名为【秒针】

4.5 选中【时针】、【时针装饰 -1】、【时针装饰 -2】,并Ctrl+T,按Alt键将变换中心点调至图标中心,将其调整至合适角度。

4.6 选中【分针】并Ctrl+T,按Alt键将变换中心点调至图标中心,将其调整至合适角度。

4.7 选中【秒针】并Ctrl+T,按Alt键将变换中心点调至图标中心,将其调整至合适角度。

4.8 选中【时针】、【分针】、【秒针】。按Ctrl+G进行编组,给这个编组添加投影。

fe9eb70b38e9f122a8f55f414e9aec3a.png

4.9 最后将时钟和底座进行编组(快捷键Ctrl+G),命名为【时间图标】

0bca667fa1d27e4edd78f6ee8e450c74.png

二、相机图标的制作

步骤 01 制作底座

1.1 将时间图标的底座复制一层(快捷键Ctrl+J),记得拖出时间图标的编组。

1.2 更改底座的渐变叠加。

5d7437b9ae42981479590aa15d5c5648.png

c8ef13a86a98a3293084baaf62d54f10.png

步骤 02 制作相机边框

2.1 新建520*520px的圆,命名为【外圆-1】并为其添加图层样式。

b4da162a6cecce767fd96b03d2ef471f.png

4a3b422c6143bc2c585e0d8c6b4d8367.png

2.2 新建 430*430px的圆,命名为【外圆-2】并为其添加渐变叠加。

8c0b6fa3b8e837e6fe1d48277b41bb1b.png

步骤 03 制作镜头

3.1 新建377*377px的圆,颜色填充为#484954 命名为【圆-1】并为其添加图层样式。

40d0572add8ca33b2e80115780445853.png

3.2 新建288*288px的圆,颜色填充为#484b59 命名为【圆-2】并为其添加图层样式。

596aad213e892e76c97f013c2edb5256.png

3.3 新建200*200px的圆,颜色填充为#3c3d49 命名为【圆-3】并为其添加图层样式。

8add6b7ae4fb666d56d21662c142f27c.png

3.4 新建110*110px的圆,颜色填充为#0f0f10 命名为【圆-4】

3.5 新建62.88*40.22px的椭圆,不透明度为70%,颜色填充为#ffffff ,添加蒙版,使用渐变工具拉出过渡。命名为【上光影】

3.6 新建27.62*15.10px的椭圆,不透明度为7%,颜色填充为#ffffff 命名为【下光影】

d4901a16c0748e355c1c9a06a0d704c7.png

3.7 新建377*377px的圆,填充为0% 为其添加渐变叠加,并在样式面板打开时,按住鼠标左键拖动改变渐变叠加的位置。

命名为【镜片阴影】

b921044b5a828853e8d9b4377d1d89ae.png

103d1051cd710bcef8b77112657495d9.png

3.8 新建 240*166px的椭圆颜色填充为#ffffff ,添加蒙版,使用渐变工具拉出过渡。命名为【镜片光影】

最后将镜头和底座进行编组(快捷键Ctrl+G)命名为【相机图标】

1c40e599d240ec7001abfa9f03e79498.png

三、天气图标

创作思路:使用两个圆和一个矩形拼凑出云的形状,并添加上图层样式来制造体积。

用一个圆来制作太阳,添加外发光来制作发光效果。

ddcaf602fa2c2faeab7276e07e2de1f8.png

四、电话图标

创作思路:使用钢笔工具勾出电话形状,并添加图层样式制作出体积感。

8c3be4be302df44e5d2be5c8467297c1.png

五、日历图标

创作思路:自由变换(快捷键Ctrl+T)右键扭曲做出日历翻页效果。

efa6cf085aeefbed3746d2bf6f4e0065.png

六、信息图标

创作思路:利用3个形状来拼凑出一个信封,使用转换角工具调整三角形,使他圆润。

并用蒙版擦出过渡效果。

6059360b139a64e966c7539e48cf031c.png

七、播放器图标

创作思路:选中矩形上方的两个锚点进行移动来制作平行四边形。

7bda93c1e4f701ba8bcf618a7b10d7cb.png

八、地图图标

创作思路:使用钢笔工具加布尔运算做标记,标记投影使用蒙版做出虚实变化。使用矩形工具拼出地图纹路并合成形状,利用剪贴蒙版

制作出地图。

bc96bde675add49a17630b028cc66eb7.png

九、通讯录图标

创作思路:利用1像素宽的矩形,添加角度为0°的斜面和浮雕做出凹槽效果。

0a87e338a69a6604e08708d77e6f4dff.png

十、音乐图标

创作思路:使用角度渐变和滤镜–径向模糊做出唱片的质感。

d2403c62057b123bc61234140d518ac1.png

十一、设置图标

创作思路:使用圆与圆之间的布尔运算做出形状。

c33be79bec17d75c702a2cf4eee53cc5.png

十二、搜索图标

创作思路:这里利用了两个内阴影制作了放大镜镜片的光影。

dfae65b2f4ef7e9c323068f9fd1744ff.png

十三、文件管理图标

创作思路:使用形状工具拼凑出形状。

e5143227605b715a7c1cbb272fec82aa.png

十四、图库图标

创作思路:使用形状工具拼凑出形状。

042a5ee7a999ccd06aa574c2a3fe482a.png

十五、游戏图标

创作思路:利用投影制造摇杆悬空效果。

9201553ce80f759a1870e13ffbf45384.png

十六、收音机图标

创作思路:利用渐变叠加做出天线的金属质感。

ade6dc00480ed867cc6ff11eda738665.png

十七、SIM卡应用图标

创作思路:使用圆角矩形–描边,做出有弧度的形状。

49594cfd29bfa9960e19aa5640a5fa63.png

十八、计算器图标

创作思路:利用内阴影和渐变叠加做出按钮下凹的弧度效果。

e10137398b9ecbad4a1bef42329697f5.png

十九、指南针图标

创作思路:给长矩形上方中间添加一个锚点,再减去上方两个角的锚点,制作出长三角形。

95e4d3c70a08728150c910e8e6c9c57a.png

二十、录音机图标

创作思路:使用形状工具拼凑出形状。

08a1cde41e333855a8b017d55c09fcd6.png

第一次制作教程 如有错误请多多包涵

最终效果

3ee29420e4f59e300e8bc5fa62b59639.png

原文链接:http://www.psahz.com/psshuhui/25166.html

如有疑问请与原作者联系

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com

特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值