可视化大屏原型图解决方案附axure可视化组件库

现在越来越多的数据展示方式采用了可视化大屏的策略,对数据项进行图表或者动态的展示。在没有产品原型的情况下,怎么制作一个简易的原型呢?

这里提供三种方式制作简易demo:

第一种:原生html+js实现(适合有开发经验的上手)

cdn方式引入echarts等第三方库,制作简易的demo。

我们可以先从gitee上搜索一下可视化,大屏等关键字,找到一些案例后进行运行。(一般的原生案例都会预留一个index.html的入口)
可视化大屏原型图解决方案附axure可视化组件库_第1张图片
有前端开发经验的程序员可以很快的熟悉 这种demo的模式,在代码中修改需要自定义部分后可以很迅速的输出一个demo。

适用于: 与案例较为类似 且改动较小的工程
优势: 有浏览器的地方就可以运行你的demo ,无需下载原型软件等

第二种:第三方可视化制作原型

可视化大屏原型图解决方案附axure可视化组件库_第2张图片

几乎可以囊括常用的可视化组件和更为简单友好的交互方式,而越好的东西越是不免费!所以这也就是大多数人望而却步的地方,我只要做一个小小demo还要冲几百的会员? oh no!

推荐一个AVUE-DATA:目测免费

https://data.avuejs.com/

可以支持导出图片和文件,但是有些鼠标的触发很奇妙,容易出现丢失焦点甚至卡死等问题,毕竟不是本地起的软件,线上化的它需要网络,硬件等更多的要求。当然也有可能是博主自身的原因!不吹不黑!

所以做到一半卡死需要重新开始也不是不可能的事情了!博主最惨的一次应该是做到马上结束添加一个省市区的地图控件的时候,卡死了…

适用于: 没有前端开发经验且没有axure开发经验
优势: 良好的交互体验(不出现其bug及其他特殊情况的条件下),快捷的导出图片或者截图

第三种:axure 制作原型

最后一种就是产品同事常用的方法了,专业的原型软件来制作。

首先你需要一个Axure的软件:
在这里插入图片描述
当然前提你得会用,这里分享几个可视化常用的可视化 axure组件库
在这里插入图片描述

优势这里自然不用多说了,高度的定制化,细致的单元把控:
可视化大屏原型图解决方案附axure可视化组件库_第3张图片
可视化大屏原型图解决方案附axure可视化组件库_第4张图片

但是劣势也是相对于前两者来说的,首先你得会用。如果有需要这些包,可以去我的下载频道下载,或者联系我。

你可能感兴趣的