加入收藏 | 设为首页 | 会员中心 | 我要投稿 源码网 (https://www.900php.com/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 运营中心 > 产品 > 正文

以优酷直播项目为例,谈产品初期如何进行结构框架层设计

发布时间:2017-02-09 06:30:00 所属栏目:产品 来源:优酷土豆用户体验设计中心
导读:副标题#e# 从美女游戏主播到素人直播,再到大型的科技产品发布会,直播作为另一种视频媒介和人的互动方式,掀起了新的浪潮。 传统视频媒体自然要赶上直播的大潮,有幸的是,在这次的优酷直播项目中,设计师从单纯的执行设计,变成发起创意、制作demo、将产

在直播的未来,有越来越多的新玩法新功能,我们还是会根据新的功能是属于哪个页面层级,属于哪类同质规则的卡片,把它放在对应的位置。

以优酷直播项目为例,谈产品初期如何进行结构框架层设计

2-2. 架构的可拓展性——全屏架构

视频播放场景下,全屏横屏的架构需要一起考虑。

用户从默认的竖屏半屏,主动切换到横屏全屏,为的是更好的观看体验。常规的点播播放器的操作是在观看默认5秒之后,视频上的操作元素都主动消失;而直播的实时互动又要求元素的直接露出,方便观众快速参与到实时互动里。

以优酷直播项目为例,谈产品初期如何进行结构框架层设计

这样,摆在设计师面前的矛盾就是:

操作元素露出,影响观看;但是不露出,需要实时互动的时候,又不方便用户快速的参与互动。

以优酷直播项目为例,谈产品初期如何进行结构框架层设计

例如天猫双十一晚会的“跨屏抢星衣”- 志玲姐姐把show服一丢,观看者通过屏幕外的互动操作进行抢取。如果互动按钮在沉浸式观看的时候隐藏掉了,那么当主持人口播的那一瞬间,用户需要:1.点击屏幕,唤起按钮;2.找到互动按钮;3.参与到实时互动中。这样过于隐藏的交互显然是不合适的,等到用户参与其中,可能志玲姐姐的衣服已经掉到别人的口袋里面了。

所以,当互动元素碰撞上传统的视频操作按钮,设计师要如何协调呢?

思考横屏架构的时候,设计师先保障常态下的体验,再反推用户进入的默认页,从逆向的思维去做了设计尝试。

以优酷直播项目为例,谈产品初期如何进行结构框架层设计

大的思路确定后,把设计方案在设计团队内部一起再让小伙伴提意见。

大家提出更高的要求:能否对视频观看区的遮挡再降低一点?

如下图,就是在得到设计团队小伙伴建议之后的最终方案。

既决了之前的问题,空间的节省做到了,然后功能不消失的情况下,遮挡的感觉也比较少了。

以优酷直播项目为例,谈产品初期如何进行结构框架层设计

那全屏是不是需要把半屏的所有要素都搬过来呢?

对于功能在不同屏幕状态的取舍,从一开始通过屏幕大小来确定功能元素,到从“横竖屏的用户/产品目的”,来决定功能元素,打破多屏分割的设计思路,让设计方案更加有理有据。

竖屏,互动不遮挡播放器。可以多一些热度信息来增加直播的气氛和现场感;

横屏,互动元素遮挡播放器。需要实时互动的元素保留,其他操作性元素消失;减少对观看造成干扰的元素(和竖屏相比,适当的减少氛围类元素);并且增加清屏功能,为希望沉浸式观看的用户提供选择。

卡片的灵活性和卡片运用的规则设定,横竖屏页面的不同侧重决定了页面的元素布局,这就解决了“从零开始设计,现在想未来,架构上如何满足后续的可拓展性?”

以优酷直播项目为例,谈产品初期如何进行结构框架层设计

以优酷直播项目为例,谈产品初期如何进行结构框架层设计

以上,是设计师在产品的初期,对结构架构的思考总结。

这些,还在坚持和验证

在产品初期的路径架构设计阶段,我们坚持自己的设计原则,同时也在时时刻刻的和大家讨论用户的操作习惯,界面元素的识别性和易用性,在思考不同的端的设计侧重又是什么,也在尝试通过数据和用研维度来不断的给设计做验证,同时也意识到我们还有很多事情来不及做。

主导意味着肩上的责任越大。设计师在项目中的主导性提升了,带来的挑战和质疑声也增多了。

作者:大郁郁

来源: 公众号 优酷土豆用户体验设计中心

(编辑:源码网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

热点阅读