浅谈寻仙游戏网站中国风元素的应用

挣名扬

挣名扬

2016-02-16 21:18

今天图老师小编要向大家分享个浅谈寻仙游戏网站中国风元素的应用教程,过程简单易学,相信聪明的你一定能轻松get!

打开浏览器,网游页面上的毛笔书法,祥云龙纹的中国风元素是否让你麻木?来看下新寻仙吧,这里将为你带来的是:远看山有色,静听水无声。春去花还在,人来鸟不惊的皮影戏画卷。

一、项目介绍

寻仙作为一款08年公测的产品至今,以其独特的美术风格和多元化的游戏玩法成为国内大型MMORPG中的一款经典之作。

游戏版本的不断更新,新鲜玩法的注入,一直以来是寻仙吸引众多玩家买点。每次游戏中的重要更新是宣传游戏品牌,增强玩家情感粘性的一个重要时机,是产品运营中的总要环节。

浅谈寻仙游戏网站中国风元素的应用,PS教程,图老师教程网

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

二、项目分析

新寻仙品牌的刷新过程,也是对整个寻仙视觉包装的提升过程。不光是游戏内产品品质的提高,整个网络传播中的视觉表现也从新整合设计。寻仙皮影戏站的设计,正是在这系列的刷新后涅磐重生的。

产品刷新时间轴:

1:2012年底,寻仙品牌刷新,全新神秘站点推出引起各界热议。最后以传承中国风尽在新寻仙的概念揭晓,力图唤起玩家对传统中国文化的关注,增加用户粘性,受到了新老玩家的一致好评。

浅谈寻仙游戏网站中国风元素的应用,PS教程,图老师教程网

2:紧接着是全新品牌战的推出,将寻仙以往电影电视配音配乐各方面的合作全部整合后面向玩家,作为玩家记忆与游戏发展里程碑的见证。

浅谈寻仙游戏网站中国风元素的应用,PS教程,图老师教程网

浅谈寻仙游戏网站中国风元素的应用,PS教程,图老师教程网

3:最后全新官网改版的上线,对用户交互以及网站主视觉的重新梳理。

浅谈寻仙游戏网站中国风元素的应用,PS教程,图老师教程网

4:皮影戏页面是对神秘站用户探秘内容的衍生,是新寻仙品牌刷新以来第一个大型专题的视觉展示。

三、草案设计与风格讨论

皮影戏的引入,是对在中国风风格设计的一次新的尝试。以往的水墨,祥云,书法等设计元素,已经无法再满足寻仙作为一款玩尽中国风元素的载体,所以决定了用传统艺术中的皮影戏来设计寻仙新版本的预热站。以说书人形象为主形象,旁白贯穿始终,传达给用户新寻仙传承中国风的品牌文化。

浅谈寻仙游戏网站中国风元素的应用,PS教程,图老师教程网

设计初期准备:对皮影戏表演形式的整理,关键字的提炼,在老照片中寻找设计灵感和视觉发力点。提炼了游戏产品的皮影戏风格,配合当下设计趋势的配色和设计元素。

浅谈寻仙游戏网站中国风元素的应用,PS教程,图老师教程网

浅谈寻仙游戏网站中国风元素的应用,PS教程,图老师教程网

四、设计执行与制作

1:舞台还原

将过去皮影戏舞台搬到页面上明显是不现实的。原因有两点:一是因为网页尺寸的限制,是无法保证在不同分辨率下舞台视觉效果体验的;二是复杂的舞台效果也会影响到用户体验和重要按钮讯息的传达。

故,选择了提取皮影戏舞台的重要元素,设计成一个屏风墙用松柏雕梁的装饰达到整个站氛围的营造。

浅谈寻仙游戏网站中国风元素的应用,PS教程,图老师教程网

浅谈寻仙游戏网站中国风元素的应用,PS教程,图老师教程网

2:皮影戏还原

记忆中的皮影戏是在昏黄灯光下若影若现的人影,半透明的油纸材质在画布上投上重重的影子。经过与动画组同学的讨论,在原画设计上采用了矢量的半透明原画,在flash中利用混合选项的阴影模拟皮影打到画布上的效果,同时在整个页面上罩上了一层半透明的布纹效果。这样制造出一个生动皮影戏观感。

浅谈寻仙游戏网站中国风元素的应用,PS教程,图老师教程网

浅谈寻仙游戏网站中国风元素的应用,PS教程,图老师教程网

3:设计细节考虑

由于整个站的视觉上比较繁复,所以弱化了UI质感,以大的形状来取代厚重的细节,将每出戏的导航设计成了戏院翻牌的样子。

为了更符合第一视觉的观影体验,从远中近景的景深触犯在页面最前方设置了太师椅和松枝前景,让整个页面的气氛更加生动有趣。

浅谈寻仙游戏网站中国风元素的应用,PS教程,图老师教程网

浅谈寻仙游戏网站中国风元素的应用,PS教程,图老师教程网

4:用户体验构想:

整个版本前瞻的内容是由说书人音频道出,配合动画展现。用户以第一视角观看内容效果最佳,所见即所得。如果一个预热站只有说书人的单一说书岂不是很单调?既然是全站flash那就加入一些用户交互的小彩蛋吧。页面中关于剧情内容的前景是需要用帮助才能进行,比如把小孩和宝箱丢入大海-0-。

浅谈寻仙游戏网站中国风元素的应用,PS教程,图老师教程网

五、最终效果

设计最终力在还原整个古时观看皮影戏舞台的场景,昏黄的灯光,松鹤延年的镂空画屏,厚重的太师椅,前景的松柏盆栽,而用户就像以第一观影人的身份坐落期间,观看说书人奖整部寻仙的版本前瞻娓娓道来。

浅谈寻仙游戏网站中国风元素的应用,PS教程,图老师教程网

浅谈寻仙游戏网站中国风元素的应用,PS教程,图老师教程网

浅谈寻仙游戏网站中国风元素的应用,PS教程,图老师教程网

六、专题总结

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

感谢重庆漫想族对素材需求的高度完成和配合,动画重构的同学对设计稿的高度还原,对页面加载和用户体验的反复修正。

个人感悟:重点项目设计完成,是需要前期大量准备和素材收集的。同时要预估每个时间节点加以推进。整个设计过程算是设计师对品牌一个自我认知的过程。

从品牌传播的意识出发:对于一个在玩家心里已经有5年的产品而言,设计更多的要做的是对品牌文化的传承和对玩家情感的挖掘。在求新的同时也需要正能量的发现和正确的态度打动玩家用户。

展开更多 50%)
分享

猜你喜欢

浅谈寻仙游戏网站中国风元素的应用

平面设计 海报设计 广告设计 画报设计 签名设计 服装设计 名片设计 画册设计 版式设计 商标设计
浅谈寻仙游戏网站中国风元素的应用

中国风- 中国元素平面设计(二)

平面设计 设计素材
中国风- 中国元素平面设计(二)

什么是极简主义 如何打造极简风格家居

家居设计 装修设计
什么是极简主义 如何打造极简风格家居

中国风系列元素设计(一)

美术设计 设计素材
中国风系列元素设计(一)

PS游戏网站按钮制作步骤

设计创意
PS游戏网站按钮制作步骤

2017榻榻米书房设计装修效果图 榻榻米书房设计图片

榻榻米 书房 装修设计 书房设计 平面设计
2017榻榻米书房设计装修效果图 榻榻米书房设计图片

37个游戏网站设计欣赏

平面设计 海报设计 广告设计 画报设计 签名设计 服装设计 名片设计 画册设计 版式设计 商标设计
37个游戏网站设计欣赏

中国风- 中国元素平面设计(一)

平面设计 美术设计
中国风- 中国元素平面设计(一)

2017春夏女装风衣外套流行趋势

服装设计 平面设计 设计 服装搭配
2017春夏女装风衣外套流行趋势

20组免费网页设计常用图形图标素材分享

20组免费网页设计常用图形图标素材分享

3套国外创意独特的字体设计欣赏

3套国外创意独特的字体设计欣赏
下拉加载更多内容 ↓