콘텐츠로 이동

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 등을 관리