当前位置: 首页 > 设计教程 > 网页设计教程 > Photoshop制作立体美观的网页徽章

Photoshop制作立体美观的网页徽章

Photoshop制作web2.0的徽章,这比我们之前介绍过的感觉更立体也更美观,这类徽章与标志你能经常在电子商务网站中看到,主要起到醒目与牵引浏览者视线的作用,喜欢这种效果图的朋友可以一起来学习了。

Photoshop制作立体美观的网页徽章

1. 在PS里新建文件

这里我使用 400 x 400 大小,背景为条纹蓝色

Photoshop制作立体美观的网页徽章

2. 制作徽章形状

使用PS里的多边形工具

Photoshop制作立体美观的网页徽章

在PS顶部设置如下,边数为30

Photoshop制作立体美观的网页徽章
Photoshop制作立体美观的网页徽章

颜色为#4fb2ea,完成后如下图:

Photoshop制作立体美观的网页徽章

3. 制作效果

我们要为徽章形状添加如下图层样式:外发光,内发光,渐变效果

完成后如图,你可以自己设置参数来实现类似效果!

Photoshop制作立体美观的网页徽章

4. 创建边框高光

点选形状图层,使其显示选中状态

Photoshop制作立体美观的网页徽章

Photoshop制作清爽绿色风格网页模板
Photoshop制作Web2.0高光质感彩色按钮