9core.com - 九核技术交流网

九百链
为了更好的解决实际工作中遇到的问题,本站开设了QQ群 ASP+PHP+JSP+.NET①:9793624
ASP+PHP+JSP+.NET②:17775294
网站通告: 新开设QQ群,群号:17775294 九核WEB技术专业论坛 官方QQ群 9793624
搜索: 您的位置主页> 设计创意 > 网页设计 >阅读资讯: Fireworks教程:打造精美显示器图标

Fireworks教程:打造精美显示器图标

文章来源:蓝色理想 发表时间:2008-08-10 点击次数

 效果图兼源文件

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

 

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

一、绘制一个矩形,并通过部分选定工具调节节点

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

增加立体效果,每个角均通过钢笔工具增加为2个节点

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

 

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

二、给矩形添加渐变效果

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

 

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

三、给矩形添加渐变效果

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

四、复制矩形并缩小,作为内框屏幕,使用放射性渐变,添加内容阴影 

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

 

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

五、制作屏幕高光效果,绘制一个圆形,设置线性渐变,羽化为6

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

 

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

六、再画一个大的椭圆,用切掉我们不需要的部分。

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

选择两个路径,修改——组合路径——打孔

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

 七、得到如下路径,然后使用蒙板得到我们需要的内框屏幕,选择蓝色内框屏幕,复制,选择刚才得到的白色渐变路径,反键——编辑——粘贴为蒙板,得到如下效果

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

 

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

八、绘制两条斜线,制作屏幕下方立体效果 

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

 

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

九、使用上述高光绘制方式制作屏幕下方高光效果

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

十、使用放射性渐变绘制显示器开关按钮,并复制一个浅灰色的圆形放在按钮下,产生立体效果 

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

 

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

十一、利用矩形工具绘制底座支撑轴。并使用线性渐变填充

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

 

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

十二、利用矩形工具绘制底座,使用钢笔工具增加节点并调整。使用放射性渐变填充

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

 

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

十三、利用矩形工具绘制高3像素的矩形使用放射性渐变填充,绘制底座高光效果

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB

 

LNCzDTuiJguOYxE2IWoiZ2C1RCSn8Hzz5c5uoybB
网页设计
关于我们 - 联系我们 - 广告服务 - 友情链接 - 网站地图 - 版权声明 - 人才招聘 - 帮助