好看簿新版设计 - 一级页面
|
最近很多用户给我发小纸条, 觉得我没有以前活跃, 问我在忙些什么. 从国庆新服务器上线以后, 我就一直在忙于跟设计师一起为好看簿打造新页面. 今天做的有些疲惫, 决定明天休息一天. 在此, 我把设计工作的最新进展在这里给出一个说明, 希望能多听到大家的反馈意见. 这次的设计希望能够突出四个特点, 或者说是网站的四个"性格". - 专业: 第一眼就要让用户觉得这个网站值得信赖 - 美观: 让用户觉得舒服. - 亲和: 像老友聊天, 可以放松浏览. - 个性化: 尽量利用有效空间展现尽量多的"个性化"信息. 请大家在"故事评论"中给出对这些设计的一个整体评价, 在每个"照片评论"中发表你对该页面的反馈. 第二批页面设计, 主要是上传照片和故事页面, 会在一周后发表. 同时, 我和设计师会基于大家的意见反馈对现有设计作出调整, 所以请不要吝啬你的意见, 也请告诉我们在新设计中你喜欢哪些. 谢谢 :-) 让我们开始吧. |
首页 1. 页首导航:
1.1: 四个tab突出全局导航的四大块内容 1.2: "上传照片"和"发起活动"是全局性动作, 所以与"内容"导航区别开来. 1.3: 搜索比较小是因为我自己浏览器的问题. 2. 顶部介绍性的Flash(暂缺): 在左边"推荐故事"上面会加入一个介绍性的flash, 留到最后再设计,现在空缺. 3. 推荐故事列表: 很多新用户第一眼看到好看簿就会说: 这是照片网站. 这里的原因是我们原来的设计没有把"故事"的叙述性和系列性突出出来. 所以这里的列表, 每个故事一行, 突出"背后故事"的重要性. 4. 好看簿新闻和推荐用户跟现有类似. 5. 两侧阴影(需要点击大图) 现有的设计是占满全屏, 这样的布局给设计和排版带来很大难度. 因此在新设计中, 在尽量利用宽屏显示器空间的同时, 会对页面宽度做一个限制, 看起来就是在两侧显示部分阴影. (宽屏显示器上的布局优化还没有做)
为七个月而努力的万清
4 年, 7 月前说:
1、首面文字还是多了些。对于故事的导言部份,完全没有必要放上去。我觉得仨说得很到位,而且我感觉我在选择一个故事阅读的时候,就看两个内容,一是封面图片,二是故事标题,做法可以参照下多拍网(http://www.dpdp.net/)对单个图片的描述方法。而现首页,看似内容多了,但这种多,只限在了对于一个故事的详细描述,事实上内容没有现在的多。这些内容,完全可以在查看单个故事时看,而没必要放到首页上来。2、首面的两级导航主次不分明,而且二级导航看样子还是固定的,能否引进定flickr的做法,做成菜单的形式,点击出现二级。 3、首页是一个展示精彩与更新速度的地盘,我觉得没必要分得么细,就设成两类,一类是“本月精彩”,另一类就是“最新更新”,这里的“本月精彩”要仔细考虑下,如果设置不当,可以会出现一个月中,始终是最新上传的成为”最精彩“的假象。 当然也可以是”精彩故事“,”精彩活动“,”精彩图片“放置在首页。 4、首页的色彩组合上还是不够感染力,具体为什么我也说不上,总之就感觉很“白”,很平淡。 5、页面自适应,这个应该去做,而不应该用折衷的办法。在我看来,就简单了,可以考虑着图片的排列改变。如1024时就两个一行,而宽屏时就三个或更多一行。 6、首页太长了。我浏览的时候,感觉接近三屏的样子。可考虑将内容压缩到一屏到一屏半,最多不超过两屏。 7、右上“看好薄新闻”处这个空间很宝贵,我觉得你们应该考虑下怎样加以更有效的利用。我觉得可能以将文字压缩到两行,而加入一个图片框,而内容,就可能以放上官方的活动,或是官方产品宣传。 8、加强自动推荐功能的开发。现在这个功能还没怎么体现现来。如果能做到,用户看了图或故事就想自动去评下,那就最好了。这样首页的推荐内容就会更加快速,好看了。
笑笑爹
4 年, 7 月前说:
首页文字的确太多,而且也太长了。我的感觉首页更重要的在于导航功能,因此对于故事的标签、作者等等没有必要放到首页,这些内容放到故事页面里面更合适。 在首页上对故事进行说明,用描述会比较占地方,但是只用标题是否会过于简单? 另外对故事的说明文字还应该包括故事的照片数量。 这样压缩每个故事占用的页面空间,每行可以放下两个故事,在首页可以将首页的长度压缩不少。 页面的颜色需要改进,现有的配色方案太过于素淡,需要明亮一些,但是不要太过于强烈。
从墨脱回来的大野狼
4 年, 7 月前说:
首先真心的感谢大家的反馈. 对于配色方案太过素淡,今天早晨设计师把睡梦中的我叫醒,说他会好好想想,再出个方案. 这个周末会很密集的工作两天,出个新的方案来. 另一个反映很多的问题是是否显示的内容太多. @Lixinfeng: 在首页上对故事进行说明,用描述会比较占地方,但是只用标题是否会过于简单? 这正是我们考虑的地方. 现在好看簿上故事还少,但是当每天有上百个故事的时候(不是在做梦,很快就会有大规模的推广活动), 通过标题来了解可能就没有"内容摘要"来的方便了. 这个道理跟上网看博客一样,除了标题,最好再来上一段简介.
从墨脱回来的大野狼
4 年, 7 月前说:
下面对大家的意见一一回复. @仨儿: > 2. 千万别!!这和门户们的浮动广告是同类恶搞的,大家来是看朋友们故事的, > 不是来反复看好好自我演示的,放到帮助中就好 -- 真正的好应用是无法再 > 却除一个功能,真正好网站是让人感觉不到这是别人作的网站--根本就是自 > 个儿心里的网站 ;) 这个对于已登录的用户是完全不可见的.不然我也会被烦死的. ;-) > 4. 这推荐功能真没有感觉到有什么用呢^^强化一下概念? 好看和豆瓣的差异? > 应该有相同的用户间关系的引导? > 另外,要注意智能推荐是在有海量数据积累后才有效的,现在几万用户, > 几百故事的量,应该是无法准确的吧? 是的, 现在的推荐是"编辑推荐",主要针对第一次和每周访问一次的用户. 以后内容多了再说"喜欢这个故事的用户也会喜欢... ..."吧. > 5. 宽屏年代了,还限制展示空间?豆瓣有段时间为了国际化限定 > 成1024 宽,现在还是恢复成 1024的最小宽,自动适应,可以充分利用客房端暩面积的! 怪我没有解释清楚. 最窄880,最宽1240. 所以是自适应的. 但是如果太宽就不好排版了.
从墨脱回来的大野狼
4 年, 7 月前说:
@万清 > 做法可以参照下多拍网(http://www.dpdp.net/)对单个图片的描述方法。 仔细研究了一下,他们的界面设计可真是漂亮,很眩! 我尤其喜欢他们的自动播放功能. 多谢推荐. > 2、首面的两级导航主次不分明,而且二级导航看样子还是固定的, 其实不是二级导航,主要问题是一个介绍性的flash没有做出来. > 当然也可以是”精彩故事“,”精彩活动“,”精彩图片“放置在首页。 > 右上“看好薄新闻”处这个空间很宝贵,我觉得你们应该考虑下怎样加 > 以更有效的利用。我觉得可能以将文字压缩到两行,而加入一个图片框, > 而内容,就可能以放上官方的活动,或是官方产品宣传。 是个好主意. 有些"推荐活动"的确应该拉到首页上. 这块内容怎样表达是需要我们好好想想. |
故事列表 故事列表页面主要的变化来自于左侧的导航条. 与现有的顶部导航不同, 现在将分类和各种过滤条件做到左侧导航上. 主要目标就是做到简单, 一目了然.
这里细心的用户也许能看出来, 每个故事照片有一个边框. 现在还有一个小问题:下边框和图之间莫名其妙的出现一条白边. 这个问题还需要解决.
仨儿
4 年, 7 月前说:
有关列表的意见同俺对首页的意见,有关框的问题,参考各种主流 像册的作法,默认都是没有的,只是给用户选择样式时提供, 根据豆瓣的运营经验,页面HTML代码的体积越小,用户体验越可能好;)
为七个月而努力的万清
4 年, 7 月前说:
这一页和首页一样,内容描述太多了,而故事的个数就会少。没必要。估计一个页面才放了十个故事的样子,大概三屏多吧。我刚刚看了看YOUKU的新版页面,也刚好三屏的样子。而且也是封面加简单描述。在描述上应该只列用户最心的一些参数。如: 作者 发布日期 点击 图片张数等。 另外导航在这里也变样子了。尽量保持各级页面导航一致。 左边导航我喜欢。有点像Youku的风格。 |
照片列表 照片页面仍然保留以前的单张照片特点, 只显示名字. 添加了阴影效果, 但是仍然受到底部白边问题的困扰.
今天在于"清风"的聊天中我们发现了比较容易支持手机上传的方法, 在最近会考虑添加这个功能. 如果你非常需要这个功能, 请在评论中"占个座", 我们到时候会考虑邀请你进行一些早期实验.
仨儿
4 年, 7 月前说:
俺的意见是尽量减少人为的对照片的修饰! 节省带要从一开始作起!!!另外对列表: 1. 选单最好移动到右边,将注意力第一顺位的金左边,留给内容! 2. 每行照片可以小点,多点 3. 可以针对行进行间杂的底色变化,帮助用户定位照片, 更好的设计是阶梯样的非常淡的行底色变化,暗示页面将结束...
为七个月而努力的万清
4 年, 7 月前说:
阴影可以不设置,而就用“日”字形的表格,上面放图,下面给描述,再将整个格子加入淡色背影,区分下域名就行了。其实这个页面的设置,在前面两个页面上也可以这样设置,图的数量和描述,这样就能体持很统一的风格了。
从墨脱回来的大野狼
4 年, 7 月前说:
> 3. 可以针对行进行间杂的底色变化,帮助用户定位照片,> 更好的设计是阶梯样的非常淡的行底色变化,暗示页面将结束... 仨儿, 俺的想象力有问题. 能给些例子吗? |
帮助 - 招聘启事 新的帮助页面采用类似的
* 左侧导航 * 中间显示主要信息 * 右边显示"上下文相关信息". 我的浏览器用的是微软雅黑字体,宋体显示起来会稍有不同.
仨儿
4 年, 7 月前说:
个人强调的原则是,一定要将 注意力第一顺位的金左边留给内容!3竖栏的布局只有门户网站为广告才会预留成这样儿的! 就右边的功能区堆积好了! 其实帮助文本中恰当的链接比目录要有用的多! 以上!完成所有意见的作业 ;) |
你会感兴趣的其他故事 |
|||
| 更多 | |||



故事模式 |













->1. 头部尽量精小,比现在的还要高的话,浪费面积,给人非常急于展示自个儿logo 的感觉呢
->2. 千万别!!这和门户们的浮动广告是同类恶搞的,大家来是看朋友们故事的,不是来反复看好好自我演示的,放到帮助中就好 -- 真正的好应用是无法再却除一个功能,真正好网站是让人感觉不到这是别人作的网站--根本就是自个儿心里的网站 ;)
->3. 故事是由照片和语音组成的,不是文字,大家在认同这是好故事前不会对下蛋的鸡感兴趣的,
列表部分尽量精简,作者的信息也越少越好! 在展示页面丰富就好了,这样也减少查询的表个数哪;
->4. 这推荐功能真没有感觉到有什么用呢^^强化一下概念? 好看和豆瓣的差异? 应该有相同的用户间关系的引导?
另外,要注意智能推荐是在有海量数据积累后才有效的,现在几万用户,几百故事的量,应该是无法准确的吧?
->5. 宽屏年代了,还限制展示空间?豆瓣有段时间为了国际化限定成1024 宽,现在还是恢复成 1024的最小宽,自动适应,可以充分利用客房端暩面积的!