内容管理网站/杭州关键词优化测试

又是一年一度的 11.22 AntV 品牌日，本年度设计的关键词为“优雅”，包括“优雅的视觉”、“优雅的交互”、“优雅的制图”。

优雅的视觉

对一个可视化系统来说，最大的确定在于数据的“不确定性”。我们不知道用户会加载什么样的数据，以及数据是什么样的体量。而设计的职责是把不确定的海量、高维、非结构化的数据用准确、有效的方式传递，以较低的数据油墨比表达清晰、美的效果。

统计图表中，高维数据可以通过交互或者切换图表类型进行解锁。但数据量级不可控，一旦系统不作为，将数据原形呈现在用户前面就会出现信息过载，在 2019.11.22 版本中，我们进行了诸多改进。可以对比之前信息过载时糟糕的视觉体验与现在的方案。

合理的信息密度

解决信息过载的办法是制定内置规则结合内容的智能检测，将不确定的、不可预测的数据种类、数据体量控制在合理范围内，用确定的方式传递出来，避免信息过载。

特定规则

经过多年的实战分析+行业经验总结，我们根据不同的数据类型使用不同的规则。

智能检测

以数据标签为例，数据标签如果不知道它的背景色是深是浅，是疏是密，就会出现标签过密、颜色看不清等系列问题。这次产品发布中，标签结合颜色检测、碰撞检测、图形检测、超区域检测，我们已能解决这些问题。

标签只是智能检测的一个例子，在轴、图例上面设计融入了诸多小而美的想法。我们一直坚信：Think big，design small，将这些看似很小的规则组合在一起，就能极大改善阅读体验。

全新的视觉样式

另外，本次发布 AntV 还来了全新的视觉样式。视觉样式升级围绕两个关键词 美学选择 与 专注。

美学选择

随着 iOS 13 和 Android 10 的普及， Dark Mode 已成为业内趋势之一，在可视化领域 Dark Mode 早有先驱。
如 Mac OS HIG 里的一句话：Dark Mode 是给予用户多一种美学选择，给予用户使用界面的新鲜感和惊喜感，会增加用户使用应用的愉悦度和粘性。AntV 经历无数次打磨，此次发布的全新 Dark Mode 样式，它与 AntDesign 相关组件、页面无缝融合，整体和谐优美。

专注

AntV 作为企业级数据可视化解决方案，最重要提升信息的获取效率，而效率很大程度与专注度有关。因此，我们在设计时重新定义的组件海拔高度，让图表信息层级更清晰，让用户更加专注于核心内容本身。

专注 一词流入图的方方面面，如主题配色、关系图点与边的关系，让其更清晰，让用户专注于识别“关系”，而不是区别图形本身；

优雅的交互

今天，无限数据空间与有限屏幕空间的冲突愈演越烈，许多静态可视化作品已不满足分析诉求，加上各种端、各种设备的尺寸均需适配。这些千呼万唤的功能在 2019 的 AntV 中已逐步实现，主要包括响应式设计与交互语法。

响应式

AntV 在构建响应式系统时结合 Responsive design 与 Adaptive design，在宏观与微观层面遵循规则如下：

• 宏观：保证核心信息优先展示 （呈现）
• 微观: 所有尺寸下细节信息都有能力获取到（交互）

有了以上规则后，小到 mini 图表，大到大屏显示，AntV 总能保证重点信息不丢失的同时轻松胜任各种尺寸、多种设备。

交互语法

可视化技术与人机交互拥有着紧密的联系。实现用户与数据的交互，方便用户控制数据，更好地实现人机交互这是我们一直追求的目标。今年 AntV 继续深耕可视化交互，提供了多图表组合、叠加、联动等交互功能，让图表具备讲故事的能力。

交互语法本质是以用户行为目的为导向，目的引发相应事件的发生，拆解成对应的交互动作以及对作关联的组件、组件状态，交互系统是多项关联、相互作用的。

优雅的制图

可视化设计师一直致力于让 AntV 更好看好用，这回我们私心了一把，让设计者进入图表制作的全面提效时代，只需 10 秒，轻松做出优雅图表。

Kitchen 图表生成（sketch 插件）

• 更快 –– 10 秒生成一张图表
• 更直观 –– “以形改图”，拖拽修改外观即可生效
• 更强大 –– 完善的图表配置和数据能力
• 对数据小白友好 –– 任何水平的制作者都能轻松作出优雅图表

只需 10 秒，两步生成一张图表。可能是Sketch 里最好用的作图利器！插件下载链接

ChartCube 在线图表生成

除了 Kitchen 图表插件外，我们还支持在线生成图表，点此使用

• 离线数据上传，即时预览（即将上线）；
• 各种文件任意导出，做 PPT 配图，输出代码给开发同学从此无缝衔接；

结语

AntV 各产品正在体系化升级，如对可视化设计感兴趣，求贤若渴，欢迎投简历+作品集至 antv@antfin.com

数据可视化设计师：负责 AntV 相关设计工作，主要包括可视化设计体系搭建，可视化中台产品界面风格设计，输出高品质设计方案与规范。

扩展阅读

• 墨者社区
• 知乎专栏

-------------------------

附

AntV 品牌日的发布详情

• 知源 · 致远 - AntV 11.22 年度发布
• 技术
• 这张图表「不简单」- AntV 的图表工厂
• 洞察关系数据 - AntV 的图可视化与图分析
• 突破专业门槛 - AntV 的地理可视化
• 高效易用的 2D 渲染引擎 - G 4.0 升级
• 设计
• 2019，优雅的 AntV 来了
• 打造默认好用的企业级图表-G2Plot
• 始于探索 - G6 图可视化设计
• 从「心」出发之 L7 地图可视化设计
• 产品
• 图表制作可以很简单 - 图表魔方 ChartCube
• 知源 · 致远 - AntV 的那些人，那些事儿

AntV 项目链接

欢迎关注我们的 GitHub 项目，点亮 star 了解我们的实时动态，期待 pr：

• AntV 官网：https://antv.alipay.com
• G2：https://github.com/antvis/g2G2 是一套基于可视化编码的图形语法，以数据驱动，具有高度的易用性和扩展性，用户无需关注各种繁琐的实现细节，一条语句即可构建出各种各样的可交互的统计图表。
• G2Plot：https://github.com/antvis/g2plot
  G2Plot 的定位是开箱即用、易于配置、具有良好视觉和交互体验的通用图表库。
• F2：https://github.com/antvis/f2F2 是一个专注于移动，开箱即用的可视化解决方案，完美支持 H5 环境同时兼容多种环境（node, 小程序，weex）。完备的图形语法理论，满足各种可视化需求。专业的移动设计指引为你带来最佳的移动端图表体验。
• G6：https://github.com/antvis/g6G6 是 AntV 旗下的图可视化与图分析引擎，G 来自于 Graphic、Graph ，意味着我们要基于图分析技术做图可视化；6 来自于《六度分隔理论》，表达了我们对关系数据、关系网络的敬畏和着迷。
• Graphin：https://github.com/antvis/graphinGraphin 是一个基于 G6 封装的关系可视分析工具 ，简单，高效，开箱即用，取自 Graph Insight，图的分析洞察。
• L7：https://github.com/antvis/l7L7 是一个基于 WebGL 的开源大规模地理空间数据可视分析开发框架。L7 中的 L 代表 Location，7 代表世界七大洲，寓意能为全球位置数据提供可视分析的能力。
• G：https://github.com/antvis/gG 是 AntV 几个产品共同的底层 2D 渲染引擎，高效易用，专注于图形的渲染、拾取、事件以及动画机制，给上层 G2、F2、G6 提供统一的渲染机制。
• ChartCube：https://chartcube.alipay.comChartCube 是一个可以快速完成图表制作的在线工具，只需要三步就可以创建出高品质的图表。