Photoshop教程:Buttons(按钮)的UI设计

哈里灬亮

哈里灬亮

2016-01-29 16:20

Photoshop教程:Buttons(按钮)的UI设计,利用图层样式创建美观大方的按钮

1.渐变背景

文件新建,尺寸为800X600像素,72分辨率的文件在颜色面板,设置前景色值#eceff6,背景色值#bec1cc

图像新建填充图层渐变(确定)下拉找到刚才设置的颜色勾上(反向-仿色-与图层对齐)

2.创建和调整圆

用形状工具画3个圆,选择3个圆的图层,回到选择工具然后如下图点击红色部分对齐

123Buttons(按钮)的UI设计23.样式回到图层面板双击其中一个圆设置图层样式如下:·斜面浮雕·内阴影·渐变叠加·外发光·阴影

窗口样式新建样式确定

设置另外2个圆的只要点击保存的刚才保存的样式就可以了(如上图)。

  123Buttons(按钮)的UI设计3

4.创建真实阴影

复制一个圆,删除样式(拉到垃圾桶),CTRL+T缩小,填充颜色如下

滤镜模糊动感模糊

(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/ps/)用矩形框选工具删除多余部分,把图层放在圆的底层,透明度设置在25%-75%

5.斜面和浮雕

(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/ps/)

这是一个很简单的步骤,只需要一分钟。创建了一个更大的圈,重复刚才的步骤,

其中斜面浮雕和阴影设置如下。

现在你明白了图层样式的应用了,然后往里面增加播放按钮或者你喜欢图形。(附PSD下载)

  123
展开更多 50%)
分享

猜你喜欢

Photoshop教程:Buttons(按钮)的UI设计

PS PS教程
Photoshop教程:Buttons(按钮)的UI设计

Photoshop设计颓废质感的网页UI滑动按钮

PS PS基础
Photoshop设计颓废质感的网页UI滑动按钮

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

按钮UI设计方法和技巧

平面设计 海报设计 广告设计 画报设计 签名设计 服装设计 名片设计 画册设计 版式设计 商标设计
按钮UI设计方法和技巧

Photoshop制作立体效果的UI开关按钮

电脑网络
Photoshop制作立体效果的UI开关按钮

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

Photoshop设计胖嘟嘟的铅笔UI图标教程

PS PS基础
Photoshop设计胖嘟嘟的铅笔UI图标教程

Photoshop设计白色立体效果的开关按钮教程

PS PS基础 ps平面设计教程 ps去水印教程
Photoshop设计白色立体效果的开关按钮教程

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

七点措施 组建家庭无线网络小技巧

七点措施 组建家庭无线网络小技巧

《超级马里奥银河》流程攻略

《超级马里奥银河》流程攻略
下拉加载更多内容 ↓