2012搜狐焦点首页改版心得

专为互联网人打造的365天成长计划,500门视频课程随便看,构建你的产品、运营知识体系。查看详情

三季度,焦点房产首页进行了一次大的改版,这次我负责了页面视觉设计。

这次改版的方向和目的是:”以用户为中心,帮大家找好房”,提高用户通过首页进入楼盘详情页的到达率。

改版项目启动后先和产品同学做了沟通,针对改版需求做了分析,对于布局也参与了讨论。

2012搜狐焦点首页改版心得

讨论结果,上一版在首屏更多突出的资讯,占了首屏的主要位置,这样用户进入首页后不便于找到搜索,另外楼盘的信息也相对靠下,用户需要翻过首屏才能看到。针对主要问题,产品在出UE时,做了多种尝试,同期我考虑风格,并按不同的UE做尝试。

在风格上,明确了需要保持继承性,要保留焦点的立体风格元素,同时根据页面设计发展趋势,去掉过多的装饰,采用简洁的风格进行设计。期间对近期主流网站都做了分析和研究,同时也重点关注了对手首页,比较优缺点。

2012搜狐焦点首页改版心得

讲过尝试,在产品UE的基础上,推出了两个尝试方案:

方案A:相对保守,对搜索区域加宽至通栏,右侧摆放工具,方便用户找房。

2012搜狐焦点首页改版心得

方案B :这个大胆一些,相对上一版,是一个突破,将搜索置于顶部,导航之上,更符合用户找房的目的。

2012搜狐焦点首页改版心得

另外在设计过程中得到了数据同学针对运行中的首页,进行了热力分布图记录,对布局调整给予了有力支持。

最终确定了B方案。

之后产品出完整UE,然后一气呵成,期间我们交互设计师子轩同学也积极参与,提出各种改进想法和建议。

2012搜狐焦点首页改版心得

另外说一下关于首页宽度。

在最初的讨论中就涉及到是否加宽页面宽度。

最近一年有多家网站的宽度做了变宽调整,例如腾讯首页的宽度改成了1000PX,和产品一起做了内部讨论,基本确定加宽页面宽度。

加多宽呢,但如果用1000px,就要出新的尺寸(焦点现有尺寸包括950、980、1002。如果要变宽,可以选择到1000,这样在1024下能够正常显示。),当然也有好处,更便于建立栅格体系。

最终讨论结果,采用1002,不出新的尺寸,更好满足广告系统,关于栅格系统,有一单列间隙定位12px给予解决。

本文来源:搜狐焦点UED

祝给予赞赏的伙伴,2017年发大财!

评论( 2

写下你的想法
  1. 搜狐焦点产品经理助理

    同事你好。

    回复
  2. 这种网站有毛交互…

    回复

推荐阅读