U4A Workspace 기능 영역 개요 - UX Design¶
목적¶
U4A IDE Workspace의 UX Design 기능 영역 구성 및 주요 사용법을 이해하고 활용하기 위한 가이드입니다.
주요 화면¶

<사진 1> U4A IDE Workspace UX Design 디자인 영역
1. 추가 기능영역 메뉴¶
1.1 Style Class 메뉴¶

<사진 2> Style Class 메뉴
1.1.1 Theme-designer (추후 제공 예정)¶
1.1.2 Font Style Wizard - Detail¶
1.1.3 UI5 Predefined CSS - Detail¶
1.2 Utilities 메뉴¶
1.2.1 Select Browser Type - Detail¶
- 애플리케이션 실행을 위한 기본 브라우저 설정
1.2.2 OTR Manager - Detail¶
1.2.3 Video Record - Detail¶
- U4A Workspace 사용 중 화면 녹화
1.3 Edit 메뉴¶
1.3.1 CSS Editor - Detail¶
1.3.2 Javascript Editor - Detail¶
1.3.3 HTML Editor - Detail¶
1.3.4 Error Page Editor - Detail¶
1.3.5 Skeleton Src Setting - Detail¶
1.4 System 메뉴¶

<사진 3> System 메뉴
1.4.1 New Window - Detail¶
- 새로운 화면 열기
1.4.2 Close Window - Detail¶
- 현재 화면만 닫기
1.4.3 Options - Detail¶
- U4A Workspace 애플리케이션의 테마 및 CDN 설정
1.4.4 Logoff - Detail¶
- 모든 화면 닫기
1.5 Help 메뉴¶

<사진 4> Help 메뉴
1.5.1 Help Document - Detail¶
- U4A 솔루션의 상세 설명 제공
2. 보조 Toolbar 영역¶
- 현재 작업 중인 App. ID
- 작업 상태 (Change 또는 Display)
-
App. 상태 (Inactive 또는 Active) 정보 제공
-
Event 사용처, Model Binding, CSS Style Class 사용처 확인 가능
3. 사이드 Toolbar 영역¶
- Application 종료 및 UI Object 속성 확인
- UX Design 영역, 미리보기 영역, 선택 UI Object 영역 표시 순서 변경
- WorkSpace Version, Client, Host, System, User, Language 정보 제공
4. 메인 Toolbar 영역¶
- U4A IDE Design Toolkit에서 자주 사용하는 기능 제공
5. UX Design 영역¶
- App 화면 구성에 대한 UI 정보를 계층적으로 관리
- 체크박스를 통해 UI 구성 요소 선택 및 삭제 가능
6. 미리보기 영역¶
- UX Design에서 구성한 UI를 실시간으로 미리보기 제공
- WYSIWYG 개념 적용
7. 선택 UI Object 영역¶
- 선택된 UI Object의 개요 관리
- 추가 정보 조회 가능
- UI Samples 실행 및 Object ID 복사 기능 제공
8. 선택 UI Object 속성¶
- 선택된 UI Object의 Property, Event, Aggregation 등을 관리