端数据可视化插件大盘点 图表/图谱/地图/关系图全有
在大数据时代,很多时候我们需要在网页中显示数据统计报表,从而能很直观地了解数据的走向,开发人员很多时候需要使用图表来表现一些数据。随着Web技术的发展,从传统只能依靠于flash、IE的vml,各个浏览器尚不统一的svg,到如今规范统一的canvas、svg为代表的html5技术,表现点、线、面要素的技术已经越来越规范成熟。我把前端数据可视化分为了五种:
1.图表
2.图谱
3.地图
4.关系图
5.立体图
我将按照顺序介绍62款前端可视化插件,下面就分享下34款图表插件:
1.amcharts
url: http://www.amcharts.com/
browser:IE6+、chrome、safari、firefox、opear
resume:amCharts是一种先进的图表库,将适合任何数据可视化的需要。图表解决方案包括柱、栏、线、区域,一步,一步没有冒口,平滑线,烛台,OHLC,馅饼/甜甜圈,雷达/极地,XY /分散/泡沫,子弹,漏斗/金字塔图以及指标。
2.awesomechartjs
url:http://cyberpython.github.io/AwesomeChartJS/
github:https://github.com/cyberpython/AwesomeChartJS
browser:现代浏览器
resume:AwesomeChartJS是一个简单的Javascript库,可用于创建图表基于HTML 5画布元素。
3.axiis
url:http://www.axiis.org/
browser:官方未说明
resume:Axiis框架是一个开源的数据可视化为初学者和专家开发人员设计的。
4.bonsaijs
url:http://bonsaijs.org/
github:https://github.com/uxebu/bonsai
browser:IE9+、chrome20+、safari5+、firefox18+、opear12+
resume:用于创建图形和动画的js库
5.canvasjs
url:http://canvasjs.com
browser:官方未说明
resume:一个使用HTML5、JavaScript创建图表在画布上,图表包括几个好看的主题和10倍的速度比传统的基于Flash / SVG库——导致轻量级的,美丽的和响应指示板。收费
6.canvasxpress
url:http://canvasxpress.org/
browser:Firefox 1.5+, Opera 9+, Safari 3.x+, Chrome 1.0+, IE 6+
resume:CanvasXpress是一个独立的Javascript编写的图形库,支持所有主流浏览器中计算机和移动设备。
7.chartist
url:http://gionkunz.github.io/chartist-js/
github:https://github.com/gionkunz/chartist-js
browser:Firefox, Chrome, Safari, Opera, IE9+
resume:绘制多种图形的库
8.chartjs
url:http://www.chartjs.org/
github:https://github.com/nnnick/Chart.js
browser:IE9+、chrome、safari、firefox、opear、部分支持IE7/8
resume:chartjs是一个可以绘制多种图表的库,使用了html5的canvas技术
9.chartkick
url:http://ankane.github.io/chartkick/
github:https://github.com/ankane/chartkick
browser:IE6+、chrome、safari、firefox、opear
resume:chartkick是一个依赖于ruby的绘制图表的js库,在Python中也可以使用
10.DataWrapper
url:https://datawrapper.de/
github:https://github.com/datawrapper/datawrapper
browser:支持大部分浏览器
resume:Datawrapper完全免费,开源。您可以使用他们的免费主机服务,或者安装在您自己的服务器上。Datawrapper用PHP编写,非常易于安装、修改和拓展。可以绘制。但是DataWrapper是生成图表后嵌入到站点的。
11.dataset
url:http://misoproject.com/dataset/
github:https://github.com/misoproject/dataset
browser:官方未说明
resume:dataset是一个JavaScript客户端数据转换和管理库。数据集管理客户端数据简单处理加载、解析、排序、查询和操纵来自各种数据源的数据。
12.dc
url:http://dc-js.github.io/dc.js/
github:https://github.com/dc-js/dc.js
browser:官方未说明
resume:专门为探索大型、多维数据集而进行优化的库
13.dygraphs
url:http://dygraphs.com/
browser:IE8+、chrome、safari、firefox、opear
resume:dygraphs是一种快速、灵活的开源JavaScript库图表。
14.echart
url:http://echarts.baidu.com/index.html
github:https://github.com/ecomfe/echarts
browser:IE9+、chrome、safari、firefox、opear
resume:基于Canvas,纯Javascript图表库,提供直观,生动,可交互,可个性化定制的数据可视化图表。创新的拖拽重计算、数据视图、值域漫游等特性大大增强了用户体验,赋予了用户对数据进行挖掘、整合的能力。
15.flotr2
url:http://www.humblesoftware.com/flotr2/
github:https://github.com/HumbleSoftware/Flotr2
browser:FF, Chrome, IE6+, Android, iOS
resume:Flotr2是HTML5画图表和图形库。可以绘制线图、条图、蜡状图、饼图、气泡图
16.Flot
url:http://www.flotcharts.org/
browser:Internet Explorer 6+, Chrome, Firefox 2+, Safari 3+ and Opera 9.5+
resume:一个基于jQuery的绘图库,可以绘制折线、散点、条形、饼状图
17.fusioncharts
url:http://www.fusioncharts.com/
browser:IE6+、chrome、safari、firefox、opear
resume:一个专门用来绘制图表的库,可以绘制90多种图表,但是收费
18.graphael
url:http://g.raphaeljs.com/
browser:Firefox 3.0+, Safari 3.0+, Opera 9.5+ and Internet Explorer 6.0+
resume:可以绘制各种图表的插件,而且非常简单灵活
19.highchart
url:http://www.highcharts.com/
github:https://github.com/highslide-software/highcharts.com/
browser:支持各种设备,ie6+
resume:在高版本浏览器中使用SVG,而在旧版本IE(包括IE6及更新版本)中使用后备的VML。有自己的团队负责,但是只对非商业用途免费,可以绘制 line, spline, area, areaspline, column, bar, pie, scatter, angular gauges, arearange, areasplinerange, columnrange, bubble, box plot, error bars, funnel, waterfall and polar chart types
20.humble Finance
url:http://www.humblesoftware.com/finance/index
browser:FireFox, Safari, Chromium, or IE6+
resume:HumbleFinance是一个HTML5数据可视化工具类似于Flash工具,完全是用JavaScript编写的工具使用原型和Flotr库。
21.ichartjs
url:http://www.ichartjs.com/
github:https://github.com/wanghetommy/ichartjs
browser:IE9+、chrome、safari、firefox、opear
resume:ichartjs 是一款基于HTML5的图形库。使用纯javascript语言, 利用HTML5的canvas标签绘制各式图形。 ichartjs致力于为您的应用提供简单、直观、可交互的体验级图表组件。ichartjs目前支持饼图、环形图、折线图、面积图、柱形图、条形图。
22.icharts
url:http://www.icharts.net/
browser:官方未说明
resume:iCharts免费版本提供了一些基本的交互式图表样式,如果更使用高级的样式,则需要购买高级版本。
23.JavaScript InfoVis Toolkit
url:http://philogb.github.io/jit/
github:https://github.com/philogb/jit
browser:官方未给出具体版本
resume:JavaScript InfoVis Toolkit可以动态绘制各种图形,提供了一些预设的样式可用于展示不同的数据
24.jqplot
url:http://www.jqplot.com/
browser:IE 7+, Firefox, Safari, and Opera
resume:基于jQuery的绘图插件,可以绘制折线、条形、散点、饼状图
25.jscharts
url:http://www.jscharts.com/
browser:Firefox 1.5 +,Chrome 10 +,Internet Explorer 8 +,Safari 3.1 +,Opera 9 +
resume:jscharts是一个基于JavaScript的图表生成器,需要很少或根本没有编码。jscharts绘制图表是一个简单和容易的任务,因为您只需要使用客户端脚本(即由web浏览器)。不需要额外的插件或服务器模块。就包括我们的脚本,准备你的图表数据XML、JSON或JavaScript数组和你的表已经准备好了!允许您创建图柱状图,饼图或简单的线条图。收费但是有免费版本。
26.kendo-ui
url:http://www.telerik.com/kendo-ui
github:https://github.com/telerik/kendo-ui-core
browser:现代浏览器
resume:http://www.cnblogs.com/xiyangbaixue/p/3951297.html
27.nvd3
url:http://nvd3.org/
github:https://github.com/novus/nvd3
browser:Chrome,Firefox, Opera, Safari and Internet Explorer 10
resume:d3图表库
28.pizza-pie-charts
url:http://zurb.com/playground/pizza-pie-charts
github:https://github.com/zurb/pizza
browser:官方未说明
resume:主要用来生成饼状图的库
29.protovis
url:http://mbostock.github.io/protovis/
github:https://github.com/mbostock/protovis
browser:现代浏览器
resume:Protovis组成自定义视图的数据用简单的标志如酒吧和点。与低级图形库,迅速成为可视化乏味,Protovis定义是通过编码数据的动态属性,允许继承,尺度和layoutsto简化施工。
30.Peity
url:http://benpickles.github.io/peity/
browser:Chrome, Firefox, IE9+, Opera, Safari
resume:可以绘制多种图形,但是都是很小的图形,与jQuery Sparklines相似
31.rgraph
url:http://www.rgraph.net/
browser:现代浏览器
resume:RGraph是一个基于HTML5的开放web图表和图表库。RGraph创建这些图表在web浏览器使用JavaScript,这意味着更快的页面和web服务器负载,导致较小的页面大小和更快的网站。
32.webfx
url:http://webfx.eae.net/
browser:Firefox 1.5, Opera 9 and Internet Explorer 6
resume:支持多种图表的库
33.xcharts
url:http://tenxer.github.io/xcharts/
github:https://github.com/tenXer/xcharts/
browser:现代浏览器
resume:xCharts美丽是一个JavaScript库,用于构建和自定义数据驱动的web使用D3.js图表可视化。使用HTML、CSS和SVG,xCharts被设计成动态、流体、集成和定制。
34.zingchart
url:http://www.zingchart.com/
browser:官方未声明
resume:ZingChart创造惊人的可视化提供了灵活性和资源。提供超过100个图表类型,独特的特性,如缩放和交互式。
小结:
每款插件各有千秋,根据项目需求挑选不同插件。其中比较广泛使用的如echart(百度产品)、highchart等,下面我将分享图谱插件。
9款图谱插件:
1.crossfilter
url:http://square.github.io/crossfilter/
github:https://github.com/square/crossfilter
browser:官方未说明
resume:一个可以操作大型、多元数据集的库,帮助数据分析。
2.d3js
url:http://d3js.org/
github:https://github.com/mbostock/d3
browser:Firefox, Chrome, Safari, Opera, IE9+
resume:D3.js是一个JavaScript库,基于数据操作文档。D3可以帮助你把数据使用HTML、SVG和CSS。D3强调web标准给你完整的现代浏览器的功能没有把自己和一个专有的框架,结合强大的可视化组件和DOM操作的数据驱动的方法。
3.envisionjs
url:http://www.humblesoftware.com/envision/index
github:https://github.com/HumbleSoftware/envisionjs
browser:IE6+、chrome、safari、firefox、opear
resume:envisionjs是一个库来创建快速、动态和交互式可视化的图表
4.jsxgraph
url:http://jsxgraph.uni-bayreuth.de/wp/
github:https://github.com/jsxgraph/jsxgraph
browser:现代浏览器
resume:JSXGraph交互式几何是一个跨浏览器的库,函数绘图,图表和数据可视化在web浏览器中。它完全实现在JavaScript中,不依赖于任何其他库,并使用SVG VML或画布上。
5.paperjs
url:http://paperjs.org/
github:https://github.com/paperjs/paper.js
browser:IE9+,chrome,firefox
resume:paperjs是一款不可多得的js插件,可以绘制各种动态图形效果
6.processingjs
url:http://processingjs.org/
github:https://github.com/processing-js/processing-js/
browser:现代浏览器
resume:processingjs是用Java编写的,所以图形在网页上显示要靠Java程序,使用canvas技术
7.Raphaël
url:http://raphaeljs.com/
github:
browser:Firefox 3.0+, Safari 3.0+, Chrome 5.0+, Opera 9.5+ and Internet Explorer 6.0+.
resume:Raphaël是一款绘制矢量图的插件,支持低版本的浏览器
8.sparklines
url:http://omnipotent.net/jquery.sparkline/#s-about
github:
browser:Firefox 2+, Safari 3+, Opera 9, Chrome and Internet Explorer 6+,ios和andriod设备
resume:使用内嵌在HTML中的数据或通过javascript直接生成微线图(小内联图表),最主要的特点是可以生成波形图。
9.tangle
url:http://worrydream.com/Tangle/
github:
browser:
resume:Tangle是一个JavaScript库,用于创建活性文档。读者可以交互式地探索可能性,玩参数,并立即看到文档更新。Tangle是超级简单,容易学习。
小结:后面将分享6款地图插件。
6款地图插件:
1.Kartograph
url:http://kartograph.org/
github:https://github.com/kartograph/kartograph.py
browser:Internet Explorer 7+,chrome,Firefox
resume:Gregor Aisch开发的一个基于JavaScript和Python的非常炫的、完全使用矢量的库。
2.leafletjs
url:http://leafletjs.com/
github:https://github.com/Leaflet/Leaflet
browser:Chrome,Firefox,Safari 5+,Opera 12+,IE 7–11
resume:leafletjs是一个开源的支持移动端的地图插件,js文件仅仅有33kb,
3.Modest Maps
url:http://modestmaps.com/
github:https://github.com/modestmaps/modestmaps-js
browser:Firefox, Chrome, Opera, iOS, Android, and Internet Explorer 7-9.
resume:Modest Maps支持各种设备,也有很多版本。虽然是一款老的地图插件,但是非常小、可扩展而且免费
4.polymaps
url:http://polymaps.org/
github:https://github.com/simplegeo/polymaps
browser:现代浏览器
resume:Polymaps依赖于SVG,因此在较新的浏览器中表现很好。
5.imagemapster
url:http://www.outsharked.com/imagemapster/
browser:Firefox, Chrome, Safari, Opera, IE6+
resume:ImageMapster是一个jQuery插件,它使你的HTML图片像Flash一样炫
6.datavlab
url:http://datavlab.org/
github:https://github.com/TBEDP/datavjs
browser:IE6+、chrome、safari、firefox、opear
resume:datav.js是为了降低日常对于可视化方法使用的成本,用数据可视化的方法帮助到更多的人。
现在来分享9款关系图插件:
1.arborjs
url:http://arborjs.org/halfviz/#/a-new-hope
github:https://github.com/samizdatco/arbor
browser:IE6+,chrome,firefox
resume:基于jQuery的图谱可视化库,对于高版本的浏览器这个库使用了HTML的canvas元素
2.cubism
url:http://square.github.io/cubism/
github:https://github.com/square/cubism
browser:官方未说明
resume:时间序列数据可视化的D3插件
3.gantti
url:http://bastianallgeier.com/gantti/
github:https://github.com/bastianallgeier/gantti
browser:IE7+、chrome、safari、firefox、opear
resume:是一款PHP的前端数据展示插件
4.getspringy
url:http://getspringy.com/
github:https://github.com/dhotson/springy/
browser:官方未说明
resume:Springy是一个使用JavaScirpt实现的有向图布局算法,使用了真实世界中的一些物理原理,你可以随意拖动图表中的元素。
5.graphdracula
url:http://www.graphdracula.net/
github:https://github.com/strathausen/dracula
browser:官方未说明
resume:graphdracula是一组工具来显示和布局互动图表,以及各种相关算法。
6.sigamajs
url:http://sigmajs.org/
github:https://github.com/jacomyal/sigma.js
browser:IE9+,chrome,firefox
resume:一个非常轻量级的图谱可视化库。Sigma.js很漂亮,速度也快。
7.smoothiecharts
url:http://smoothiecharts.org/
github:https://github.com/joewalnes/smoothie/
browser:IE7+、chrome、safari、firefox、opear
resume:smoothiecharts是一个非常小的图表库为实时流媒体数据而设计的
8.timeplot
url:http://www.simile-widgets.org/timeplot/
github:
browser:官方未说明
resume:Timeplot是基于dhtml AJAXy部件绘图时间序列和覆盖基于时间的事件
9.visjs
url:http://visjs.org/
github:https://github.com/almende/vis/
browser:Chrome, Firefox, Opera, Safari, IE9+
resume:Vis.js是一个动态的、基于浏览器可视化库。库被设计成易于使用,处理大量的动态数据,使操作和交互的数据。时间表,包括组件库数据集网络、Graph2d,Graph3d。
End. 作者:夕阳白雪 via:36大数据 感谢!
了帮助IT从业者职业之路拥有更多收获,在诸多C粉的殷切期待下,由 CTO俱乐部打造的CTO线上讲堂自登场以来获得大家好评。本期邀请兑吧联合创始人兼总裁陈高维带来“工具类、新闻类、视频类等不同类型App的积分体系该如何搭建? ”的主题分享。
欢迎加入CTO讲堂微信群与业界大咖零距离沟通,12月4日本期讲堂报名方式拖至文末查看。
分享嘉宾:兑吧联合创始人/总裁 陈高维
嘉宾简介:陈高维,杭州兑吧网络科技有限公司联合创始人/总裁,连续创业,一直在路上。2008年读研期间创立做象牙塔考研社区,服务全国100多所211、985高校;2012年加入斯凯网络内部创业,担任产品VP主导魔品科技多款核心产品;2014年创立兑吧,首创积分运营管理平台,聚焦提升App用户活跃与留存,基于App积分商城打造了一个全新的体验式精准营销平台。
公司简介:在资本市场不是很乐观的情况下,兑吧网络刚刚完成一轮3000万人民币的A轮融资。兑吧在互联网创业者圈子也算是小有名气,他们的专注App 积分运营,帮助APP提升用户活跃与留存。目前包括百度、凤凰、网易、新浪、暴风、赶集、58、PPTV…等一大批互联网巨头在使用兑吧的服务,同时乐动力、IN、点点养车、大姨吗、遇见….等一大批互联网新贵也在使用兑吧的服务。公司成立于2014年5月,团队成员均来自阿里、斯凯等知名互联网企业,对积分系统、接口管理和数据安全拥有独特的优势。目前已有1200多家App接入了兑吧积分商城,成为移动互联网发展的创新型企业新贵。
以下是11月26日CTO讲堂现场完整速记:
主持人: 今日讲堂时间到~欢迎陈总,麻烦您向大家自我介绍一下。
陈高维:大家好,我是陈高维,兑吧的联合创始人&总裁,很高兴来到CSDN跟大家做一个微信的交流。我跟在坐的有些同学的工作路径可能有一些不同,从学校里开始就一直在创业。先简单的介绍一下之前的几段比较重要的经历:
主持人:看您曾在读研期间就做了社区项目,可否介绍一下,在那一次最初的创业经历中都收获了哪些思考和教训?
陈高维:07、08年的时候 web2.0 还是比较热的创业方向。还没毕业就开始做了一个考研社区的项目,通过知识社区、资讯信息、社交分享把考研人按目标学校、专业汇集起来,然后基于这个平台做考研远程培训、辅导资料的c2c销售平台。
第一次创业经验不足,在团队、管理、融资上没有做好准备的情况下急于复制扩张,没有控制好节奏、把握好服务品质,挺不错的一个学生项目 没有做到预期的目标,现在看来算是交学费了。不过通过这个项目也得了各个方面的挑战和锻炼 ,为后面的项目打下了基础。
主持人:您决定开始兑吧的创业是看到了什么发展机遇么?最初的想法是怎样的?
陈高维:从2010年开始,智能手机开始普及,开始移动互联网创业浪潮。当时智能手机上的的基础服务不够完善。很多细分领域的都有创业机会。建立品牌、获取用户也相对容易。5年过去了,移动互联网的人口红利逐渐消逝,新用户的获取成本也越来越高;提升用户活跃、留存就显的越发重要。提升用户活跃、留存的方法有很多,其中积分体系是提升活跃度最通用、灵活、有效的一种工具。
积分商城真正要发挥活跃用户的作用,就必须保证:友好的体验、丰富而吸引人的奖品、趣味的活动 ,以及持续保持吸引力的内容运营能力。这是一件很有难度的事情。
事实也证明没有几个互联网公司可以真正的把积分提升活跃运营到很好,因为在他们看来这始终是一个功能,而不是一个产品。即使投入了资源,由于专业性、优先级、投入程度的问题往往也是达不到预期的效果。这是互联网公司普遍的痛点,并且会越来越痛。
so,如果我们来做一个专业的积分运营服务平台,把积分商城当作一个互联网产品来对待,投入专业的团队来策划开发、投入专业的团队来整合社会上的奖品资源、投入专业的团队来运营,并且把服务能力以saas服务的方式开放出来,我们相信可以很好的帮助互联网企业解决这个痛点。
于是在经过半年的筹划之后,一家靠谱的、免费的第三方“积分运营服务平台”——兑吧 在2014年7月份上线了了。也比较幸运,在过去1年多时间里,我们的产品和服务得到了广大的互联网公司的认可,目前我们已经有1200+app 在使用我们的服务,并且越来越多的app正在陆续加入这个阵容。
主持人:简单介绍下兑吧目前提供的产品和服务吧。什么是积分商城,积分商城在App中的定位是怎样的?
陈高维:兑吧目前提供的服务内容主要包括两个方面:
(1) 免费提供积分商城系统,提供丰富的模版和自定义功能,帮助移动开发者在APP中快速嵌入我们的h5积分商城。接入这个服务仅仅需要2个工作人日,非常便捷。
举个例子:
(2) 提供丰富的内容与工具
a、兑吧提供数百种免费的奖品资源,包含:各类智能硬件、电影票、化妆品..等实物奖品,也包含各类O2O、免费酒店、免费k歌…等服务奖品,也包含各类:现金劵、vip卡、折扣劵等优惠资源。这些资源都是由各类企业免费赞助。 b、兑吧提供各类实物奖品采购、库存、配送、客服服务,提供各类的虚拟充值基础服务。C、兑吧提供开发的后台,app 运营可以导入自有的实物、虚礼奖品。
积分体系用于提升 App 用户活跃度、粘性,属于辅助运营的手段。一套完善的积分体系,核心就是积分任务和积分消耗出口两个部分。
积分任务就是app的核心运营指标拆解出来的核心动作,比如你希望用户每天登录(签到)、去分享、ugc内容、匿名用户转化成注册用户… 都可以通过一定的方式设计成任务。
培养用户习惯的过程中,积分商城需要承担一个最重要的任务——让用户体会到积分的价值感。简单来说就是让用户清楚自己为什么要去赚积分、能用积分换到一些什么样的东西,这样他才会持续的去做任务,积攒积分。
所以积分商城在 App 的定位应该是:让用户体验到积分价值。
主持人:请谈谈积分商城的运营规则是什么,它是如何提高用户的活跃度和留存率?
陈高维:一个完整的积分体系是包括积分获取和积分消耗两部分。因此积分获取(积分任务)和积分商城(消耗)是两个互相作用的部分,如果要使积分体系发挥作用,那么两部分都需要做到合理的配合。
首先,大家来看看下如何设置积分任务?
以一个阅读类App为例:
上图不一定适合每个 app,但在积分规则的设计上有一个通用的规则,就是拆解你的运营kpi ,把它分解成一些用户的有效行为,然后挑选合适的有效行为为任务。
其次,积分的权重,如何给每个相应的积分埋点,去分配积分?
比如我们日常任务中【签到】,用户每天都可以签到,那少给点积分,每天 5 个;再一点,比如【分享】是一个重要的指标,可以帮我直接提高新增用户,那就可以给用户每次分享 20 个积分。我们可以根据这个规则来进行积分权重的分配,定义每个任务到底应该多少积分。
关于积分价值(汇率)的定义,我们可以根据积分获取的难易程度和相应的积分商城的运营预算进行调整。一般完全新建的积分商城,我们建议积分汇率设置为100积分=1元人民币的汇率。并围绕这个汇率反向去定义积分发放的尺度。
关于积分的安全性,比如说每天设置十个积分任务,也可以做一些上限的约束,单个用户 ID 只能获取 100 积分(设置任务数和积分上限),防止少量用户恶意刷取积分。
最后,如何让用户在积分过程中有强烈的积分价值感?根据我们在运营过程中的经验来看,有两点需要做到:一个是保持商品质量和种类数量,保持奖品的吸引力。奖品的内容要时换常新保持新鲜度,如能能结合当下热点,那是最好;二是保证合适的参与门槛与趣味性。用户的积分有贫富差距,设计合理的奖品价值分布、丰富有趣的热点话题活动,让所有人都有机会参与进来,兼顾不同等级用户的参与体验。
综合来说在得积分和花积分两个过程中,让用户有更好的体验,用户认可积分的价值,那么用户就会去完成你设计的任务,相应的活跃度、留存率、运营指标也就得到提升。
主持人:兑吧的产品有什么独特之处?国内外市面上是否有同类型的服务公司?
陈高维:首先是产品本身方面:
其次是我们在运营支撑方面同样给力:
兑吧的产品及模式是我们自己首创、并在实践中不断完善的,目前国内、国外并没有类似的产品和服务。这点也是我们赢得同行认可最关键的一点。
主持人:这算是新搭建的模式,那么兑吧是一个很看重运营的公司,工具类、新闻类、视频类等不同类型App的积分体系该如何搭建呢?同样,积分商城又存在哪些误区?
陈高维:积分体系由两部分组成:(1)积分获取规则(积分任务);(2)积分消费体系(积分商城)。工具类、阅读类、视频类的app运营重点不同,通过kpi 拆解出来的用户关键行为也是不同的,所以在设计积分任务的时候也是不同的。不同类型的app在积分消耗上类似的,没有太大的区别。举几个具体的案例:
工具类APP:中华万年历 ,首页顶部日历工具,首页下部是资讯系inxi、广告,用户把页面拉到底部就奖励积分;另外中华万年历有一个商业化(类似分类信息网站),他们就把签到放在了这个页面,希望引入更多的流量,积分任务跟工具变现关联了起来;阅读类APP:凤凰新闻, 阅读文章、发表评论、分享文章、登录奖励 给予积分;视频类APP:暴风影音 , 签到、每看30分钟视频给予积分奖励。
这三家的积分规则明显体现了他们的运营方向。
与兑吧合作的伙伴中,我们双方运营会有互相的交流。在交流过程中的经常会得到开发者的反馈:积分商城上线之后,他们的用户注册率较之前有一定的提升,一些用户 UGC 的内容也有所增长。这就是积分体系所带来的明显成绩。
同样在开发者运营积分商城的过程中会有两个典型的误区:
实积分商城一个系统工作,并不是一件简简单单就可以做出效果的事情,只有把积分商城当成一个产品来运营的时候,它的作用才会真正呈现出来。
做好积分商城需要完成以下核心工作:
做一个真正能提升用户活跃的积分商城需要很多的的工作。包括在产品上面做一定的投入、运营上面做持续性的投入,而对于大多数的开发者都是一个很大的挑战。所以像赶集、暴风、百度这样的大型开发者也会选择兑吧这样的一个专业积分平台,而不是自己投入大量的产品运营资源,去做一个运营的工具。
主持人:可以从具体产品适用场景或者客户案例方面来阐述一下积分商城每日新增UV/PV、每日兑换订单量、每日消耗积分和金额、用户积分分布、活动数据等。
陈高维:我们来看一个APP积分商城上线3个月的一个数据表现:
左边可以看出上线后每周 UV/PV 都有稳步增长,之后留存基本稳定在 30%以上。可以看到我们有一些高点,比如说 8月20号的那周,这里有一个留存,PV 上面那个高点,实际上我们是策划了一个七夕的主题活动。这一周的 UV/PV 、增长用户的留存率和兑换率要比平时高的多。
平常期间,用户的 UV/PV 的比是 4到6。也就是说一个用户进入积分商城后通常会浏览四到六个页面。而在活动期间 UV 和 PV 的比,会达到十左右。相应的在活动之后的几周留存率和兑换率,也得到了提高。所以从数据分析来看,结合节假日或者热点时事的一些活动,能够激起用户对积分商城的关注度。
一般在兑吧平台上的开发者,通过日常的运营积分商城兑换率,会维持在百分之十到百分之二十之间,消耗积分各家都不一样。这个 App 近期的日订单量大概在四万左右,消耗的积分数在五百万左右,差不多是每日积分发放量的百分之八十。属于比较健康的状态,而消耗资金这一块,因为都是用兑吧提供的免费商品,所以暂时没有资金的消耗。
当然这些数据只能给我们一个参考,在积分商城运营中的数据统计和分析实际上是非常重要的。比如说最基础的每日UV/PV 上的数据,在运行过程中用户喜欢兑换哪些类型的商品;比如说策划了某个活动用户的参与度是怎么样;每天消耗多少用户的积分等等。这些数据都能使之后在积分的发放制度和上架商品内容上做一些优化。
为了方便开发者对积分商城运营的效果进行分析,兑吧后台会统计积分商城的 UV、PV 用户的积分数,兑换内容数据活动的数据。并且这些数据还会以折线图、饼状图的形式呈现给开发者运营,方便后期的分析,如果有兴趣的朋友可以注册到后台看下。
主持人:您怎么看App积分商城运营与发展? 那么多有实力的公司不缺资源不缺团队,为什么选择使用兑吧?
陈高维:首先,积分商城的运营能够提升用户活跃和流程的关键点就是:能消耗掉用户积分,使积分保持一个动态平衡,并在这个过程中给用户留下良好的体验。
兑吧在不断的探索app积分商城的运营手段与方向,这是一个不断超越用户预期的过程。目前4个方面不断提升:
大公司使用兑吧的积分商城,而不自建积分商城的主要原因是,兑吧提供了4个方面无法替代的价值:
主持人:请结合这些年您自己的职业经历,对各位想在技术路线上走的更远的人,给一点建议或者忠告。
陈高维:我本科、硕士都是计算机专业。读书期间也开发过一些简单系统、帮助过游戏公司开发游戏工具。
第一次创业做的象牙塔就是我跟另外一个合伙人刘晓俊一起开发的。就是从象牙塔这个项目开始,我的精力慢慢开始转移到产品策划和业务管理上面。技术背景的人做产品经理,逻辑思维能力会比较好一些,了解实现逻辑,所以跟技术团队配合上更容易一些。这些只是基本功,产品经理最重要的还是商业的嗅觉,以及概念落地的能力。到第二次、第三次创业,角色职能开始变得更加综合。
其实一路上并没有刻意地规划自己的职业路径,勇于去承担、解决创业中的问题,会推着你不断的突破自己,不断的成长。
因为很早就脱离了技术路线,所以很难给出细节的建议。但是有几点我觉的是相通的:1.想清楚自己想要什么,想成为什么样的人,目标决定行动路径;2. 在自己感兴趣的方向深入下去,坚持下去,你慢慢的就会成为这个领域的专家。3. 勇于去解决团队遇到最具挑战的问题,这是你成长的最快路径。4. 锻炼自己整体解决问题的能力,而不仅仅是技术角度解决问题,你会发现你更多的潜能。5. 选择或者创造有潜力的平台,与平台一起才能走的更远。ok, 大概就这么多 ,希望有帮助:)
互动环节:只有手机端支持?
陈高维:手机端目前是支持的最好的。PC端 由于涉及 设计样式、域名的问题,比较难统一方案解决,目前少量客户给予定制支持。大多数互联网公司 ,都是把用户往APP引导,在PC上积分商城模块 ,做成APP下载的一个引导,不做具体的兑换。
问:现在只针对手机APP,像我们如果是电视的APP能否对接呢?
陈高维:目前已经支持 PAD, 应该交互升级一下就可以支持到。
互动环节:积分商城还有一个重要的是商品,如何面对不同的受众人群,定位目标用户的商品投放需求。
陈高维:不同的APP 可以自行从我们的奖品库里挑选跟你的用户匹配的奖品。
互动环节:请问你们目前收费模式是怎么样的呢?
陈高维:面向开发者是免费服务的,包括系统免费、奖品(企业赞助的奖品)免费。
互动环节:除增加活中跃度,如何增加网站的商品边际效益,感觉只解决了积分消费问题。
陈高维:积分是一个杠杆,我们解决的就是让用户认可积分的价值,通过这个杠杆去驱动用户的价值行为。各个公司可以根据自己的商业诉求 去设计这个价值行为(积分任务)从而达到 活跃、变现的目的。
问:也就是只解决了平台运营商的问题,但对平台供应商没有什么太多帮助?如果要网站盈利,如何解决供应商的问题才是真正的问题。
陈高维:我们通过这种方式可以给奖品赞助方(广告主)带来精准的体验式营销,为广告主创造了价值。随着规模的增加,这个价值 是非常大的。所以没有牺牲赞助商的利益,是一个共赢的生态。
互动环节:积分的投入和产出,有没有计算公式?
陈高维:你是说 积分商城的预算和效果产出是吧。使用兑吧其实基本不需要投入,因为我们提供了丰富的免费奖品。效果很容易观察,积分商城上线之后,关键行为的提升度就是最直接的效果。
互动环节:你们目前公司的财务状况和公司的盈利了吗? 有没有拿到什么投资机构的大的投资呢。
陈高维:A轮 3000万 人民币。目前公司还是在提升规模阶段,希望服务更多的开发者。目前没有着手盈利。规模起来了 ,盈利也不会远。
互动环节:我曾经在深圳做德州运营的时候 当时我们的积分换实物的商城 因政策原因不让做 不知道你们有没有遇到过?
陈高维:德州是游戏,国家会管制的比较严格。容易跟赌博 划分不清。我们这个是补贴用户,不需要用户充值,所以有本质的区别。
想与业界大咖零距离沟通,欢迎加入CTO讲堂微信群,参与CTO讲堂!
分享主题:揭秘高效协作工具背后的技术架构
分享嘉宾:Worktile联合创始人兼CTO 李会军
嘉宾简介:李会军,易成时代联合创始人兼CTO。负责公司旗下Worktile和纷云两款产品的产品设计和研发。
2005年,李会军毕业于中国民航大学计算机科学与工程学院,毕业后先后就职于仙特软件和宇思信德科技有限公司,从事系统架构相关工作;其后受邀加入鲜果移动担任技术总监;连续4届“微软MVP",著有技术畅销书《Silverlight 2 完美征程》。
公司简介:Worktile是一款专注于解决中小团队协作的SaaS软件,包括任务进度管理,团队成员之间共享文件,在线编写文档以及安排团队的日程等。清晰的看板管理和乐高积木式的模块化功能是其最大的特点。用户可以在看板上按照自己的工作习惯和流程打造贴合自身的工作流;通过充足的自定义权限可以定义团队、项目、任务的多种属性,还可以随心开启关闭功能模块,就像玩转乐高积木一样简单灵活。目前Worktile已经推出了Web版、iPhone版和Android版,可以满足不同平台的需求。
加入方式:扫描二维码加“C粉儿小助手”好友,申请入群。
还不是CTO俱乐部成员的各公司技术负责人,欢迎立即加入俱乐部:cto.csdn.net。
入人人都是产品经理【起点学院】产品经理实战训练营,BAT产品总监手把手带你学产品
辛辛苦苦分析一堆大数据,竟然没人看!如果你正着手于从数据中洞察出有用信息,那你所需要的正是——数据可视化。俗话说,有图有真相,一图胜千言,取悦了眼球,剩下的都好说。
贵妃周一巨献!!挖掘了21款炙手可热的数据可视化工具,干净利落的高颜值信息图,就要这样做!
FusionCharts Suite XT不仅可以为带给你漂亮的图表,还能帮你制作出生动的动画、巧妙的设计和丰富的交互性。它在PC端、Mac、iPad、iPhone和Android平台都可兼容,具有很好的用户体验一致性,同时也适用于所有的网页和移动应用,甚至包括IE6、7、8这些绝大部分插件都不支持的主儿。在这软件里,创建你的首幅图表也只需要15分钟。
FusionCharts套件提供了超过90种图表和图示,从最基本款的到进阶版,例如漏斗图、热点地图、放缩线图和多轴图等。
Dygraphs是一款快捷、灵活的开源JavaScript图表库,用户可以自由探索和编译密集型数据集。它具有极强的交互性,比如缩放、平移和鼠标悬停等都是默认动作。更棒的是,它还对误差线有很强的支持。Dygraphs也是高度兼容的,所有的主流浏览器都可正常运行(包括不受待见的IE8)。你甚至可以在手机和平板设备上使用双指缩放!
Datawrapper让你只需4步就可以创建出图表和地图。这款工具帮你将数据可视化的时间从几小时减少到了几分钟。它的操作非常简单,你只需上传数据,选择一个图表或地图,然后点击发布就可以了。Datawrapper是为你的需求定制化而存在的,版式和视觉效果都可以按照你的样式规范而调整。
网址请戳 Datawrapper
Leaflet是为移动端友好型交互地图所做的开源JavaScript库,其中包含了大部分在线地图开发人员都需要的所有特征。Leaflet被设计为简单易用、性能优良的工具。归功于HTML5和CSS3,它得以支持所有主流电脑和移动平台。如果你还想扩展这个app,有大量可供选择的插件能安装。
这是一款操作简便的app,它可以轻松帮你创建令人眼前一亮的可视化作品。只需打开数据,用Tableau桌面版来进一步探索。然后,把可视化内容存储在你1GB Tableau Public在线文件空间,最后,将他们放进网站或Blog,通过社交媒体把你的作品分享给全世界吧!
网址请戳 Download Now
这是一款很赞的app,你可以用它创作出漂亮、清晰、透明的信息图表。PiktoChart提供了单击编辑器,有着超过400种模板、图标、图表,一个极大的图片素材库和无限制的自定义服务,保证了你的信息图表是独一无二的。一切只需要三步:在图库里预览主题然后选择一个;在图库中超过1000张图像之间选择你要的素材或是自己上传;最后,分享这幅信息图表给全世界看吧。
Google Charts为你的网站提供完美的数据可视化处理。从简单的折线图到复杂的分级树形图,他的图表库里提供了海量的模版可供选择。Google Charts如同JavaScript的类(classes)一样是开放的,你可以按需定制,但通常默认样式就能满足你的所有需求。所有的图表样式都是使用数据库表类(DataTable class)来填充数据的,这意味着你可以在挑选完美表现效果的时候轻松转换表格类型。
Raw是一款开放的Web app,可以按需创作矢量图形可视化作品。它是使用LGPL许可(GNU Lesser General Public License -GNU宽通用公共许可证的缩写,许多自由软件(Free Software)使用GPL作为其授权声明,译注)的定制项目,允许随意下载并修改。但是Raw只是Web app,你所上传的数据只能用网页浏览器处理,因此没有实质性服务器端数据交互。你可将可视化作品导出为矢量图形(SVG)格式或者栅格化为(PNG)格式。
网址请戳 Raw
iCharts是基于云端的趋势预测视觉分析平台,它可以快速地将复杂的商业信息、大规模调查数据和动态数据研究的结果可视化。它非常的快速简便,但却可以根据实时数据创造出富有冲击力的视觉智能图像,并且可以为你带来全方位信息聚合和信息对比。
Gliffy可以帮助你制作专业级流程图、组织图、UML分析图(Unified Modeling Language,统一建模语言,译注)、线框图、技术制图等等,而且它兼容所有的浏览器。Gliffy使用HTML5编辑器,速度是Flash的两倍。它提供一个可读的URL地址展示你的分析图,也可以将成果社交媒体上。你只需从海量库里把你想要的图形拖拖拽拽,然后单击选择需要的格式,通过简单的重选就能定制你的图表。
Canva让每个人都能简单做设计,它提供你所需要的一切来帮助你把想法转变成杰出的设计。你可以从一个定制版面或一个空白页面开始。你所需的工具都在一个地方,简明的界面才不会限制你发挥创造力。只需通过搜索并拖拽,就能创造出漂亮的设计,那些无聊的编程就让Canva来处理吧。Canva可以在线免费使用。
通过HighCharts你可以为网站项目制作交互式图表。它的用户非常广泛(全世界最大的100家公司里面有61家以及成千上万的开发人员都在使用)。如果是为个人网站或非盈利组织使用这个软件,它将是免费的。HighCharts是建立在HTML5上的,在现代的浏览器包括移动、平板设备上运行,也支持过时的IE浏览器(IE6之后的都可以)。它同时也是动态的,你可以自由添加、移除、修改数据列(Series)和关键点(Points)。这款app支持多种类型的图表:折现图、样条曲线、面积图、曲线面积图、柱状图、条状图、饼状图和散点图等等。
ZingChart是一个强大的库,为用户提供了快速创造漂亮的图表、操作面板和信息图表的可能性。你可以在上百种图表类型中自由选择,你的设计和个性化要求不会受到任何限制。你也可以使你的用户通过交互式图表特性参与到你的作品之中。
D3.js是数据驱动文件(Data-Driven Documents)的缩写,他通过使用HTML\CSS和SVG来渲染精彩的图表和分析图。D3对网页标准的强调足以满足在所有主流浏览器上使用的可能性,使你免于被其他类型架构所捆绑的苦恼,它可以将视觉效果很棒的组件和数据驱动方法结合在一起。
Timeline.js会让你爱上制作漂亮的时间轴,因为它的操作非常简单直观。这是一款支持40种语言的开源工具,通过它你可以建立自己的可视化互动时间轴,还可从各种途径置入到媒体中,目前已支持Twitter、Flickr、Google Maps、YouTube、Vimeo、Vine、Dailymotion、Wikipedia、SoundCloud等等。如果想看到由这款app创建的时间轴案例,请移步Timeline JS3查看。
网址请戳 Timeline JS3
InstantAtlas让信息分析师和研究者得以创建交互式动态分配图报告,并结合统计数据和地图数据来优化数据可视化效果。如果你正在寻找一个可以制图的数据映射工具,那么恭喜你,就是它了。
WolframAlpha把自己称作计算型知识引擎、谷歌在分析领域的劲敌。它最棒的一点是在显示图表时可以不需要任何配置就响应数据请求。如果你用的是公开的数据,那么你只需一个简单的小部件生成器就能在你的网页上轻松加入可视化数据。
http://Visual.ly是一个综合图库和信息图表生成器。它的工具很简单,却可创造出亮眼的数据展示作品。另外,你还可以在它的平台上分享你的图像。他能在内容上比一般的视觉分析工具表达更深入。
Dipity也是一款做时间轴的工具,用于管理网站上的时间和日期相关内容非常有效。用户可以创造并分享他们精彩的交互式时间轴,内容形式多种多样,包括音频、视频和图像甚至社交媒体频道。它对纸媒从业者、记者和博主来说简直必不可少。
如果你在找一款可同时使用位图和SVG矢量地图的JavaScript库,那么Polymaps正是你需要的。它为地图提供的多级缩放数据集方面表现非常迅速,并且可支持矢量数据的多种视觉表现形式。更棒的是,Polymaps可以在很大的尺度范围上加载数据。它使用的是球形墨卡托投影的tile格式,因此快到弹指间便可发布信息。
网址请戳 Polymaps
Excel现在作为微软商用Office套件里的组成部分,它提供了一些漂亮而复杂的东西,从单元热度图到散点坐标图都有。虽然只是一款入门级工具,但这对于想要探索数据的初学者来说倒不失为一个快速上手的好东西。你绝对应该将其放入工具箱。不过,如果你没办法得到Office套件,还可以试试Google Docs——它们也能干一样的事(作者绝对是微软高级黑)。
拿走,不谢!用得顺手别忘了回来留言告诉我们你的最爱哦。
文 | Piotr Kuźniewicz
译 | 高雨滴
校 | 郭瑽
特赞Tezign产品策划 贵妃奶黄包
*请认真填写需求信息,我们会在24小时内与您取得联系。