打开浏览器,网游页面上的传统中国风元素——书法、水墨、竹叶飞花是否让你无感?灯笼、折扇、龙凤云纹是否也早已麻木?
有鉴于此,我们这次尝试谱绘一幕幕“远看山有色,近听水无声;春去花还在,人来鸟不惊”的皮影戏画卷,来定位新寻仙的视觉包装,点滴改变,只为给你带来耳目一新的感受。

一、产品背景介绍

寻仙作为一款08年运营至今的中国传统神话网游,以其独特的美术风格和多元化的游戏玩法成为国内众多大型MMORPG中一款经典之作。
游戏版本的不断更新,新鲜玩法的注入,一直以来是寻仙吸引众多玩家的卖点。每次游戏中的版本更新都是宣传游戏品牌,增强玩家情感粘性的一个重要节点,是产品运营的主要环节。


(寻仙版本专题回顾)

二、项目阶段解析

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

产品品牌刷新时间轴:

1:2012年11月4日 ,中国风神秘站上线
神秘站的末篇以“传承中国风,尽在新寻仙”的概念揭晓,力图唤起玩家对传统中国文化的关注,并达到了增加用户粘性的作用,受到了新老玩家的一致好评。

(连接地址:http://game.qq.com/act/a20121113mystery/

2:2012年12月11日, 品味中国风品牌站
将寻仙与以往电影、电视、配音、配乐等方面的合作有机整合后全面呈现给玩家,作为玩家记忆与游戏发展里程碑的见证。

(连接地址:http://xx.qq.com/act/a20121206new/

3:2012年12月18日, 新寻仙新官网
本次官网改版根据数据沉淀和用户调研报告,梳理了功能模块的使用交互,并重新设计了更符合当下浏览体验的轻简视觉风格。

(连接地址:http://xx.qq.com/index.shtml

4:2013年3月25日, 霸下皮影戏主题站
皮影戏主题站是对神秘站表现形式的延伸,也是新寻仙品牌刷新以来第一个大型专题的视觉展示。

三、风格规划与草案设计

神秘站的成功给我们带来新的启发,有时活动初期的未知性的吸引力要比活动本身大的多。所以决定引入皮影戏的表现形式,对中国风风格设计做出一次新的尝试。
以往的水墨,祥云,书法等设计元素,已经无法再作为一款玩尽中国风元素产品的新卖点了,因此决定用传统艺术中的皮影戏来设计寻仙新版本的预热站。以说书人为主形象,旁白贯穿始终,传达给用户新寻仙传承中国风的品牌文化。

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

四、设计执行与制作

1:舞台还原
将过去皮影戏舞台用写实风格搬到页面上不太合适。
原因有两点:1.由于网页尺寸的限制,是无法保证在不同分辨率下舞台视觉效果体验的;
           2.复杂的舞台效果会影响到用户体验和重要功能及讯息的传达。
故决定提取皮影戏舞台的代表元素,整体设计成一个用松柏雕梁做装饰的屏风墙,以达到整个主题站氛围的营造。

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

3:设计细节考虑
由于整个站的视觉上比较繁复,所以弱化了UI质感,以大的形状来取代厚重的细节,将每出戏的导航设计成了戏院翻牌的形式。
为了更符合第一视角的观影体验,从远·中·近景的景深触犯在页面最前方摆置了太师椅和松枝,让整个页面的气氛更加生动有趣。

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

五、最终效果

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

五、专题总结

感谢重庆漫想族对素材需求的高度完成和配合,动画重构的同学对设计稿的高度还原,对页面加载和用户体验的反复修正。
个人感悟:
重点项目设计完成,是需要前期大量准备和素材收集的。同时要预估每个时间节点加以推进。整个设计过程也是设计师对品牌一个自我认知的过程。
从品牌传播的意识出发:对于一个在玩家心里已经有5年的产品而言,设计更多的要做的是对品牌文化的传承和对玩家情感的挖掘。在求新的同时也需要正能量的发现和正确的态度打动玩家用户。
PS:新寻仙皮影戏的上线PV:600万 UV:500万
这些数据说明该主题站在品牌传播和玩家认知等方面都收到了不错的效果。
在线体验地址:
http://xx.qq.com/act/a20130325story/

六、最终话

作为一名毕业生来到TGideas团队已经快3年光景了。跟进寻仙的设计3年,从一开始的每个小专题,到现在大多数的寻仙专题都是交由外包设计执行,自己主要负责大型项目的设计和审核的工作,一幕幕忆涌上心头。
写这篇文章的时候一时兴起翻到3年前自己那会的设计,顿时唏嘘不已,但当时设计的那份心情和初衷回味起来是多么快乐的一件事情。时光如梭,感谢寻仙带给我的成长中的点点滴滴,我会以梦为马——继续前行。