Funnel Chart

설명 / Description

퍼널 차트는 큰 초기 수량에서 시작해 일련의 단계를 거치며 점점 좁아지는 프로세스를 시각화하며, 각 단계는 이전 단계 수치의 일부만을 유지합니다. 이 차트의 이름은 특징적인 형태에서 비롯됩니다: 위쪽은 넓고(모든 초기 진입을 나타냄) 아래쪽은 좁습니다(최종 전환이나 완료를 나타냄). 각 수평 밴드는 하나의 단계를 나타내며, 그 너비는 해당 단계의 수치에 비례합니다.

A funnel chart visualizes a process that begins with a large initial quantity and narrows through a series of stages, with each stage retaining only a portion of the previous stage's count. The chart takes its name from its characteristic shape: wide at the top (representing all initial entries) and narrow at the bottom (representing the final conversions or completions). Each horizontal band represents a stage, and its width is proportional to the count at that stage.

가장 흔한 활용 사례는 마케팅과 제품 설계에서의 전환 퍼널 분석입니다: 얼마나 많은 사용자가 인지에서 고려, 구매로 이어지는지 추적하는 것입니다. 하지만 이 패턴은 점진적으로 감소하는 모든 프로세스에 폭넓게 적용됩니다: 채용 파이프라인(지원자에서 채용까지), 의료(선별 검사에서 진단, 치료까지), 법적 절차(제소에서 재판, 판결까지), 또는 제조(원재료에서 완제품, 출하까지).

The most common application is conversion funnel analysis in marketing and product design: tracking how many users progress from awareness to consideration to purchase. But the pattern applies broadly to any process with progressive attrition: recruitment pipelines (applicants to hires), healthcare (screened to diagnosed to treated), legal proceedings (filings to trials to verdicts), or manufacturing (raw inputs to finished products to shipped units).

퍼널 차트는 단계에 자연스러운 순서가 있고, 주된 이야기가 단계 간 이탈률에 관한 것일 때 가장 효과적입니다. 시각적으로 좁아지는 형태는 이탈을 즉각적으로 전달하며, 인접한 밴드의 너비를 비교하면 어떤 전환에서 가장 많은 참여자를 잃는지 드러납니다. 백분율로 주석을 달면 이 차트는 병목 지점을 식별하는 강력한 진단 도구가 됩니다.

Funnel charts work best when there is a natural ordering of stages and the primary story is about drop-off rates between stages. The visual narrowing immediately communicates attrition, and comparing the width of adjacent bands reveals which transitions lose the most participants. When annotated with percentages, the chart becomes a powerful diagnostic tool for identifying bottlenecks.

Funnel Chart — interactive example

언제 사용하나 / When to Use

순차적인 다단계 프로세스에서 전환율을 추적할 때
Tracking conversion rates through a sequential multi-stage process
어느 단계에서 가장 큰 이탈이 발생하는지 식별할 때(병목 분석)
Identifying which stage has the largest drop-off (bottleneck analysis)
점진적 감소가 핵심 지표인 마케팅 또는 영업 파이프라인을 보고할 때
Reporting on marketing or sales pipelines where progressive attrition is the key metric
프로세스에서 전체 진입 수와 최종 결과 사이의 관계를 보여줄 때
Showing the relationship between total entries and final outcomes in a process

이럴 땐 피하세요 / When NOT to Use

단계가 순차적이지 않거나 자연스러운 순서가 없을 때 -- 막대 차트를 사용하십시오
When the stages are not sequential or do not have a natural order -- use a bar chart
일부 단계에서 값이 증가할 때("퍼널" 형태가 깨짐) -- 폭포 차트나 막대 차트를 사용하십시오
When values increase at some stages (the "funnel" shape breaks) -- use a waterfall chart or bar chart
분기 경로(사용자가 서로 다른 목적지로 이동하는 경우)를 보여줘야 할 때 -- 샌키 다이어그램을 사용하십시오
When you need to show branching paths (users going to different destinations) -- use a Sankey diagram
인접하지 않은 단계 간의 정확한 비교가 중요할 때 -- 백분율 레이블이 있는 막대 차트를 사용하십시오
When precise comparisons between non-adjacent stages matter -- use a bar chart with percentage labels
단계가 7~8개를 넘을 때 -- 퍼널이 너무 좁아지므로, 단계를 그룹화하는 것을 고려하십시오
When there are more than 7-8 stages -- the funnel becomes too narrow; consider grouping stages

구조 / Anatomy

단계 밴드: 단계마다 하나씩 있는 수평(또는 사다리꼴) 밴드로, 너비는 해당 단계의 수치에 비례합니다
Stage bands: Horizontal (or trapezoidal) bands, one per stage, with width proportional to the count at that stage
단계 레이블: 각 프로세스 단계의 이름으로, 보통 밴드 왼쪽이나 내부에 표시됩니다
Stage labels: Names of each process stage, typically to the left or inside the band
값 레이블: 각 밴드 위나 옆에 표시되는 건수 또는 백분율입니다
Value labels: Counts or percentages displayed on or beside each band
전환율 주석: 이전 단계에서 진행된 비율을 보여주는 선택적 레이블입니다
Conversion rate annotations: Optional labels showing the percentage that progressed from the previous stage
색상 그라디언트: 흔히 단일 색조에서 불투명도가 감소하거나, 위에서 아래로 순차적인 색상 스케일을 사용합니다
Color gradient: Often a single hue with decreasing opacity or a sequential color scale from top to bottom
중앙 정렬: 대칭적인 퍼널 형태를 만들기 위해 밴드는 보통 수평으로 중앙 정렬됩니다
Centering: Bands are typically centered horizontally to create the symmetric funnel shape

변형 / Variations

비대칭 퍼널: 밴드가 중앙 정렬이 아니라 (막대 차트처럼) 왼쪽 정렬되어, 퍼널이라는 은유를 희생하는 대신 값 비교가 쉬워집니다
Asymmetric funnel: Bands are left-aligned (like a bar chart) rather than centered, making value comparison easier at the cost of the funnel metaphor
전환 레이블이 있는 퍼널: 각 단계 간 이탈률이 밴드 옆에 표시됩니다
Funnel with conversion labels: Drop-off percentages between each stage are displayed alongside the bands
누적 퍼널: 각 단계가 하위 범주(예: 트래픽 소스별)로 분해됩니다
Stacked funnel: Each stage is decomposed into sub-categories (e.g., by traffic source)
역퍼널(피라미드): 위에서 아래로 갈수록 넓어지며, 단계를 거치며 값이 증가할 때(예: 도달 범위) 사용됩니다
Inverted funnel (pyramid): Widens from top to bottom, used when values grow through stages (e.g., audience reach)
수평 퍼널: 단계가 왼쪽에서 오른쪽으로 흐르며, 단계가 많을 때 유용합니다
Horizontal funnel: Stages flow left-to-right, useful when there are many stages

코드 레퍼런스 / Code Reference

// Observable Plot - horizontal funnel as centered bar chart
Plot.plot({
  marks: [
    Plot.barX(stages, {
      y: "stage",
      x: "value",
      fill: "steelblue",
      fillOpacity: (d, i) => 1 - i * 0.15,
      tip: true
    }),
    Plot.text(stages, {
      y: "stage", x: "value",
      text: d => `${d.value} (${d.rate}%)`,
      dx: 5, textAnchor: "start"
    })
  ],
  y: {domain: stages.map(d => d.stage)}
})