几何

双十一大促不断再创新高的同时,这背后,也意味着“运维”、“监控”、“快速扩容”等能力的展现。双十一大屏是指挥官、战区负责人和一线小二的“指挥参谋”;今年共计产出「34」个大屏,其中彩蛋屏5个,”芝麻开门”15个。并通过创新式的“千人千面”能力,有效提升指挥官们的并行决策效率,通过数字化智能化的方式充分提升“人与人”和“人与机”之间的协作;为大促的指挥作战提供了快速、准确、清晰、全面的支撑。

 

01 作战大屏场景特征分析

上文中我们介绍了双十一过程中,整个体验设计的完整流程。从需求到调研再到设计产出,完整的讲述了我们遇到的困难和问题又如何解决的。实际上,我们在整个项目过程中的人力资源非常有限,从916KO起,共投入2人(包含1名实习生)在1个多月的时间内支撑了整个最终产出30+大屏的需求量。这要从监控场景的大屏需求特点说起。

我将这种场景的特征用三个字概括多、快、稳:

1)多:指挥中心要了解每个作战环节的稳定性。上文中提到,指挥者要抓的是核心指标,全局掌控的感觉。然而阿里经济体的作战就像一艘飞船的运行,每个环节都有可能出现问题。而作战大屏就是指挥中心和分作战室之间的数据桥梁。

2)快:作战大屏不论从需求、设计还是开发角度来讲都是一种“预动作”,我们通过需求沟通,调研等方式了解作战当天可能会看哪些内容。但有些问题是所有人都没有预判到的,这个时候就会产生突发的需求。

3)稳:整个大屏全部都是实时数据接口,秒级数据延迟小于等于3s。在精确的数据展示需求下,还需要承受海量数据对系统的压力,对大屏的压力。尤其0点后的黄金时段,每1s的延迟在那一刻都被放大。

尽管要求如此,但资源却有限,不仅仅在人力上,硬件也如此。如何在有限的条件下,支撑并具备这样的能力?

 

02 用设计解决问题

设计人力集中输出

能够支撑双十一大量的紧急设计需求,并不是一时的能力突破,而是多年来设计和前端同学在基础物料的积累,元件及规范的沉淀提炼并将这些能力产品化的结果。

当配合平台化工具,我们对于大量的优先级不高的需求,采取中台和生态配合的方式来解决。设计师先就核心需求产出设计方案,待定稿后,梳理出主题包交付前端。前端将新的主题包维护到DOA,并评估设计方案中有哪些DOA未覆盖的图表元件并进行开发。

如此一来,业务方仅需要在DOA中使用已经配好的主题包,根据各自的展示需求使用元件进行搭建。

设计师通过DOA统一视觉层输出,集中走查、管理和规范样式。双十一期间,我们和业务方同学以此方案产出了10+页面。配合“芝麻开门”大屏展示切换交互方案实现了分作战和指挥中心的数据桥梁。

 

用创意解决硬件资源问题

光明顶的硬件资源有限,我们根据屏幕分辨率、设计方案划分信号源。其中每个信号源对应一台机器,机器分为输出2K4K两种,当然4K的机器在色彩还原和清晰度上更好,资源也更有限。

硬件资源的限制直接影响大屏的展示内容,在展示空间有限的前提下如何承载多变的需求和覆盖整个经济体的监控内容?我们选择最中心的信号源做内容扩展设计,但这个扩展方案“依势而建”,不破坏原有结构和内容。

指挥者通过移动端设备控制大屏扩展区域的开、关,以及展示哪个内容。

 

03 结果与展望

总的来说,今年投入总设计人力比去年减少了40%,但支持的大屏数量却是去年的一倍。这些都是依赖于我们日常对于监控场景中台化的积累,以及生态圈业务方的共建,以此,达到较好的设计提效赋能效果。但对于未来面向世行,我们还需要做更多的场景化提炼工作以及体系化的建设。

感谢所有为大屏提供数据的同学,感谢集团监控sunfire团队、支付宝监控 团队、数据业务平台GMV数据系统对数据保障,感谢项目组所有成员的高效协作。

项目组所有PD、设计、前端同学从左至右:子奂、鹿梦、屿童、文狄、嗷嗷、戴恩、弋南、汉英、徐跃、业枫

 

原文地址:TXD技术体验设计(公众号)

作者:高超

 

转载请注明:学UI网 » 2019双11技术大屏(下) 光明顶监控大屏设计赋能提效

登录收藏
 
你可能喜欢的:
设计沉思录|美事升级,不止于改版设计沉思录|美事升级,不止于改版
漫画内容设计之专题三板斧漫画内容设计之专题三板斧
案例:如何优雅地用卡片分类法,搞定烦人的用户需求???案例:如何优雅地用卡片分类法,搞定烦人的用户需求???
造物节品牌设计全过程造物节品牌设计全过程
设计师正在参与的战争——争抢用户注意力设计师正在参与的战争——争抢用户注意力
数据可视化设计经验分享,城市GDP大屏案例【进阶篇】数据可视化设计经验分享,城市GDP大屏案例【进阶篇】
2019双11技术大屏(上) 体验设计全流程2019双11技术大屏(上) 体验设计全流程
设计沉思录|这一次,我们尝试设计了仪式感设计沉思录|这一次,我们尝试设计了仪式感
设计沉思录|设计师应该了解的响应式知识设计沉思录|设计师应该了解的响应式知识
减少认知过载获得更好的用户体验减少认知过载获得更好的用户体验