Anatomy
Metric / Stat은 label → value → optional qualifier의 작은 정보 단위입니다.
Label
수치가 무엇을 뜻하는지 먼저 정의합니다.
Value
정량 값이 시각적으로 가장 강하지만 의미를 스스로 만들지는 않습니다.
Qualifier
범위, 시점, freshness처럼 해석에 필요한 보조 정보를 선택적으로 덧붙입니다.
Usage
하나의 수치를 읽게 할 때 사용합니다.
대시보드 카드가 필요한 것이 아니라 정량 사실 하나를 읽게 할 때 사용합니다. 여러 Metric을 나열한다고 자동으로 Metric Summary라는 별도 pattern이 생기지는 않습니다.
How to use
수치 강조보다 측정 의미와 비교 조건을 먼저 맞춥니다.
Semantics
권장 구조는 dl 안의 .wbds-metric, dt label, dd value입니다.
Comparison
좋음/나쁨, 증가/감소 의미를 색 하나로만 전달하지 않습니다. trend arrow나 semantic tone은 이 primitive의 기본 contract가 아닙니다.
Responsive
value와 qualifier는 긴 문자열에서도 줄바꿈되며 별도 stat card surface를 만들지 않습니다.
Accessibility
레이블과 값의 관계가 시각 배치 없이도 이해되어야 합니다.
Structure
가능하면 dl/dt/dd semantics로 label-value 관계를 유지합니다.
Live updates
값이 비동기로 자주 바뀐다는 이유만으로 자동 live region을 만들지 않습니다. 중요한 변경만 제품 문맥에 맞춰 알립니다.