페이지 패턴

문서, 대시보드, 카탈로그, 운영 콘솔에 맞는 레이아웃 패턴을 선택합니다.

문서형 페이지

문서형 페이지는 좌측 집합 탐색, 중앙 본문, 우측 현재 페이지 목차가 분리되어야 읽기 좋습니다. 긴 본문에서는 우측 커서가 현재 섹션을 따라가게 하면 사용자가 스크롤 위치를 쉽게 파악합니다.

- 본문 heading id를 안정적으로 둡니다.

- 우측 목차는 desktop에서 sticky로 둡니다.

- mobile에서는 본문 폭을 우선합니다.

대시보드는 많은 정보를 보여주되 사용자가 바로 판단할 수 있어야 합니다. stat, chart, table, alert의 우선순위를 정하고 새로고침 주기와 데이터 기준 시간을 명확히 표시합니다.

- 가장 중요한 지표를 첫 행에 둡니다.

- 필터는 화면 상단에 고정합니다.

- 빈 데이터와 로딩 상태를 따로 설계합니다.

카탈로그는 탐색과 비교가 핵심입니다. 카드형 목록은 빠른 훑기에 좋고, 상세 페이지는 설치 방법, 권한, 호환성, changelog처럼 의사결정에 필요한 정보를 깊게 보여줍니다.

- 검색과 카테고리 필터를 함께 둡니다.

- 카드에는 핵심 차이점만 남깁니다.

- 상세로 이동해도 목록 맥락을 잃지 않게 합니다.

운영 콘솔은 반복 작업의 정확도가 중요합니다. 화려한 hero보다 좁은 toolbar, 명확한 table, 빠른 action, 확인 가능한 audit 정보를 우선 배치합니다.

- 위험 action은 시각적으로 분리합니다.

- bulk action은 선택 개수를 명확히 보여줍니다.

- 작업 결과는 toast와 로그 양쪽에 남깁니다.