Conversation
코드를 실제로 확인해보니 색·폰트·간격 체계는 이미 잘 잡혀 있었다.
setup_theme() 은 네이비 다크 + 블루 액센트에 텍스트 5단계·코너·그림자까지
정의돼 있고 주석에도 '금융권 대시보드 톤' 이라고 적혀 있다.
테마를 갈아엎을 일이 아니라 아래 4가지가 문제다.
1) 표를 egui::Grid 로 그린다(egui_extras 미사용)
→ 열 너비가 들쭉날쭉, 스크롤 시 헤더가 사라짐, 정렬 불가,
97행을 매 프레임 전부 그림. 이게 '엉성함' 의 가장 큰 원인이다.
2) 공통 컴포넌트가 card() 하나뿐 → 배지·수치·빈 상태를 화면마다 직접 조립
3) 밀도가 터치 기준(interact_size 44x34) → 관리 콘솔치고 정보가 적게 들어감
4) 숫자가 좌측 정렬·가변폭 → 세로가 안 맞아 비교가 어렵다
UI-A 토큰·컴포넌트(src/ui.rs 신설) / UI-B TableBuilder 전환 /
UI-C 밀도·숫자 정렬 / UI-D 상태 표기 통일 로 나눴다.
검증
egui_extras =0.31.1 을 실제로 추가해 빌드했고, 지시서에 실은 TableBuilder
코드(Column::remainder/exact, body.rows, max_scroll_height, id_salt)를
그대로 컴파일해 0.31.1 API 에서 동작함을 확인한 뒤 되돌렸다.
가장 중요한 함정을 절대 규칙으로 못박았다: egui 를 올리면 안 된다.
0.29.x 리눅스 IME 회귀 때문에 =0.31.1 로 고정한 것이고 올리면 한글 입력이
깨진다. egui_extras 최신은 0.35 지만 짝을 맞춰 =0.31.1 을 쓴다.
body.row() 루프를 쓰면 가상 스크롤이 사라져 지금과 똑같이 느려지는 것,
정렬 시 원본 순서를 바꾸면 체크박스 선택이 어긋나는 것도 함정에 적었다.
참고: Rerun Viewer 의 re_ui(디자인 토큰 + 컴포넌트 레이어 분리) 구조.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01WxEiSzFMdeAzvohAQ39nyJ
지시서(PR #13)는 한 번의 작업 계획이라 끝나면 사라진다. 다음에 화면을 손댈 때 기준이 다시 흐려지므로, 규칙 자체를 스킬로 박아 앞으로 모든 UI 작업에 적용되게 한다. 기준은 IBM Carbon·Grafana 계열 데이터 밀도형이다. Apple HIG 같은 터치 기준 (44pt 타겟·넉넉한 여백)은 쓰지 않는다 — 운영자가 하루 종일 보는 도구라 여백보다 정보 밀도가 중요하고, HIG 를 따르면 지금보다 오히려 헐거워진다. 담은 것 · 절대 제약: egui/egui_extras =0.31.1 고정(올리면 한글 입력이 깨진다), 폰트 교체 금지 · 색은 의미에만(정상/주의/위험/미조회), 색만으로 상태를 전달하지 않는다(색각 이상) · 표는 반드시 TableBuilder — Grid 금지, body.rows() 로 가상 스크롤, 행 22/헤더 24 고정, 정렬 시 원본 Vec 순서를 바꾸지 않는다(체크박스가 어긋난다) · 숫자는 우측정렬 + 고정폭, 단위 필수, 빈칸 대신 '조회불가' (빈칸은 정상으로 오해된다) · 미조회를 정상으로 표시하지 않는다 · 빈 상태에는 왜 비었는지와 다음 행동을 쓴다 · 조회 결과에는 기준 시각을 표시한다 .gitignore 에 !.claude/skills/ 예외를 함께 넣었다. PR #8 이 머지되면 .claude/* 규칙이 들어와 스킬이 통째로 무시될 상황이었다. settings.local.json 이 여전히 차단되는 것도 확인했다. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01WxEiSzFMdeAzvohAQ39nyJ
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
화면을 금융권 서버 관리 콘솔 수준으로 끌어올리는 지시서. 문서만, 코드 없음.
📄
.claude/plans/2026-07-31-ui-overhaul-SPEC.md진단 — 테마는 이미 괜찮았다
코드를 실제로 확인해보니
setup_theme()이 네이비 다크 + 블루 액센트에 텍스트 5단계·코너·그림자까지 정의하고 있고, 주석에도 "금융권 대시보드 톤" 이라고 적혀 있습니다. 테마를 갈아엎을 일이 아닙니다. 문제는 4가지입니다.egui::Grid로 그림 (egui_extras미사용)card()하나뿐interact_size 44x34)1번이 가장 큽니다. 표가 흔들리면 나머지가 정돈돼도 엉성해 보입니다.
작업 단위
src/ui.rs신설) — 색·간격을 화면에서 직접 쓰지 않게TableBuilder전환 — 헤더 고정·열 리사이즈·헤더 클릭 정렬·가상 스크롤-대신조회불가)검증
egui_extras =0.31.1을 실제로 추가해 빌드했고, 지시서에 실은TableBuilder코드(Column::remainder/exact·body.rows·max_scroll_height·id_salt)를 그대로 컴파일해 0.31.1 API 에서 동작함을 확인한 뒤 되돌렸습니다.가장 중요한 함정
egui버전을 올리면 안 됩니다. 0.29.x 리눅스 IME 회귀 때문에=0.31.1로 고정한 것이고, 올리면 한글 입력이 깨집니다.egui_extras최신은 0.35 지만 짝을 맞춰=0.31.1을 씁니다. 이걸 절대 규칙으로 못박았습니다.그 외:
body.row()루프를 쓰면 가상 스크롤이 사라져 지금과 똑같이 느려지는 것, 정렬 시 원본 순서를 바꾸면 체크박스 선택이 어긋나는 것.참고
Rerun Viewer 가 egui 로 만든 전문가급 앱이고,
re_ui라는 디자인 토큰 + 컴포넌트 레이어를 따로 두는 구조를 참고했습니다.🤖 Generated with Claude Code
https://claude.ai/code/session_01WxEiSzFMdeAzvohAQ39nyJ