13573696515
 
新闻与帮助
 
潍坊创美:记一次官网改版的梳理与思考【精武门】
浏览次数: 时间:2018/3/20 15:11:13
一、项目布景

  精武门,是广州大象健康科技有限公司和阿里体育联合主办,致力于打造世界概括斗争职业联赛顶尖途径。

  二、规划方向

  (1)旧版问题拾掇

  此次官网改版首要针对旧版官网的以下三点问题进行leyu规划: a、页面全体风格过于单调忧虑烦闷

  b、斗争赛事所包括的热血、热心的规划元素不行超卓

  c、信息架构、界面布局不行合理;一起现有的页面结构不能满意公司事务的调 整打开,需求从头leyu页面全体的安排架构和信息展现

  (2)规划方针

  a、分配色彩,烘托出页面的空气

  b、侧重超卓页面的质量感,增强品牌效应;一起在规划元素运用上,全体的页 面要坚持一起性

  c、调整页面布局;信息展现更合理,主次清楚;要害模块能够捉住用户的眼球

  三、规划输出阶段

  (1)前期

  方针用户会导致规划风格有偏向性,关于精武门这种斗争途径来说,规划风 格基调前期需求有个方向性的研讨剖析,比如依据赛事性质,选择了整个页面需 要热血热心、火爆、严峻作用,有这几个要害词后,能够依照既定的方针去寻找 规划方向。 而在全体的规划方针上,官网的规划不只需求增强质量和品牌感然后公布用 户去感知,一起需求更多的展现和传递资讯类的信息,所以既要保证信息清楚合 理精确地传达,又要让用户进入页面后,自然而然地感受到斗争这种热血热心、 火爆、严峻空气。

  (2)规划进程

  完毕前期的方向性预备后,接下来就是依据信息架构完毕元素的基础布局。以下以官网的引导页和主页为例:

  1、引导页(意图:在用户进入到官网主页之前,经过这个引导页快速吸引用户的注 意力,并将精武门的品牌形象以及赛事内容展现给用户,一起供应便利的进口和导 航指向到方针内容模块。)

  在出全体作用之前,首要是模块布局。不触及细节,只将信息区块按匹配好的色彩填充并按必定的款式摆放在相应的展现区域。 页面依照最高1920px的宽度规划,考虑到不同设备的适配,平衡之后,水平区域展现内容都放置在1440px的宽度去布局。一起,用户在笔直方向上看到的首屏内容的也会因设备分辨率不同而不同,究竟首屏的规划规范选用1440px*900px。在布景大图的展现办法上,选用自动播放的短视频,经过“静”来烘托页面空气和展现内容的一起,用“动”来捉住用户的眼球,动态结合来一起传递品牌的感染力。

  依据区域补偿内容和细节后的究竟作用:

  2、主页

  【旧的主页】在信息架构层面存在以下几点不合理之处:

  a、顶部栏(1)占有过高的空间,相对重要的导航栏(2)反而占有着小块空间,显得不行 超卓。

  b、导航栏(2)在整个深色暗淡的页面中过于弱化,不只区块小,导致层级不行超卓; 一起字体不行大,当时页在选中状况下作用相关于未选中的比照性也不强。

  c、新闻动态(3)、赛事咨询(4)、精彩回想(5)、图集(6)这几个模块在内容的布局上缺 少接近性、比照性,内容整合也相对紊乱,像(4)(6)都缺少一起款式的标题,导致 在内容层级的归属上有了解的过失;而且从阅览习气(从上到下,从左到右)、图 文关于阅览焦点触发的先后次序、内容展现区块的巨细这几个视点来考虑,这四块 内容也存在信息架构布局不合理的问题。

  d、以精武门斗争竞赛性质的内容运营需求启航,主页的信息架构需求从主次优先 级、商业性质、产品交互逻辑这几个方面进行从头拾掇。

  【新的主页】比照旧版主页存在的问题,进行了以下几点leyu:

  a、调高导航栏的高度,一起将精武门logo整合到导航栏最左面,既超卓导航栏的信 息结构,又能起传递品牌的作用。

  b、将导航内部的字体字号增大加粗,一起用块状的主色调火红色作为当时页面的选 中状况。

  c、从观众和商业运营的视点启航,观众更希望快速获取到竞赛自身相关的信息,包 括最新赛事、购票、能够看到竞赛的途径、最新资讯以及重视的沙龙和选手,而 官方能够经过这个途径将最新的推送内容快速及时传递给观众,一起获取相应的平 台资源版权收入。d、将每个模块以卡片办法归类整合,这样信息布局更清楚,内容分部更有条理和亲 密性。比如每个最新的赛事独自以卡片集结的办法整合到顶部,便利用户及时便利 的获取最新赛事动态。

  e、依照阅览次序和内容的主次联络,首屏的头部用大面积的轮播大图集结首要的赛 事信息,相关于其它静态页面,更能抓取用户的眼球;右边放置包括资讯、票务和 直播等当时竞赛相关的信息。

  f、最新资讯、沙龙排行、选手排行也是以卡片整合图文的信息结构按从左往右,从 上往下的阅览次序摆放在首屏底部,便利用户在翻滚屏幕一起抓取信息;每个模块 以及内容自身之间也是有一起的标题和排版款式,然后坚持页面内容的接近、对 比、对齐和重复的准则。

  g、除此之外,在字体巨细、色彩、间隔、主色调和辅佐色的运用上,也是以接近、 比照、对齐和重复的准则进行排版规划。

  四、总结

  经过这次系统性的项目规划,也让我愈加清楚的认识到,规划自身不应一味寻求作用的输出,也不应一拿到需求就着手漫无意图的规划。规划是一个进程,前期的每一步都应该为究竟的输出做好合理的预备,这样的输出才更能契合产品的究竟方针,防止盲目和随性,而是从用户体会的视点启航去发现问题和解决问题。
 
  • 13573696515
  • 我们的服务
    乐鱼娱乐乐鱼娱乐乐鱼娱乐网站设计
    网络推广
    搜索引擎leyu
    乐鱼娱乐乐鱼娱乐乐鱼娱乐网站备案
    维护与改版
    我们的优势
    细致入微的前期服务
    精准的策划服务
    完美的网页设计
    领先的技术
    有任何问题,24小时回应并处理
    联系我们
    山东省潍坊市东风街世纪泰华大厦16层
    兰经理
    13573696515
    383781928
    383781928@qq.com
    潍坊创美网络技术有限公司 All Rights Reserved 鲁ICP备17032779号