Dashboard_UI
본 문서는 로봇 드로잉 시스템 Plotto의 대시보드(Dashboard) UI 구성 요소와 각 인터랙션의 역할 및 제어 범위를 정의합니다.
Dashboard는 사용자 입력을 수집하여 Spine 모듈에 전달하고, Sketch 모듈을 통해 그 결과를 시각적으로 확인할 수 있도록 하는 중간 제어 인터페이스 역할을 수행합니다.
본 문서에서는 대시보드를 구성하는 버튼, 슬라이더, 파일 입력 위젯을 중심으로 각 UI 요소가 수행하는 기능과 시스템 내 위치를 설명합니다.
대시보드는 크게 다음 세 가지 기능으로 구성됩니다.
- 파일 및 데이터 입출력 (①, ⑨)
- 로봇 관절 및 펜 상태 제어 (②,③,④)
- 드로잉 실행 및 재생 제어 (⑤,⑥,⑦,⑧)
File Upload 위젯은 외부 SVG 파일이나 동작 txt 파일을 시스템으로 불러오기 위한 입력 요소입니다.
-
사용자는 파일을 선택하거나 드래그 앤 드롭 방식으로 업로드할 수 있습니다.
-
확장자가 SVG일 경우 Spine 모듈로 전달되어 파싱 단계로 진입하고, txt일 경우 동작 데이터를 시뮬레이터에 적용합니다.
-
파일 업로드 자체는 로봇 동작을 즉시 실행하지 않습니다.
Download TXT 버튼은 현재 시스템에 로드되었거나 생성된 로봇 동작 데이터를 외부 파일로 저장하기 위한 기능을 제공합니다.
- 저장되는 데이터는 Spine에서 관리하는 동작 시퀀스를 기반으로 합니다.
- 본 기능은 동작 기록, 재생을 위한 용도로 사용됩니다.
Joint UI Interaction 영역은 로봇의 관절 각도를 수동으로 조절하기 위한 슬라이더 기반 UI입니다.
- Joint 1, Joint 2는 각각 독립적인 입력 요소로 구성됩니다.
- 슬라이더 값은 실시간으로 Spine에 전달됩니다.
슬라이더 대신 키 입력 값을 통해서도 조작 가능합니다.
Joint 1은 좌·우, Joint 2는 상·하 방향키로 조절합니다.
이 영역은 수동 드로잉 모드를 위한 기본 입력 수단으로 사용됩니다.
Pen Down / Pen Up 버튼은 펜의 접촉 상태를 전환하기 위한 제어 요소입니다.
- Pen 상태는 관절 각도와 독립적으로 처리됩니다.
- 상태 변경은 즉시 Sketch에 반영됩니다.
- 펜 상태는 동작 데이터에 명시적으로 기록됩니다.
Erase 버튼은 현재 시뮬레이션 화면에 표시된 드로잉 결과를 초기화하는 기능을 제공합니다.
- Erase는 로봇의 관절 상태를 변경하지 않습니다.
시각화 결과만을 초기화합니다.
SVG Draw 버튼은 업로드된 파일을 기반으로 로봇 드로잉 동작을 실행합니다.
- SVG 파싱 및 동작 생성이 완료된 상태에서 사용됩니다.
- 드로잉은 정의된 기본 속도로 실행됩니다.
SVG Draw Fast 버튼은 SVG 기반 드로잉 동작을 가속된 속도로 실행하기 위한 제어 요소입니다.
- 동작 시퀀스는 동일하되, 실행 속도만 변경됩니다.
- 시뮬레이션 검증 및 테스트 용도로 사용됩니다.
SVG Draw All 버튼은 파일 내 모든 경로를 한 번에 처리합니다.
- 스케치 과정을 생략한 채 전체 결과를 볼 수 있습니다.
- 자동 드로잉 시나리오에서 사용됩니다.
Draw Manual 버튼은 스케치의 수동 모드입니다.
- 사용자의 관절 조작 입력을 직접 드로잉 동작으로 기록할 수 있습니다.
- Joint UI Interaction과 Pen 제어가 동시에 사용됩니다.
Dashboard에서 발생하는 모든 사용자 입력은 Spine 모듈을 통해 상태 및 동작 데이터로 변환됩니다.
- Spine: 입력 해석, 상태 관리, 동작 데이터 생성
- Sketch: 상태 기반 시각화
- Dashboard: 입력 수집 및 제어 인터페이스 제공
위 구조를 토대로 UI 변경과 로봇 동작 로직을 분리합니다.
본 문서에 정의된 Dashboard UI 구성은 향후 하드웨어 연동 및 기능 확장에 따라 일부 변경될 수 있습니다.
- 신규 제어 요소 추가
- 입력 장치 확장
- 블록/스크립트 컴포저 연동
변경 시에도 본 문서의 구성 원칙과 역할 정의를 유지하는 것을 기준으로 합니다.