Photoshop制作一个清爽的圆角方形下载图标

社区服务
高级搜索
猴岛论坛贴图&拍客PS技术交流Photoshop制作一个清爽的圆角方形下载图标
发帖 回复
倒序阅读 最近浏览的帖子最近浏览的版块
6个回复

[问题求助]Photoshop制作一个清爽的圆角方形下载图标

楼层直达
未来v丶

ZxID:23375248

等级: 元老
清静-要么忍,要么残忍

举报 只看楼主 使用道具 楼主   发表于: 2014-06-20 0
Photoshop制作一个清爽的圆角方形下载图标
[table=100%,#4f6128,#4f6128,1][tr][td]



[align=center]

[table=80%,#ffffff,#dddddd,1][tr][td]
[align=center][size=4][b]
[/b][/size][/align][b][/b][align=center][b][size=4]作者制作图标的思路非常不错。过程:先用形状工具把图标分层做出来,可填充初步的颜色,然后分别加上图层样式做出质感及立体感即可。[/size][/b][/align][size=4][/size][align=center][b][size=4]最终效果[/size][/b][/align][align=center][b][size=4][img]http://s1.houdao.com/11884/photo/Mon_1406/133742_08c9140324652582293cd001e6203.png[/img][/size][/b][/align][align=center][b][size=4]1、新建大小自定的画布。选择圆角矩形工具创建一个120 * 120像素的形状置于画布正中央,圆角尺寸20像素,色值#78c549,命名为“底板”。[/size][/b][/align][align=center]
[/align][align=center][b][size=4]Ctrl + J 复制底板层,改变色值为#378404,命名为厚度,Ctrl + [将此层置于底板层的下面。 [/size][/b][/align][align=center]
[/align][align=center][b][size=4]按下A键用直接选择工具选中底板层下面圆角的4个锚点,上移3个像素,露出厚度层。[/size][/b][/align][align=center]
[/align][align=center][b][size=4]同样用直接选择工具选中厚度层上面圆角的4个锚点,下移3个像素,防止两层圆角边缘像素叠加造成锯齿感。[/size][/b][/align][align=center][b][size=4][img]http://s1.houdao.com/11884/photo/Mon_1406/133742_02b614032465264e512e006fe0999.png[/img][/size][/b][/align][align=center][b][size=4]2、新建一层,命名为进度条背景,选择椭圆工具,按住Shift键画出一个90 * 90像素的正圆,与底板层居中对齐,色值为纯黑色。[/size][/b][/align][align=center]
[/align][align=center][b][size=4]用路径选择工具选中进度条背景的路径,复制粘贴后Ctrl + T ,将粘贴得到的路径缩小到70* 70像素,并将属性改为减去顶层形状,这样就做出一个圆环。[/size][/b][/align][align=center][b][size=4][img]http://s1.houdao.com/11884/photo/Mon_1406/133742_faef14032465269358a980796addc.png[/img][/size][/b][/align][align=center][b][size=4]3、Ctrl + J 复制进度条背景层,色值改为#ffd200,将外圈的路径缩小为86 * 86像素,内圈的路径扩大到74 * 74像素,命名为进度条。[/size][/b][/align][align=center]
[/align][align=center][b][size=4]画一个矩形路径,将进度条减去1/4,并用两个圆形路径补上断掉的两头。[/size][/b][/align][align=center][b][size=4][img]http://s1.houdao.com/11884/photo/Mon_1406/133742_840814032465262c74ab4558df83e.png[/img][/size][/b][/align][align=center][b][size=4]4、下面开始画箭头,首先用矩形工具画一个40 * 40像素的矩形,接着用钢笔工具画一个28 * 16像素的三角形,并将这两个形状的路径放在一个图层里。[/size][/b][/align][align=center]
[/align][align=center][b][size=4][img]http://s1.houdao.com/11884/photo/Mon_1406/133742_fb1d1403246527d1421e3d86d08af.png[/img][/size][/b][/align][align=center][b][size=4]5、好了,框架我们全搭好了,该给样式了。如果对路径的操作还不是太熟悉的话,可以去看看相关的教程。[/size][/b][/align][align=center]
[/align][align=center][b][size=4][img]http://s1.houdao.com/11884/photo/Mon_1406/133742_26711403246527ddb75fb76d4d78f.png[/img][/size][/b][/align][align=center][b][size=4][img]http://s1.houdao.com/11884/photo/Mon_1406/133742_991d14032465274242eee66598c7c.png[/img][/size][/b][/align][align=center][b][size=4][img]http://s1.houdao.com/11884/photo/Mon_1406/133742_6f491403246528f45ba947b439814.png[/img][/size][/b][/align][align=center][b][size=4][img]http://s1.houdao.com/11884/photo/Mon_1406/133742_428914032465332bec8b5715169a8.png[/img][/size][/b][/align][align=center][b][size=4]最终效果:[/size][/b][/align][align=center][b][size=4][img]http://s1.houdao.com/11884/photo/Mon_1406/133742_88a71403246533da20e5f861ee003.png[/img][/size][/b][/align][align=center]
[/align][/td][/tr][/table][/align]


[/td][/tr][/table]
本帖de评分: 1 条评分 DB +88
DB+88 2014-06-20

ps板块有你更精彩

素质待人
冷静处事
只是我太懒

ZxID:18729361

等级: 元老
举报 只看该作者 沙发   发表于: 2014-06-20 0
当手机图标还是不错的~
  饭叔   

ZxID:27487931

等级: 元老
配偶: 饭饭 

举报 只看该作者 板凳   发表于: 2014-06-20 0
感谢分享
或许只有在离得最远的时候,

才能把曾经走过的那段日子,看得最真确最真切。

思念总是有不得不收藏起来的时刻,

而生命里最舍不得,藏得总是最深,且不让人知道。
猴岛论坛-旧亿

ZxID:18148156

等级: 上将
の -  我的身边有你们陪着我ޓ ,拒绝暧昧ޓ

举报 只看该作者 地板   发表于: 2014-06-20 0
  灰常赞。
↑网络爷↓

ZxID:15724224

等级: 大将
  库迪西瓦,他大姨妈   

举报 只看该作者 4楼  发表于: 2014-06-20 0
  不错
白魅止

ZxID:27094389

等级: 版主
生平所历之人,非身死,太难忘啊。

举报 只看该作者 5楼  发表于: 2014-06-20 0
不错,谢谢分享

际遇之神

奖励

無瑕在大街上捡到3DB  飞快的跑回家躲着.

边望之

ZxID:36360885

等级: 大将
@基佬欧巴@             &n ..

举报 只看该作者 6楼  发表于: 2014-06-20 0
教程不错

虽说没看太明白
« 返回列表
发帖 回复