如何做好F10的数据可视化

原则:不解决问题的可视化不是真正的可视化。用户想从F10获取什么信息?

注意:F10的数据可视化的关键因素在于业务、数据分析和设计,不在于实现,因此重心要放在这里。

F10的可视化想要解决用户什么问题

F10有大量的公司财务数据,而非专业人员在查看这些财务数据的时候,是很吃力的,包括概念难以理解、难以从数据中发现规律和逻辑、难以得出结论辅助自己决策等等。

所以我们对于F10的可视化目的,应该定义为:提升用户获取信息的效率。

还缺少一个分析点:使用F10的都是什么用户?高手还是小白呢?这个下周找张智讨论下,因为这个决定了是否可以在F10中加入可视分析的功能。

F10适合的可视化方向

基于上一步的目的分析,那么就很容易得出F10可视化的最终表现形式了:信息可视化。

关键因素

业务逻辑-有用

这是最最重要的,产品经理给出稿子后,我们要仔细思考下,是否将业务逻辑讲清楚了?

如果这一步没做好,后面的全部白搭。

设计效果-好看

这一步的关键,在于设计师是否能想到和业务匹配的效果。

生产模型

我们现在做可视化都是走野路子,也就是拍脑袋,想到啥做啥。这样产出的质量和效率都不可控,不具备持续性,肯定是不行的。因此我们需要制定一个生产模型,让大部分的F10数据都可以通过这个模型,快速转化为质量在一定水平线之上的可视化。

可以基于我们的那个设计思维导图,制定一个生产流程:

  • 业务分类
  • 数据分类
  • 设计思维导图
  • 技术实现

F10就短视频生成工具,可视化编辑短视频逻辑,把叙事可视化搞定

前期就定制化,比如并购重组,直接定制

后期考虑工具化,在平台生成逻辑和内容

后面就是不断接入数据就可以了

这样应该是最好的模式,这套模式可以应用在很多场景,也符合用户接受信息的趋势:短视频

这个可以当成短视频明年的规划,好好规划下这个内容,提前写好PPT。

反向推导

根据我们现有的能力,反向推导可以应用的业务

比如我们有词云,那是不是可以在热榜之类的地方用上去?

比如我们有短视频,那是不是可以在公司介绍用上去?

可以通过一些Demo网站找找灵感:

https://echarts.apache.org/examples/zh/index.html

https://vega.github.io/vega/examples/

https://observablehq.com/

别局限于某个组件库,反正是在PC上用,不管黑猫白猫,能做出来好效果的就是好猫。

我们基于现在的组件库,给出具体配置即可。

根据设计原则,反向推导可以应用的业务

我们应该根据可视化设计原则的图,去思考如何做动态可视化

工具&技术储备

数据特性分析工具

有没有自动分析数据特性的工具?把数据扔进去,再加上人工辅助输入没库底,就可以得到特性和最合适的可视化选型方案?

业务模型数据库

可视化呈现方式数据库

可编程的动画引擎库

lottie不大适合,这是固定模式的动画。

可视化搭建动画系统?薛成武的可视化搭建动画逻辑?

或者还是我们得把D3.js玩得特别熟练才行。

PPT制作动画Demo?

或者琦哥用来做PPT的那个软件?

手绘风格的可视化组件库

支持TS:https://github.com/beizhedenglong/rough-charts

https://github.com/timqian/chart.xkcd

参考资料

B站搜索信息可视化

经济机器是怎么运行的:
https://www.bilibili.com/video/BV1X4411U76y?from=search&seid=13422940104462308875&spm_id_from=333.337.0.0

隆基股份:光伏行业的茅台,全球最大单晶硅制造商,首家市值破2000亿企业!
https://www.bilibili.com/video/BV1Sz4y1d7yY?from=search&seid=6040631110450177102&spm_id_from=333.337.0.0

反垄断,砍培训,背后是影响每个人未来的大棋局!
https://b23.tv/8qWmnC

大众三元锂电池是如何制造的:

https://www.bilibili.com/video/BV1oi4y1T759

探月计划:

https://www.bilibili.com/video/BV15b4y1h7Es/?spm_id_from=333.788.videocard.5

桃源县刺绣信息可视化设计h5动效视频:

https://www.bilibili.com/video/BV1WB4y1c7YD?from=search&seid=3445543504406028420&spm_id_from=333.337.0.0