从零开始设计数据大屏—基于Vue

从零开始设计数据大屏—基于 Vue 为什么要做数据大屏？ 现如今的大数据逐渐发挥出了它的力量，并无形的改变着我们的生活。但大数据在不是从事技术开发的人来说没有很明显的感受，很多人对大数据的概念只是停留在每年网易云音乐对个人听歌的汇总上、知乎 20XX 年解锁的知识成就、微信新年的个人社交分析、支付宝的年终账单等。其迫切的需要通过一些媒介展现数据的威力，而数据大屏作为大数据展示媒介的一种，广泛运用于各种展示厅、会展、发布会及各种狂欢节中，其中不乏一些通用的处理方案：阿里巴巴集团的 DataV 产品。其大屏有多种主题，提供多种模版，设计的非常的震撼，DataV 也用于展现历年双十一的盛况。 而公司的大数据工作组就需要通过数据大屏展示一些处理过后有价值的信息，因此需求孕育而生。下面的截图是产品迭代四次之后在公司大屏展示厅的照片，第五次迭代还在开发中。 用 Vue 做基础的框架是不是合适？ 绝对合适，就现在运用的情况来说，Vue 适合 95%的网页应用开发，几乎任何的网页应用 Vue 都有对应的解决方案，而且开发效率极高，甚至由于它组件化的特性，尤其适合完成一些需求不明确、需求在应用开发的过程中一直会发生变化、需要快速迭代出一个新版本的开发。而最终参加制作的产品就是一个在需求不明确的情况下慢慢变成一个产品的。 程序员如何产生想法再落实到实际开发？ 众所周知，程序员是码代码的，而设计产品不是程序员的强项，很不巧的是我就是那个码代码，不太会设计的程序员，但通过一些诀窍，还是能够设计出一款不错的大屏应用的。下面就来介绍一下里面的一些技巧，这些技巧其实还适用于其他的产品设计。 数据大屏设计归根结底就是一个在极端宽阔的屏幕上做应用的开发，因此大屏设计往往强调的是大数据迸发的一瞬间大量的数据信息通过一定的可视化形式瞬间冲入脑海的惊艳感。让人感觉数据距离大家不是这么的遥远，而给人一种触手可及的感觉。 数据大屏的设计其实是有诀窍的，掌握了一些诀窍，在知道了公司大数据组大概需要展示哪些内容之后，不需要 UI，程序员自己也能配合产品经理、企划部和 DBA完成一个数据大屏产品的设计。 步骤分为 确定基色->寻找灵感->思考实施->作出第一个原型->再次了解需求->多次修改产品->优化细节 后面的步骤需要循环多次，归根结底就是一个典型的需求不明确快速迭代的原型开发。 确定基色和寻找灵感 确定基色不是很难，由于是大屏，采纳深色做背景，最重要...