1、开工前的讨论
在做上一版的概念版官网的时候，主要是交代清楚了游戏的故事背景、阵营关系、种族职业初步介绍。当时介于游戏开发的阶段，很多东西其实是点到为止。就像是说看一本书看了个序。
在做正式版官网的时候，和市场方面、产品经理做了比较详细的沟通，该版本官网除了满足游戏正常运营所需要的一些功能外，也希望延续概念版的基础，把之前讲到的一些东西铺开来，讲的更详尽。
这几点主要包括：故事背景、种族职业、蒸汽文化。主要以专题方式呈现。
2、设计思路整理
第一版官网方案：
概念：阵营强对抗，强调敌对势力，加强PK代入感。(以下方案为概念模拟稿，借用了其他产品的形象图，敬请谅解。)
第二版官网方案：
概念：时间轴。以黑金各种族出现的年代作为时间轴，讲述该种族出现的时期发生的故事、出现的新事物等等。(以下为DEMO演示)
第三版官网方案：
概念：蒸汽与魔幻。官网分为两个入口，内容上面做区分，画面表现上提供两套皮肤，玩家选择自己喜欢的阵营进入查看相关的信息。(以下方案为概念模拟稿，借用了其他产品的形象图，敬请谅解。)
第四版官网方案：
概念：蒸汽朋克。已经进去到了游戏开测前的阶段，所以在之前和几个概念类型的官网都已经不在适用，要完全按游戏正式的官网来做。经过第三版蒸汽与魔幻的对比后，选择了更能引起人们关注的“蒸汽朋克”风。
3、设计中的思考
1、蒸汽朋克版官网
我们都知道，一般构成网页设计的几个要素：主视觉、背景图、SLOGAN、UI。
主视觉：这方面有较大的选择余地。IP中心提供了几个比较成型的角色。
UI：前期的资料收集非常重要，看看我的文件包吧。
选定了个原型，做出了大致的设定;
提交艺术中心帮忙细化，包括后期的FLASH效果。
SLOGAN:结合整体页面的效果，在SLOGAN的设计上面，没有做过多、复杂的效果。
动画：最终加入了一些蒸汽气压表针齿轮转动等效果，起到了锦上添花的效果。
2、专题
所有专题在设计之初有一个构想，官网选择了蒸汽朋克这个元素来设计，是希望人们在脑海中加深对黑金蒸汽文化的印象，既然我们植入了一个符号，为什么不在更多专题里面不断的加深这个印象呢?或许是蒸汽元素，又或许只是一个“符号”。所以在专题设计的时候，我采取了比较具象的、形式感的布局，并且一直延续下去，形成一种风格。
故事专题：
符号：书本。添加蒸汽元素，以书本的形式来进行包装，原本想做成电子杂志，后来种种原因取消了。
种族职业：
符号：旗帜。以旗帜来区分不同的阵营，就像古代的两军对垒，都要扛上自家的旗帜。
这里面顺便要提到一点是素材的前期准备。
有人说里面的种族的图画的很赞，整体结构也比较好。关于这个我要告诉大家的是：在提素材需求的时候，你的脑海中要对画面有个比较清晰的描绘。更重要的是你要对游戏的概论有比较充分的了解。
双面黑金：
符号：圆形。以圆形为视觉中心，左右两边采用对抗的形式，展示不同的“双面”概念：双面魔幻、双面CEO、双面风格、双面阵营、双面玩法。
4、项目总结
黑金项目中值得思考和分享的几个点：
1、引导页头图过高，采用几秒后定位到下面的主界面，这样的交互体验好吗?
2、页面头部未必非要有人物主形象。
3、在做banner的时候，官网、论坛、登录器尽量保持比例统一。
4、不要忽视一些截图素材，其实有时候截图更能让用户直观的感受的游戏内的真实度。
5、论坛、新闻之类的块面，因为有大量的文字信息，尽量不要使用反白的效果，长时间阅读会让眼睛产生疲劳感。当然，也别用很纯、饱和度很高的颜色，会被刺瞎的。
5、一点建议
总结几个点吧：
1、 了解游戏信息：包括故事背景、职业、特色玩法、价值观、……千万不要忽视文字资料。
2、 收集市场信息：竞品游戏的官网，分析他们的优势与劣势。分析我们的用户群，他们的喜好与习惯。了解测试时间、推广计划等市场计划。
3、 原型的讨论：别把自己当个美工，我们不只是一个画画的、美工，积极的去参与到原型的讨论中，你能从中了解到产品经理们的思路，同时也能把你的想法反馈给他们，有时候你的点子或许会给别人一些启发。
4、 巧妇的米：去找项目的主美多要些资源吧，什么花花草草、动物妖怪、NPC大叔、十八般武艺啦，别嫌多，总有用到的时候。如果能说服他给你开个他们内部的共享权限那就更好了。
5、 头脑风暴：能做的都做完了，要是你还没有找到感觉，那就拉上难兄难弟们一起头脑风暴一下吧。总有些帮助的。
6、 上线跟踪：有人说我们是像素眼，其实我们是有一种追求完美的心，上线前看看最终呈现的效果和你预期的有没有差别吧。
【如何主导一套游戏官网的设计】相关文章：
★ pc与移动设计