Photoshop设计动漫游戏网站模板(8)

admin 1 0

新建950 x 1160 大小文件,填充背景颜色#161616,使用矩形工具制作宽900、高190的矩形,并添加如下图层样式

Photoshop设计动漫游戏网站模板(8)-第1张图片-快备云

Photoshop设计动漫游戏网站模板(8)-第2张图片-快备云

Photoshop设计动漫游戏网站模板(8)-第3张图片-快备云

完成后的矩形效果

Photoshop设计动漫游戏网站模板(8)-第4张图片-快备云

导入LOGO文件

Photoshop设计动漫游戏网站模板(8)-第5张图片-快备云

导入一张光晕图片

Photoshop设计动漫游戏网站模板(8)-第6张图片-快备云 


将图片裁剪到适当尺寸,放入游戏网站的头部,调整图片的不透明度和颜色,使其与整个蓝色背景融合在一起

Photoshop设计动漫游戏网站模板(8)-第7张图片-快备云

为LOGO标志添加背景边框,并设置填充为8%

Photoshop设计动漫游戏网站模板(8)-第8张图片-快备云

制作两条矩形条作为导航按钮的背景区域

Photoshop设计动漫游戏网站模板(8)-第9张图片-快备云

设置顶部的矩形条图层样式如下

Photoshop设计动漫游戏网站模板(8)-第10张图片-快备云

Photoshop设计动漫游戏网站模板(8)-第11张图片-快备云


设置底部的矩形条样式如下

Photoshop设计动漫游戏网站模板(8)-第12张图片-快备云

Photoshop设计动漫游戏网站模板(8)-第13张图片-快备云 

为了突出立体质感,制作一个白色矩形条,高度为其一半,设置不透明度为4%

Photoshop设计动漫游戏网站模板(8)-第14张图片-快备云

为两条导航条添加文字,并且我们用两条1px高度的线条(一黑一白)来分割他们之前的区域

Photoshop设计动漫游戏网站模板(8)-第15张图片-快备云


制作一个圆角矩形,使用如下样式,当鼠标移动到按钮上时作为按钮的背景

Photoshop设计动漫游戏网站模板(8)-第12张图片-快备云

Photoshop设计动漫游戏网站模板(8)-第17张图片-快备云 

如下图就是鼠标移动到NEWS按钮时的效果了

Photoshop设计动漫游戏网站模板(8)-第18张图片-快备云

制作白色矩形

Photoshop设计动漫游戏网站模板(8)-第19张图片-快备云


添加样式

Photoshop设计动漫游戏网站模板(8)-第20张图片-快备云

Photoshop设计动漫游戏网站模板(8)-第21张图片-快备云

Photoshop设计动漫游戏网站模板(8)-第2张图片-快备云

Photoshop设计动漫游戏网站模板(8)-第3张图片-快备云


将完成后的矩形复制一次放到底部,将游戏图片放入两者之间

Photoshop设计动漫游戏网站模板(8)-第24张图片-快备云 

为顶部矩形上部添加白色矩形(高度为矩形的一半),设置不透明度为 3%,产生质感

Photoshop设计动漫游戏网站模板(8)-第25张图片-快备云

添加文字与箭头 

Photoshop设计动漫游戏网站模板(8)-第26张图片-快备云


依照上面完成的区块样式制作网站的其他区块

Photoshop设计动漫游戏网站模板(8)-第27张图片-快备云 

放入文字与图片

Photoshop设计动漫游戏网站模板(8)-第28张图片-快备云 

完成后的游戏网站的整体效果如下图

Photoshop设计动漫游戏网站模板(8)-第29张图片-快备云 



标签: Photoshop设计动漫 Photoshop设

发表评论 (已有0条评论)

还木有评论哦,快来抢沙发吧~