ps教程论坛

 找回密码
 注册

QQ登录

只需一步,快速开始

查看: 3500|回复: 11
收起左侧

[UI设计] Photoshop设计唱片机图标教程

[复制链接]
发表于 2014-1-24 01:50:19 | 显示全部楼层 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有账号?注册

x
      本文将简略的陈述这款图标的设计思路,如何让图标显得栩栩如生,大家在放假的时候,来杯咖啡,慢慢的按照作者步骤来一发吧,难度有的,主要是掌握思路哦。
先看看效果图


提示:教程详细步骤在二楼
想下载该教程的请回复获取下载网址:
游客,如果您要查看本帖隐藏内容请回复
教程编号:132641 作者:佚名 出处:优设
 楼主| 发表于 2014-1-24 01:50:21 | 显示全部楼层

Photoshop设计唱片机图标教程


步骤01



首先用草图勾勒出大体理念。这里我画出了黑胶,然后添加了按钮、唱针等元素。为了让草图看起来更有立体感(而不使用透视法),因此,我添加了圆角矩形,让图标看起来像是打开的盒子一般。
回复 支持 反对

使用道具 举报

 楼主| 发表于 2014-1-24 01:50:22 | 显示全部楼层

Photoshop设计唱片机图标教程


步骤02



扫描草图,导入到PS中。选择渐变工具,填充背景从深色到浅色。下一步,花一个512×512的圆角矩形,半径90px。按住Alt,选择形状,创建新图层组,命名为“Icon”,现在为该图层组添加蒙版
回复 支持 反对

使用道具 举报

 楼主| 发表于 2014-1-24 01:50:23 | 显示全部楼层

Photoshop设计唱片机图标教程


步骤03



色彩选择非常重要。颜色一定要细腻,黑胶使用了深棕色,按钮使用了亮棕色。
回复 支持 反对

使用道具 举报

 楼主| 发表于 2014-1-24 01:50:24 | 显示全部楼层

Photoshop设计唱片机图标教程


步骤04



利用图层样式,我们可以添加很多有趣的效果。黑胶部分添加了线性渐变叠加,混合模式为色彩简单,还加入了一点杂色渐变。复制图层后,改变渐变模式为纯色渐变,这样能增添一种光反射效果。
回复 支持 反对

使用道具 举报

 楼主| 发表于 2014-1-24 01:50:25 | 显示全部楼层

Photoshop设计唱片机图标教程

        
步骤05



?
现在需要添加一些阴影,可以通过色彩或者线性加深的混合模式。给旋钮以及唱针加入光反射以及投影。
回复 支持 反对

使用道具 举报

 楼主| 发表于 2014-1-24 01:50:26 | 显示全部楼层

Photoshop设计唱片机图标教程


步骤06



为了更逼真的阴影效果,在黑胶上方画一个灰色矩形,加入外发光效果,混合模式为线性加深,然后调节不透明度。
回复 支持 反对

使用道具 举报

 楼主| 发表于 2014-1-24 01:50:27 | 显示全部楼层

Photoshop设计唱片机图标教程


步骤07



材质也很重要,适度改变材质的饱和度。然后为图层添加蒙版,混合模式为叠加。
回复 支持 反对

使用道具 举报

 楼主| 发表于 2014-1-24 01:50:28 | 显示全部楼层

Photoshop设计唱片机图标教程


步骤08



注意工作图层有序排布。
回复 支持 反对

使用道具 举报

 楼主| 发表于 2014-1-24 01:50:29 | 显示全部楼层

Photoshop设计唱片机图标教程


步骤09



现在可以对图层样式进行详细修改,直到满意为止。
回复 支持 反对

使用道具 举报

 楼主| 发表于 2014-1-24 01:50:30 | 显示全部楼层

Photoshop设计唱片机图标教程


步骤10



创建新图层,至于顶部,加入内发光和光泽。通过光泽效果,让整体图标显示同一种色调。
?
  
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 注册

本版积分规则

求建议和反映问题|小黑屋|免责声名|Archiver|photoshop教程论坛 ( 粤ICP备07017357号 )

GMT+8, 2024-4-28 01:42 , Processed in 0.056808 second(s), 11 queries , XCache On.

Powered by Discuz! X3.4

© 2001-2023 Discuz! Team.

快速回复 返回顶部 返回列表