본문으로 건너뛰기
Centralby 디자인 시스템

패턴

빈 상태·일부 실패·오류

목록·카드·위젯·차트에서 같은 7상태를 같은 문장으로. 세 가지 빈 상태는 서로 다른 문장이다.

세 가지 빈 상태

빈 상태 세 가지는 다른 문장이다: 아직 읽지 않음 / 읽었지만 결과 없음 / 일부 실패.

아직 읽지 않음

출처를 연결하면 여기에 보여요.

비어 있음

아직 여기에 보여줄 기록이 없어요.

‘roadmap’ 결과 없음

읽은 기간에는 해당하는 기록이 없어요.

  • 이렇게빈 상태에는 원 안의 선 아이콘 하나, 문장 하나, 버튼 0–1개. 상태마다 아이콘과 문장이 다르다.
  • 이렇게 하지 않기큰 “0”, 일러스트, 진척을 암시하는 그림을 쓰지 않는다. “쉬었던 날” 같은 노력 평가도 없다.
  • 이렇게화면별 문장이 있으면 공통 문장 대신 그것을 쓴다(예: 이번 주 → “이번 주 기록이 아직 없어요.”).

표면마다 같은 상태

실제 컴포넌트: 한 상태를 목록·카드·위젯·차트에 동시에

surface="list"

아직 읽지 않음

출처를 연결하면 여기에 보여요.

surface="card"

아직 읽지 않음

출처를 연결하면 여기에 보여요.

surface="widget"

아직 읽지 않음

출처를 연결하면 여기에 보여요.

CollectionCoverage

출처를 연결하면 여기에 보여요.
같은 상태는 어느 표면에서든 같은 문장과 같은 아이콘이다. 표면에 따라 크기와 행동 수만 달라진다.

오류와 일부 실패

오류 문장은 무슨 일 → 무엇이 남았나 → 무엇을 하면 되나. 행동은 0–1개, 보통 “다시 시도”. 배너는 계정 전체의 일(이메일 인증, 끊긴 연결)에만, 흐름을 막지 않는다.

오류지금 불러오지 못했어요.

주의일부 기간을 읽지 못했어요.

받은 기록은 그대로 있어요.
  • 이렇게 하지 않기이전 그림을 오류 표시 없이 남기지 않는다. 반대로 데이터가 있을 때 다시 불러오기가 실패하면 데이터를 지우지 않고 “오래됨”으로 표시한다.
  • 이렇게 하지 않기사과·감탄·탓하기(“앗”, “죄송합니다”, “잘못 입력하셨습니다”)를 쓰지 않는다.
  • 이렇게assertive 알림은 사용자 자신의 행동이 실패했을 때만. 백그라운드 실패는 polite.

어느 컴포넌트를 쓰나

상황별 컴포넌트
상황컴포넌트
데이터 영역 전체의 상태StateView
독립된 빈 화면 (카드 하나)EmptyState
받은 데이터 위 일부 실패PartialFailureRow
흐름 안의 문제 알림Alert
계정 전체의 일Banner
행동 결과 (실행 취소 포함)Toast
처음 불러오는 중Skeleton

근거 문서: contracts/README.md §4 · copy/catalog-copy.md §1.1 §3 · charts/charts-spec.md §5 · foundation/visual-direction.md §8