AI 분석
카테고리별 목표·실제 비중과 발주 값을 한 표에서 편집하는 다크 모드 데이터 그리드다.
왼쪽에는 플랜·발주 기준 드롭다운과 단계별 상태 배지, 비용 업데이트 버튼을 둔 사이드 패널이 있고, 오른쪽에는 카테고리를 열로, 지표를 행으로 배치한 피벗형 고밀도 표가 놓인다. 거의 검정에 가까운 차콜 배경 위에 흰색 숫자 타이포그래피를 쓰고, 목표 대비 실제 비중 셀을 초록·노랑·빨강 틴트로 채워 편차를 즉시 드러내며 편집된 값은 파란색, 변경된 셀은 모서리의 작은 주황 삼각형으로 표시한다. 셀 범위 선택과 인라인 드롭다운 편집, 하단 토스트의 실행 취소, 최대 편차 기준 열 재정렬, 우측 슬라이드 패널의 탭형 변경 이력, 되돌리기 확인 모달까지 편집 흐름 전체를 보여준다. 스프레드시트형 편집 UX와 상태 색 인코딩, 변경 추적 패턴을 설계할 때 참고하기 좋다.
dark-mode · minimal · techy
claude-opus-5-5 · 2026-10-21 18:02 · 신뢰도 0.80