当前位置: 首页 > 图文教程 > 网站运营 > 建站经验 > 35.com专题页面网站制作过程和经验分享

建站经验
网站为什么会被百度降权 的原因分析
在搜索引擎上做排名的方法
最令人讨厌的 也是最行之有效的广告类型
穷站长 富站长 分析
如何成为一名合格的站长
建站经验 网站打开速度快慢的因素
建站IDC选择经验 认识双线机房
制作网站需要学习的知识
判断某个网站流量简单分析
岳贵 谈谈个人站长如何树立信念
个人站长二步定位好一个网站
博客网站打造高流量的四种方法
建站经验 你的网站该如何应对被采集
充分利用百度知道进行网络推广
你听说过月赚4万美圆的个人博客吗
网站 搜索引擎降权的处理方法
网页设计 可读性的提高方法
目前最流行的10款国外博客程序
充分利用微型博客推广的技巧
建站经验 成功网站应该具备的

建站经验 中的 35.com专题页面网站制作过程和经验分享


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-26   浏览: 91 ::
收藏到网摘: n/a

10年经验,万家客户!对于专门负责网站建设的兄弟部门来说,是一个足以回顾前程的台阶。而作为设计这次专题页面的我们,觉得有必要把设计过程记录下来,作为记忆的同时与大家一起分享。

先看看最后上线的部分截图:

final_01

接下来,简单回顾下整个设计过程(为什么加个简单呢,因为码字还是比较累的:P):

需求分析阶段

此次的需求十分简单明了,就是在网建10年之际做一个简单的专题页面,让浏览者在页面中能够看到以往的客户案例。从需求来看整体页面不需要有过多的内容,因为客户最关心的案例部分已经做成电子杂志和在线浏览两种方式以供观看,所以我们要做的实际上就是一个专题形象页面。既然已经明确了需求,那就展开讨论吧。

创意讨论阶段

有讨论的时候就是有口福的时候:),几瓶可乐,几个小点心,拉出白板拿起画笔,开始了叽里呱啦的讨论过程,此处省去三万两千字……

经过菜市场喊价杀价般的讨论后,最终确认了以下几点:

  1. 以蓝天、白云为背景:云是一种高度的象征,而天空则是另一种更高的高度象征;辛苦攀登了10年已经值得回望,但在回望之后还有更长的路要走;
  2.  以10年为中心:正因为经历了10年的攀登,才会有今天的高度,因此这个中心点肯定要牢牢抓住;
  3. 以案例为辅助:有付出就会有收获,10年的付出换来的是超过万家的客户,无数的案例就是最好的见证。

几个核心点已经达成共识,那么接下来就是体现手法了(因为要记录硝烟弥漫的讨论过程难度那是相当的大,因此只给最后的讨论结果留了张照片,请各位观众见谅见谅):

final_02

一共是三个方案,统一都用蓝天白云作为背景。左上角的草案是对众多的客户案例进行阵列排版,凭借天空的纵深感来展现出磅礴的气势;右上角的草案则是将10字大大的立于云端之上,然后用看似成千上万的案例环绕在10的周围,体现出10年历程的背后有着无数的客户肯定;而最后左下角的草案是由无数的案例拼凑成10的形状,体现万家客户共同见证的10年历程。

为了重现“火拼现场”的雄姿,Juns拿起了画笔,Cat摆起了姿势,用彪悍的作风让本已收起相机的摄影师十分委屈的给他们补了张俊照……看,当时就是这个姿势。

final_09

咦?奇怪,此次的主要设计师饭特稀呢?这个,看来是讨论时意见不合被这两人给废了,估计正躺在公司的某个过道上-_-!,这两个人在部门可是号称……刚写到这里又感觉到强烈的杀气,Yang觉得还是算了,再写下去就不单单是变成亚健康状态了-_-。

设计阶段

在有了3种草案后,那么接下来当然就是各显神威的时候了。但是Yang怎么看怎么觉得左下角的草案很眼熟啊,经过一番翻箱倒柜查找,终于找到了“罪魁祸首”(看右图):

final_04 final_05

很相似吧,算了,既然已经被微软先入为主了,那么作为强烈支持原创的我们来说,只好放弃了这个草案。

评审阶段

在经过兄弟们很多很多~~~很多很多(回音)小时的埋头奋斗后,设计稿终于出炉,显而易见,两稿中最后通过评审并最终确定下来的是稿二。

稿一草图和最后实现效果:

final_06 final_07

从实际效果来看,整体展现不出“万家”客户的宏伟气势,注定被Cancel。
(由于是未采用的设计稿,因此只用小图体现,请各位看客多多包涵)

最后看看稿二完善过程的效果图:

final_08

稿二最终定稿效果图:

final_01

剩下的就是广告banner等周边配件的设计和页面实现阶段了,再此就不多废话了,看图,收笔:)

首页Flash Banner截图:

有兴趣的可以直接访问专题页面观看整体效果:
网建10年专题页面:http://www.35.com/promotion/site10years/default.html
广告Banner更新页面:http://www.35.com