UI/UX 전면 재설계 — 단일 창, 백엔드 로그 #4

Open
opened 2026-05-08 15:27:36 +09:00 by HYUNJUNGLEE · 3 comments
Owner

사용자 피드백 #4: 느리고, 조작이 어렵게 느껴지므로, UI/UX를 전면 수정할 필요가 있음. 기존 구조에 로그는 백엔드로 빼고, 프로세스를 클릭할 때마다 새로운 창이 뜨는 것이 아니라 한 화면에서 바로 구동되게끔 적용.

현재 상태

  • 설계: UI_REDESIGN_PLAN.md (commit e9cc6bf, 374줄)
  • 구현 미적용 (multi-session 작업)

핵심 변경 계획

  1. 인라인 로그 패널 제거 — 현재 main_frame.row=1CTkTextbox (180회 호출). harness_log_path() 표준 백엔드 파일로 이동.
  2. CTkToplevel 12개 제거 — T1 (DXF 레이어), T2 (구조물 빌드), T8 (계획선 고도), T9 (TIN 이용 범위 — interactive matplotlib canvas) 등.
  3. 단일 VTK 임베딩vtkmodules.tk.vtkTkRenderWidget 또는 PyQt + pyvistaqt.QtInteractor 도입. 현재 pv.Plotter().show() 6개 호출지 모두 통합.
  4. 3-column 레이아웃 — Sidebar (240) / Main Canvas (flex) / Inspector (340).
  5. messagebox 63회 → 인라인 토스트/배너 (위험한 askyesno 4건만 모달 유지).

의존성

  • PyQt5 또는 PySide6 (선택 시 pyproject.toml extras 추가).
  • pyvistaqt>=0.11.
**사용자 피드백 #4**: 느리고, 조작이 어렵게 느껴지므로, UI/UX를 전면 수정할 필요가 있음. 기존 구조에 로그는 백엔드로 빼고, 프로세스를 클릭할 때마다 새로운 창이 뜨는 것이 아니라 한 화면에서 바로 구동되게끔 적용. ## 현재 상태 - ✅ 설계: `UI_REDESIGN_PLAN.md` (commit `e9cc6bf`, 374줄) - ❌ 구현 미적용 (multi-session 작업) ## 핵심 변경 계획 1. **인라인 로그 패널 제거** — 현재 `main_frame.row=1` 의 `CTkTextbox` (180회 호출). `harness_log_path()` 표준 백엔드 파일로 이동. 2. **CTkToplevel 12개 제거** — T1 (DXF 레이어), T2 (구조물 빌드), T8 (계획선 고도), T9 (TIN 이용 범위 — interactive matplotlib canvas) 등. 3. **단일 VTK 임베딩** — `vtkmodules.tk.vtkTkRenderWidget` 또는 PyQt + `pyvistaqt.QtInteractor` 도입. 현재 `pv.Plotter().show()` 6개 호출지 모두 통합. 4. **3-column 레이아웃** — Sidebar (240) / Main Canvas (flex) / Inspector (340). 5. **messagebox 63회** → 인라인 토스트/배너 (위험한 askyesno 4건만 모달 유지). ## 의존성 - PyQt5 또는 PySide6 (선택 시 `pyproject.toml` extras 추가). - `pyvistaqt>=0.11`.
Author
Owner

1차 라운드 진행 (commit 5a44c90)

사용자 요청: 색감/텍스쳐 위주 — Mastercard 디자인 시스템 적용 + 인트로 비디오 제거.

완료 (이번 라운드)

Mastercard 팔레트 적용 (50+ hex literal 갱신):

  • #EB001B Mastercard Red — 주 CTA, 에러 status (orange CTA + Bootstrap red 통합).
  • #F79E1B Mastercard Yellow — 경고 status (Bootstrap yellow 대체).
  • #22A06B Brand-friendly Green — READY/완료 인디케이터.
  • #1A1A1A Near-black — 다크 모드 페이지/카드 bg, 다크 버튼.
  • #A30013 / #1B8454 / #000000 — hover/active 변종.
  • scanvas_maker.py line ~33-47 에 팔레트 의도 주석 블록.
  • npx getdesign@latest add mastercard 시도는 외부 npm 실행 차단으로 건너뛰고 공개 brand 가이드라인 적용.

인트로 비디오 제거:

  • splash.py 삭제 (178 LOC).
  • Design/logo_intro.mp4 삭제 (3.7 MB).
  • 메인 앱 즉시 기동 (12초 fade-in 인트로 사라짐).

🟡 잔여 (다음 multi-session 라운드)

  • 단일 창 구조: 12개 CTkToplevel (T1~T12) → 인스펙터 패널 통합.
  • 인라인 로그 패널 제거: main_frame.row=1 CTkTextboxharness_log_path() 백엔드 파일.
  • VTK 임베딩: 6개 pv.Plotter().show()vtkmodules.tk.vtkTkRenderWidget 또는 pyvistaqt.QtInteractor.
  • 3-column 레이아웃: Sidebar(240) / Canvas(flex) / Inspector(340).
  • messagebox 63회 → 인라인 토스트/배너 (위험 4건 askyesno 만 모달 유지).

구조 overhaul 은 단일 세션 범위 초과 — 본 이슈 open 유지. UI_REDESIGN_PLAN.md §3 가 다음 라운드 청사진.

## 1차 라운드 진행 (commit `5a44c90`) 사용자 요청: 색감/텍스쳐 위주 — Mastercard 디자인 시스템 적용 + 인트로 비디오 제거. ### ✅ 완료 (이번 라운드) **Mastercard 팔레트 적용 (50+ hex literal 갱신)**: - `#EB001B` Mastercard Red — 주 CTA, 에러 status (orange CTA + Bootstrap red 통합). - `#F79E1B` Mastercard Yellow — 경고 status (Bootstrap yellow 대체). - `#22A06B` Brand-friendly Green — READY/완료 인디케이터. - `#1A1A1A` Near-black — 다크 모드 페이지/카드 bg, 다크 버튼. - `#A30013` / `#1B8454` / `#000000` — hover/active 변종. - `scanvas_maker.py` line ~33-47 에 팔레트 의도 주석 블록. - `npx getdesign@latest add mastercard` 시도는 외부 npm 실행 차단으로 건너뛰고 공개 brand 가이드라인 적용. **인트로 비디오 제거**: - `splash.py` 삭제 (178 LOC). - `Design/logo_intro.mp4` 삭제 (3.7 MB). - 메인 앱 즉시 기동 (12초 fade-in 인트로 사라짐). ### 🟡 잔여 (다음 multi-session 라운드) - **단일 창 구조**: 12개 `CTkToplevel` (T1~T12) → 인스펙터 패널 통합. - **인라인 로그 패널 제거**: `main_frame.row=1` `CTkTextbox` → `harness_log_path()` 백엔드 파일. - **VTK 임베딩**: 6개 `pv.Plotter().show()` → `vtkmodules.tk.vtkTkRenderWidget` 또는 `pyvistaqt.QtInteractor`. - **3-column 레이아웃**: Sidebar(240) / Canvas(flex) / Inspector(340). - **`messagebox` 63회** → 인라인 토스트/배너 (위험 4건 askyesno 만 모달 유지). 구조 overhaul 은 단일 세션 범위 초과 — 본 이슈 open 유지. UI_REDESIGN_PLAN.md §3 가 다음 라운드 청사진.
Author
Owner

UI 2차 라운드 진행 (commit fc96300)

추가 (이번 라운드)

진행률 인디케이터 (피드백 #4 "느리게 느껴짐" 직접 대응):

  • self.progress_bar = ctk.CTkProgressBar(self.status_bar, mode="indeterminate", width=180, height=10, progress_color="#FF5F00") — MC overlap orange.
  • 기본 hidden (pack 안 함). start_progress(label) / stop_progress(final_label) 메서드로 토글.
  • self.after(0, ...) 로 메인 thread 안전.

로그 패널 비중 축소:

  • self.textbox height 12080. 캔버스 영역 확보.
  • 주석에 백엔드 파일 경로 (%LOCALAPPDATA%\\S-CANVAS\\scanvas_harness.log + logs/scanvas.log) 명시 — 인라인 로그가 점차 보조 역할로 이전.

🟡 잔여 (#4 next round, multi-session)

  • start_progress/stop_progress wire: capture pipeline / 위성 타일 / TIN densify 호출지에 적용.
  • 메인 thread 블로킹 → worker thread 분리: 그래야 progress animation 실제 동작.
  • 12개 CTkToplevel 통합: T1~T12 → Inspector 패널 (340px) 컬럼.
  • 인라인 로그 패널 완전 제거 또는 toggle: 디스크 로그가 주, GUI는 선택.
  • VTK 임베딩: 6개 pv.Plotter().show()vtkmodules.tk.vtkTkRenderWidget 또는 pyvistaqt.QtInteractor.
  • messagebox 63회 → 인라인 토스트.

구조 overhaul 은 단일 세션 범위 초과. open 유지.

## UI 2차 라운드 진행 (commit `fc96300`) ### ✅ 추가 (이번 라운드) **진행률 인디케이터** (피드백 #4 "느리게 느껴짐" 직접 대응): - `self.progress_bar = ctk.CTkProgressBar(self.status_bar, mode="indeterminate", width=180, height=10, progress_color="#FF5F00")` — MC overlap orange. - 기본 hidden (pack 안 함). `start_progress(label)` / `stop_progress(final_label)` 메서드로 토글. - `self.after(0, ...)` 로 메인 thread 안전. **로그 패널 비중 축소**: - `self.textbox` height `120` → `80`. 캔버스 영역 확보. - 주석에 백엔드 파일 경로 (`%LOCALAPPDATA%\\S-CANVAS\\scanvas_harness.log` + `logs/scanvas.log`) 명시 — 인라인 로그가 점차 보조 역할로 이전. ### 🟡 잔여 (#4 next round, multi-session) - **`start_progress`/`stop_progress` wire**: capture pipeline / 위성 타일 / TIN densify 호출지에 적용. - **메인 thread 블로킹 → worker thread 분리**: 그래야 progress animation 실제 동작. - **12개 `CTkToplevel` 통합**: T1~T12 → Inspector 패널 (340px) 컬럼. - **인라인 로그 패널 완전 제거 또는 toggle**: 디스크 로그가 주, GUI는 선택. - **VTK 임베딩**: 6개 `pv.Plotter().show()` → `vtkmodules.tk.vtkTkRenderWidget` 또는 `pyvistaqt.QtInteractor`. - **`messagebox` 63회** → 인라인 토스트. 구조 overhaul 은 단일 세션 범위 초과. open 유지.
Author
Owner

UI 3차 라운드 — 사용자 명시 요청 핵심 적용 (commit 1fcbf14)

사용자 요청: "기존 구조에 지도 아래에 있는 로그는 백엔드로 빼고, 프로세스를 클릭할 때마다 새로운 창이 뜨는 것이 아니라 한 화면에서 바로 구동되게끔 적용".

1. 인라인 로그 패널 완전 제거

  • self.textbox CTkTextbox 위젯 제거 (이전 라운드 120→80 축소 → 본 라운드 완전 삭제).
  • 레이아웃 재배치: main_frame row 0 weight 3→1 (지도 전체 차지), row 1 (로그) 제거, status_bar row 2→1.
  • self.log() 동작 변경: 백엔드 logger 만 (logs/scanvas.log RotatingFileHandler 5MB×5). status_bar 의 status_text 가 짧은 미리보기 (≤80자) 즉시 표시 — 사용자 진행 상황은 보이되 인라인 패널은 사라짐.
  • 효과: 메인 캔버스 영역 ~25% 확대.

2. harness/inline_panel.py 신규 (231 LOC)

  • InlinePanel(ctk.CTkFrame)ctk.CTkToplevel 호환 drop-in 대체. main_frame 안 floating frame 으로 렌더.
  • 호환 API: title/geometry/transient/grab_set/protocol(WM_DELETE_WINDOW)/wait_window/destroy + iconbitmap/wm_* no-op.
  • 핵심 트릭: tk.Misc.wait_window(self) 가 Frame 에서도 동작 (widget destruction 대기 메커니즘) — wait_window 호출 5곳 (T1/T6/T7/T8/T10) 그대로 유지.
  • 다중 패널 z-order (_z_counter + lift()), main_frame 95% cap, MC Red 타이틀 바 (#EB001B + ✕ 버튼).

3. 12 CTkToplevelInlinePanel 일괄 치환

# line 용도
T1 851 DXF 레이어 분류 (900×650)
T2 1504 구조물 상세 3D 빌드 (1100×650)
T3 1681 빌드 진행
T4 1974 렌더 옵션 (T3 자식)
T5 2129 VLM 결과 (T3 자식)
T6 2451 상세도면 업로드
T7 2571 치수 확인 (650×500)
T8 2808 계획선 고도 설정 (1280×560)
T9 4710 TIN 이용 범위 (1100×920)
T10 6625 렌더링 옵션 (380×360)
T11 6985 Blender 결과
T12 7058 AI 렌더 결과

12 popup 모두 별도 OS 창 없이 main 창 안에서 동작 — 사용자가 ALT-TAB 으로 창 사이 오갈 필요 없음.

검증

  • python -m py_compile + AST parse OK (4 modules).
  • ruff check scanvas_maker.py harness/: All checks passed (0 errors).
  • import scanvas_maker smoke test 성공 — InlinePanel 이 진짜 harness 클래스로 로드.
  • 잔존 검사: self.textbox refs 0, CTkToplevel refs 3 (모두 import fallback/주석), InlinePanel refs 15.

🟡 잔여 (open 유지)

  • InlinePanel 실 GUI 워크플로 검증: 자동 import OK 지만 사용자가 도면 로드 → T1~T12 한 번씩 돌려봐야 grab_set / wait_window 시뮬레이션 실효성 확인. Auto-test 아닌 manual smoke test 필요.
  • VTK 임베딩 (6개 pv.Plotter().show()pyvistaqt.QtInteractor) — PyQt 의존성 추가 필요.
  • messagebox 63회 → 인라인 토스트 (위험 4건 askyesno 만 모달).
  • Inspector 패널 영구 컬럼 (3-column 레이아웃, UI_REDESIGN_PLAN.md §2.1).
  • 메인 thread 블로킹 작업 worker thread 분리 — progress_bar animation 실 동작.

사용자 핵심 요청 2건 ("로그 백엔드로" + "한 화면에서 바로 구동") 모두 코드 반영 + git 기록 완료. 본 이슈는 잔여 항목 때문에 open 유지.

## UI 3차 라운드 — **사용자 명시 요청 핵심 적용** (commit `1fcbf14`) 사용자 요청: "기존 구조에 지도 아래에 있는 로그는 백엔드로 빼고, 프로세스를 클릭할 때마다 새로운 창이 뜨는 것이 아니라 한 화면에서 바로 구동되게끔 적용". ### ✅ 1. 인라인 로그 패널 완전 제거 - `self.textbox` CTkTextbox 위젯 제거 (이전 라운드 120→80 축소 → 본 라운드 **완전 삭제**). - 레이아웃 재배치: `main_frame` row 0 weight 3→1 (지도 전체 차지), row 1 (로그) 제거, status_bar row 2→1. - `self.log()` 동작 변경: 백엔드 logger 만 (`logs/scanvas.log` RotatingFileHandler 5MB×5). status_bar 의 `status_text` 가 짧은 미리보기 (≤80자) 즉시 표시 — 사용자 진행 상황은 보이되 인라인 패널은 사라짐. - 효과: 메인 캔버스 영역 ~25% 확대. ### ✅ 2. `harness/inline_panel.py` 신규 (231 LOC) - `InlinePanel(ctk.CTkFrame)` — `ctk.CTkToplevel` 호환 drop-in 대체. main_frame 안 floating frame 으로 렌더. - 호환 API: `title`/`geometry`/`transient`/`grab_set`/`protocol(WM_DELETE_WINDOW)`/`wait_window`/`destroy` + `iconbitmap`/`wm_*` no-op. - 핵심 트릭: `tk.Misc.wait_window(self)` 가 Frame 에서도 동작 (widget destruction 대기 메커니즘) — `wait_window` 호출 5곳 (T1/T6/T7/T8/T10) 그대로 유지. - 다중 패널 z-order (`_z_counter` + `lift()`), main_frame 95% cap, MC Red 타이틀 바 (`#EB001B` + ✕ 버튼). ### ✅ 3. 12 `CTkToplevel` → `InlinePanel` 일괄 치환 | # | line | 용도 | |---|---|---| | T1 | 851 | DXF 레이어 분류 (900×650) | | T2 | 1504 | 구조물 상세 3D 빌드 (1100×650) | | T3 | 1681 | 빌드 진행 | | T4 | 1974 | 렌더 옵션 (T3 자식) | | T5 | 2129 | VLM 결과 (T3 자식) | | T6 | 2451 | 상세도면 업로드 | | T7 | 2571 | 치수 확인 (650×500) | | T8 | 2808 | 계획선 고도 설정 (1280×560) | | T9 | 4710 | TIN 이용 범위 (1100×920) | | T10 | 6625 | 렌더링 옵션 (380×360) | | T11 | 6985 | Blender 결과 | | T12 | 7058 | AI 렌더 결과 | **12 popup 모두 별도 OS 창 없이 main 창 안에서 동작** — 사용자가 ALT-TAB 으로 창 사이 오갈 필요 없음. ### 검증 - `python -m py_compile` + AST parse OK (4 modules). - `ruff check scanvas_maker.py harness/`: All checks passed (0 errors). - `import scanvas_maker` smoke test 성공 — InlinePanel 이 진짜 harness 클래스로 로드. - 잔존 검사: `self.textbox` refs **0**, `CTkToplevel` refs 3 (모두 import fallback/주석), `InlinePanel` refs 15. ### 🟡 잔여 (open 유지) - **InlinePanel 실 GUI 워크플로 검증**: 자동 import OK 지만 사용자가 도면 로드 → T1~T12 한 번씩 돌려봐야 grab_set / wait_window 시뮬레이션 실효성 확인. **Auto-test 아닌 manual smoke test 필요**. - VTK 임베딩 (6개 `pv.Plotter().show()` → `pyvistaqt.QtInteractor`) — PyQt 의존성 추가 필요. - `messagebox` 63회 → 인라인 토스트 (위험 4건 askyesno 만 모달). - Inspector 패널 영구 컬럼 (3-column 레이아웃, UI_REDESIGN_PLAN.md §2.1). - 메인 thread 블로킹 작업 worker thread 분리 — progress_bar animation 실 동작. --- 사용자 핵심 요청 2건 ("로그 백엔드로" + "한 화면에서 바로 구동") 모두 코드 반영 + git 기록 완료. 본 이슈는 잔여 항목 때문에 open 유지.
Sign in to join this conversation.
No Label
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: HYUNJUNGLEE/s-canvas#4