본문 바로가기

정보처리기사 실기/화면 설계

UI 설계 도구

1. 와이어프레임(Wireframe)

(1) 페이지에 대한 개략적인 레이아웃이나 뼈대를 설계하는 도구

(2) 개발자나 디자이너 사이에 레이아웃을 협의하거나 진행 상태 공유하기 위하여 사용

(3) 페이지의 영역 구분, 콘텐츠, 텍스트 배치 등을 화면 단위로 설계

(4) 와이어프레임 툴 : 손그림, 파워포인트, 키노트, 스케치, 일러스트, 포토샵 등

 

2. 목업(Mockup)

(1) 실제 화면과 유사하게 만든 정적인 형태의 모형

(2) 디자인, 사용 방법 설명, 평가 등을 위해 만듬

(3) 목업 툴 : 파워 목업, 발사믹 목업 등

 

3. 스토리보드(Story Board)

(1) 와이어프레임에 콘텐츠에 대한 설명, 페이지 간 이동 흐름 등을 추가한 문서

(2) 스토리보드 툴 : 파워포인트, 키노트, 스케치, Axure 등

 

4. 프로토타입(Prototype)

실제 구현된 것처럼 테스트가 가능한 동적인 형태의 모형

 

* 종류

1) 페이퍼 프로토타입

- 스케치, 그림, 글 등을 이용하여 손으로 직접 작성하는 아날로그적인 방법

- 제작 기간 짧을 경우, 제작 비용이 적을 경우, 업무 협의가 빠를 경우 사용

 

2) 디지털 프로토타입

- 파워포인트, 아크로뱃, 비지오, 옴니그래플 등 과 같은 프로그램을 사용하여 작성하는 방법

- 재사용이 필요한 경우, 산출물과 비슷한 효과가 필요한 경우, 숙련된 전문가가 있을 경우 사용함

 

5. 유스케이스(Use Case)

사용자의 요구사항을 기능 단위로 표현하는 것

 

 

출처 :  정보처리기사 실기 2024 기본서 / 저자 : 길벗알앤디(김정준, 강윤석, 김용갑, 김우경)  / 출판사 : 길벗

'정보처리기사 실기 > 화면 설계' 카테고리의 다른 글

HCI / UX / 감성공학  (0) 2024.04.22
UI 설계  (0) 2024.04.22
품질 요구사항  (0) 2024.04.22
사용자 인터페이스  (0) 2024.04.22