WEBVTT

1
00:00:00.250 --> 00:00:02.825
Data has always had a clarity problem.

2
00:00:02.905 --> 00:00:04.991
Numbers exist, meaning doesn't.

3
00:00:05.071 --> 00:00:07.856
Not until someone decides how to show it.

4
00:00:07.936 --> 00:00:11.210
This is a chart library built for that
decision.

5
00:00:11.290 --> 00:00:13.166
KPI cards start with signal.

6
00:00:13.246 --> 00:00:17.009
Headline metrics live at the top, compact,
unambiguous,

7
00:00:17.089 --> 00:00:19.035
with the trend line built in.

8
00:00:19.115 --> 00:00:21.830
No chart needed when a number can speak.

9
00:00:21.910 --> 00:00:22.878
Donut and line.

10
00:00:22.958 --> 00:00:25.603
The donut gives proportion at a glance.

11
00:00:25.683 --> 00:00:27.560
Soft fills a deliberate gap.

12
00:00:27.640 --> 00:00:31.612
The line chart beside it shows the same
story across time:

13
00:00:31.692 --> 00:00:34.896
monthly active users, the slope doing the
work.

14
00:00:34.976 --> 00:00:38.250
Mouse over on the line chart, a tooltip
appears.

15
00:00:38.330 --> 00:00:42.093
Hover anywhere, and a tooltip surfaces the
exact value.

16
00:00:42.173 --> 00:00:45.516
Every chart in the library responds the same
way.

17
00:00:45.596 --> 00:00:47.054
Bars and stacked bars.

18
00:00:47.134 --> 00:00:51.106
Grouped bars for comparison, stacked bars
for composition.

19
00:00:51.186 --> 00:00:55.228
Rounded ends, chalky fill, room to breathe
between columns.

20
00:00:55.308 --> 00:00:57.045
The palette is restrained:

21
00:00:57.125 --> 00:01:01.517
enough colour to encode meaning, not enough
to distract from it.

22
00:01:01.597 --> 00:01:02.425
Stacked area.

23
00:01:02.505 --> 00:01:06.128
The stacked area chart layers contribution
over time.

24
00:01:06.208 --> 00:01:09.762
Translucent fills let the lower series show
through.

25
00:01:09.842 --> 00:01:13.814
The eye reads both the total and the parts
simultaneously.

26
00:01:13.894 --> 00:01:14.303
Sankey.

27
00:01:14.383 --> 00:01:17.867
The Sankey is the most ambitious chart in
this set,

28
00:01:17.947 --> 00:01:20.522
and the one that earns its complexity.

29
00:01:20.602 --> 00:01:22.269
Flows move left to right.

30
00:01:22.349 --> 00:01:25.832
The width of each ribbon is proportional to
volume.

31
00:01:25.912 --> 00:01:30.304
You can follow a cohort from entry through
every decision point:

32
00:01:30.384 --> 00:01:34.286
where they continue, where they exit, where
they convert.

33
00:01:34.366 --> 00:01:37.640
The tooltip lights up with count and
percentage.

34
00:01:37.720 --> 00:01:41.483
Hover a flow, and it isolates, dimming
everything else.

35
00:01:41.563 --> 00:01:45.885
The 46% completion figure in the stat panel
updates in context.

36
00:01:45.965 --> 00:01:48.191
A Sankey shouldn't need a legend.

37
00:01:48.271 --> 00:01:49.938
It should explain itself.

38
00:01:50.018 --> 00:01:50.916
This one does.

39
00:01:50.996 --> 00:01:51.405
Funnel.

40
00:01:51.485 --> 00:01:54.619
The funnel strips a journey to its
essentials.

41
00:01:54.699 --> 00:01:55.947
Each step is a bar.

42
00:01:56.027 --> 00:01:57.414
Each bar is labelled.

43
00:01:57.494 --> 00:02:01.327
Drop-off is visible between rows, not buried
in a table.

44
00:02:01.407 --> 00:02:03.004
Sequential, unambiguous.

45
00:02:03.084 --> 00:02:04.680
Matrix, scatter and box.

46
00:02:04.760 --> 00:02:08.034
The matrix handles multi-dimensional
comparison:

47
00:02:08.114 --> 00:02:10.200
heat-map colouring over a grid,

48
00:02:10.280 --> 00:02:14.952
so the eye finds the outlier faster than a
sorted table would allow.

49
00:02:15.032 --> 00:02:17.956
Scatter plots map two continuous variables.

50
00:02:18.036 --> 00:02:20.122
The dot size can carry a third.

51
00:02:20.202 --> 00:02:24.524
The box plot beside it shows the same
distribution differently:

52
00:02:24.604 --> 00:02:28.856
median, spread, outliers, without obscuring
individual points.

53
00:02:28.936 --> 00:02:30.812
Bubble, Gantt and waterfall.

54
00:02:30.892 --> 00:02:34.166
Bubble charts for three-dimensional
positioning,

55
00:02:34.246 --> 00:02:37.310
Gantt for sequencing phases and
dependencies,

56
00:02:37.390 --> 00:02:40.804
and a waterfall bridge for financial
storytelling,

57
00:02:40.884 --> 00:02:44.647
where additions and subtractions stack to a
net result.

58
00:02:44.727 --> 00:02:45.127
Radar.

59
00:02:45.146 --> 00:02:49.119
The radar chart surfaces multi-axis balance,
or imbalance.

60
00:02:49.199 --> 00:02:51.354
The heat map closes the library:

61
00:02:51.434 --> 00:02:57.224
frequency and intensity across two
categorical axes, colour carrying all the weight.

62
00:02:57.304 --> 00:02:58.551
Every chart is SVG.

63
00:02:58.631 --> 00:03:00.368
Every chart has a tooltip.

64
00:03:00.448 --> 00:03:05.957
Every chart was built to be read by someone
who doesn't have time to wonder what

65
00:03:06.037 --> 00:03:07.285
they're looking at.

66
00:03:07.365 --> 00:03:08.682
That's the standard.

67
00:03:08.762 --> 00:03:10.010
That's the library.