---
title: 设计规范
---

## 📊 指标卡趋势图

### 定义

带图例指标卡和统计图表结合使用的复合图表

### 技术栈

G2Plot，Ant Design

### 何时使用

一般用于核心指标的监控，同时查看每个指标对应趋势图，常用于营销活动中关键指标的分析、kpi 大盘完成情况的监控，服务于运营、BI、高管等。设计上通过指标+图表联动平铺展示的方式，取代点击指标再查看图表的交互方式，减少点击跳转，可极大提高屏效，不易打断分析思路，给到沉浸式的分析体验


## 📊 场景漏斗图

### 定义

为条形图添加一个转化率组件，就可以轻松生成一个漏斗图。用于表达数据从一个阶段到另一阶段逐步减少的过程。漏斗的每个阶段代表总数的一部分。因此，它假定为漏斗形-第一阶段是最宽且最大的阶段。显示的值按比例递减，总计为 100％。

### 技术栈

G2Plot，Ant Design

### 何时使用

产品或运营同学在进行用户行为的分析时，常常遇到转化率过低等问题，但用户很难定位到问题是在哪，也难以去优化。条形漏斗图不仅可以提供用户每一步的数值变化、步骤间的转化率，还可以延伸提供转化问题的提示信息，并下钻跳转其他页面进行详情查看。

此外，相比于常规漏斗图，条形漏斗图更适用于漏斗步数不确定的情况，可扩展性更强。
