提交需求
赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!
天天说设计驱动产品,让世界更美好......然鹅,现实是产品驱完,开发驱,开发驱完测试驱......
设计呢?改改改。
设计驱动产品,可先从小处着手,去完善小功能,逐步推进。
接下来是工作上关于设计推动产品的过程分享,希望对大家有点启发,给点建议。
背景:
WPS画报旨在给用户打造一个优质的内容平台,启动后充当屏保,保护用户隐私,此外,作为美图平台,供用户欣赏大量优质图片,逐渐往内容消费社区方向发展的平台,提高内容质量,在增加多渠道运营的情况下,优化现有的焦点图运营入口。
首先
我在后台翻了下关于焦点的用户反馈:
(不同背景不一样颜色??????就不怕被开发哥哥打死?)
比较突出的问题是
杂乱
看不清
于是我打开了画报,确实像用户反馈说的那样,文字跟图片叠在一起看着乱,阅读起来也吃力,都没心思看下去了;运营姐姐也诉苦说焦点文字编辑限制多,任有天大的脑洞也无处可施。
Emm......
怎样才能让用户在各种图片上阅读文章时有良好的阅读体验呢?
带着这个想法,决定试着在不改变功能架构下从视觉的角度去解决这个问题,推动产品的优化。(驱动!驱动!)
然后,列个问题:
(1)阅读体验差:展开文字排版乱、不清晰、提示不明确
(2)运营模式少:只能插入文字图片,不能编辑
(3)外链乱:单一外链模式,链接不明显
(4)后台录入限制大:不能对文字进行段落编辑
通过查阅一些无障碍设计和竞品分析,总结出以下几个优化方向:
(1)增加焦点标题,提高焦点交互率,
(2)调整文字展示结构,区分概述、正文排版
(3)改白底黑字
1、增加焦点标题,提高焦点交互率:
原焦点未做交互前只是一小圆点,虽有呼吸灯动效,但若图片内容过于含蓄,就会错过运营姐姐辛苦码出的有趣小故事还有甲方爸爸给你发的红(guang)包(gao)链接了!
加小标题后,能第一时间让用户知道焦点的内容曝光,增加运营的玩法,刺激交互率,同时为了减少对图片的观感,标题限制在10个字符以内。
改版上线后(8月第1周灰度上线),点击焦点UV从平均10w,焦点点击率2.4%(截止7月第4周数据),上升到平均焦点UV 22w,点击率4.8%(数据取于8月第四周全量发布后)。
2、调整文字展示结构,区分概述、正文排版:
旧版:文字样式多,常用的正文部分反而不明显,层次混乱,
新版:
(1)使用16px的正文字号
为有更好的体验,让目前主流的尺寸和分辨率的设备有更好的浏览体验,减少之前字号样式,增大至16px,wps用户使用的显示设备种类较多,为适应低分辨率的设备,根据不同屏幕比例做响应式来调整字号大小。
(2)保证文本易读性和可控性
让用户去选择能一下子看完的3行60个字符以内的文字概述,如感兴趣就可查看更加详细(但不超过300字)的文章。
(3)使用字号的1.5行高
3、改白底黑字
从生理层面上,之前的版本是黑底白字,侧抑制的现象会使聚焦的白色字体变得更加炫目,视觉刺激强烈,但长时间会产生视觉疲劳感,跟运营姐姐了解过,未来想要在文字内容方面做更多的尝试。白底黑字因侧抑制的现象,聚焦不反射光的黑色字体时,视觉刺激并不强烈,所以长时间阅读造成的视觉疲劳感较弱,也更符合人类长期以来的阅读习惯。
从产品特性上,这些文字会出现在多种复杂图片上,白色能更多地cover到大部分的情况。
按照上述的改动,实现并运用到了6.1的版本中,以下是改版前后的对照:
前:
后:
写在最后:
这是我在工作中的一点小尝试,也很感激老大给了我这个机会,试着从不同的角度去优化产品,更加广度地去思考设计,而不单是直接做产品的需求,设计在一个产品发展中也是很重要的,这个也是我码的第一个总结文章,希望以后继续加油哟,一起努力~!
参考资料:
Web Content Accessibility Guidelines (WCAG) 2.1
大牛,别默默的看了,快登录帮我点评一下吧!:)
登录 立即注册