Patterns
컴포넌트를 조합해 협업 도구에서 반복되는 문제를 푸는 검증된 해법이에요.
컴포넌트 하나만으로는 좋은 화면이 되지 않아요. 패턴은 여러 컴포넌트를 언제, 어떻게 함께 쓰는지에 대한 합의예요. 이슈를 만드는 폼, 저장 결과를 알리는 메시지, 보드를 불러오는 동안의 화면처럼 협업 도구에서 계속 마주치는 상황을 같은 방식으로 풀면, 사용자는 한 번 익힌 행동을 어디서나 다시 쓸 수 있어요.
Forms
필드 배치, 필수 표시, 도움말과 검증 메시지, 제출 버튼 배치.
Messaging
Flag, Banner, Section message, Inline message 중 무엇을 언제 쓸지.
Loading
Spinner, Skeleton, Progress bar 를 기다리는 시간과 맥락에 맞게 고르기.
Empty states
처음 시작, 모두 완료, 검색 결과 없음 상황에서 다음 행동 안내하기.
Navigation
상단 내비게이션·사이드 내비게이션·메인 영역으로 앱 셸 구성하기.
패턴을 쓰는 원칙
- 익숙함이 먼저예요. 새로운 방식을 만들기 전에, 이미 있는 패턴으로 풀 수 있는지 먼저 확인해요.
- 상황에 맞는 강도로 말해요. 모든 메시지가 빨간 배너일 필요는 없어요. 영향 범위와 긴급도에 맞는 컴포넌트를 골라요.
- 다음 행동을 알려줘요. 오류, 빈 화면, 로딩 모두 "그래서 무엇을 하면 되는지" 를 함께 보여줘요.
- 흐름을 끊지 않아요. 모달과 배너처럼 작업을 막는 요소는 꼭 필요할 때만 써요.