UI设计教程,iCloud图标设计教程(3)

来源:网络   作者:热心网友   发布时间:2016-08-26    浏览次数:68

3、搞定底板后,我们开始来做云,形状工具画四个正圆加一个矩形,大小自己把握,不过要注意的是要保持他们在同一个图层。命名为云层底,保持图层整洁。图层样式如下,数值仅供参考。

UI设计教程,教你设计一个iCloud图标

UI设计教程,教你设计一个iCloud图标

接下来我们要做的是云层中部,这里我的方法比较笨,我是把底层的每个圆缩小二十像素,尝试过直接自由变换缩小,但是效果很差,每个圆衔接的地方对不上,所以用笨的方法,有知道简便方法的同学还请告诉我。中层就不用加图层样式了,填充颜色为e9e9e9就行了。

UI设计教程,教你设计一个iCloud图标顶层的方法也是一样,中层基础上再缩小10像素即可,添加内阴影和投影。

UI设计教程,教你设计一个iCloud图标

UI设计教程,教你设计一个iCloud图标

UI设计教程,教你设计一个iCloud图标

其实做到这里就差不多结束了,还有最后一步就是给云层底部加个反光,也是布尔运算减去顶层再羽化。

UI设计教程,教你设计一个iCloud图标

最后给大家分享一下源文件:PSD参考文件链接:http://pan.baidu.com/s/1DBJem 密码:9djs

本教程完!

123共3页
联盟广告
×

感觉还不错,那就赞助一下吧!您的鼓励就是我们坚持的动力!

打赏说明:您的赞助我们将用于购买网络带宽和优质设计资源,提升用户体验!

相关推荐

http://www.shejixf.com/shejijiaocheng/uisheji/4788.html
×

一键快速登录后才能下载本站资源

新会员登录即可获取5学币奖励,超爽下载!

×

一键快速登录后才能下载本站资源

新会员登录即可获取5学币奖励,超爽下载!

×

充值学币 立即开通