정보처리기사 실기 02. 화면 설계
UI 요구사항 확인
* UI (User Interface) : 사용자와 시스템 사이에서 의사소통할 수 있도록 고안된 물리적, 가상의 매개체
* UI 유형
- CLI(Command Line Interface) : 명령어를 텍스트로 입력하여 조작하는 사용자 인터페이스
- GUI(Graphical User Interface) : 그래픽 환경을 기반으로 한 마우스나 전자 펜을 이용한 사용자 인터페이스
- NUI(Natural User Interface) : 신체부위를 이용하는 사용자 인터페이스
- OUI(Organic User Interface) : 현실에 존재하는 모든 사물이 입출력 장치로 변화할 수 있는 사용자 인터페이스
* UI 설계 원칙
- 직관성 : 누구나 쉽게 이해하고, 쉽게 사용할 수 있어야 한다.
- 유효성 : 사용자의 목적을 정확하고 완벽하게 달성해야 한다.
- 학습성 : 누구나 쉽게 배우고 익힐 수 있어야 한다.
- 유연성 : 사용자의 요구사항을 최대한 수용하고 실수를 최소화해야 한다.
* UI 설계 지침 : 사용자 중심, 일관성, 단순성, 결과 예측 가능, 가시성, 표준화, 접근성, 명확성, 오류 발생 해결
* UI 설계 도구
- 와이어프레임(Wireframe) : 기획단계의 초기에 제작하는 것, 뼈대를 설계
- 목업(Mockup) : 실제 화면과 유사하게 만든 정적인 형태의 모형. 실제로 구현 X
- 스토리보드(story Board) : 와이어프레임에 콘텐츠에 대한 설명, 페이지 간 이동 흐름 등을 추가한 문서
- 프로토타입(Prototype) : 인터렉션을 적용함으로써 실제 구현된 것처럼 테스트가 가능한 동적인 형태의 모형
- 유스 케이스(Use Case) : 사용자 측면에서 요구사항으로 사용자가 원하는 목표를 달성하기 위해 수행할 내용을 기술
UI 표준 및 지침
* UI 표준 : 전체 시스템에 포함된 모든 UI에 공통적으로 적용될 내용으로, 화면 구성이나 화면 이동 등이 포함된다.
- 리치 클라이언트 : 소프트웨어 실행을 클라이언트가 책임지는 기술
- 씬 클라이언트 : 소프트웨어 실행을 전적으로 서버가 책임지는 기술
- SSO(single Sign On) : 한 번의 로그인을 통해 다른 사이트에 자동으로 접속하여 이용하는 방법
* UI 지침 : UI 요구사항, 구현 시 제약사항 등 UI 개발 과정에서 꼭 지켜야 할 공통의 조건을 의미
* UI 개발 주요 기법
- 3C분석 : 고객, 경쟁사, 자가분석
- SWOT : 강점, 약점, 기회, 위협 분석
- 시나리오 플래닝 : 불확실성이 높은 상황 변화를 예측하고 다양한 시나리오 설계
- 사용성 테스트 : 사용자가 직접 제품을 사용하면서 미리 작성된 시나리오에 맞춰 과제를 수행한 후 답하는 테스트
- 워크숍 : 소규모 과제, 회의 (세미나)
* 사용자 요구사항 도출
- 페르소나 : 잠재적인 사용자의 다양한 목적과 관찰된 행동 패턴을 응집시켜 놓은 가상의 사용자
- 콘셉트 모델 정의(브레인스토밍)
- 요구사항 매트릭스 : 페르소나의 목적을 기준으로 데이터 요구, 기능의 기반으로 만든 요구사항 표
- 정황 시나리오 : 요구사항 정의에 사용되는 초기 시나리오
- 이상적인 시스템 동작에 초점을 맞추는 시나리오
UI 요구사항
* UI 요구사항 확인 : 목표 정의 -> 활동사항 정의 -> UI 요구사항 작성
* UI 품질 요구사항(ISO/IEC 9126 기반)
- 기능성 : 실제 수행 결과와 품질 요구사항과의 차이를 분석, 시스템 동작을 관찰하기 위한 품질 기준
+ 적절성, 정밀성, 상호 운용성, 보안성, 호환성
- 신뢰성 : 시스템이 일정한 시간 또는 작동되는 시간 동안 의도하는 기능을 수행함을 보증하는 품질 기준
+ 성숙성, 고장 허용성, 회복성
- 사용성 : 사용자와 컴퓨터 사이에 발생하는 어떠한 행위를 정확하고 쉽게 인지할 수 있는 품질 기준
+ 이해성, 학습성, 운용성
- 효율성 : 할당된 시간에 한정된 자원으로 얼마나 빨리 처리할 수 있는가에 대한 품질 기준
+ 시간 효율성, 자원 효율성
- 유지보수성 : 요구사항을 개선하고 확장하는 데 있어 얼마나 용이한가에 대한 품질 기준
+ 분석성, 변경성, 안정성, 시험성
- 이식성 : 다른 플랫폼에서도 추가 작업 없이 얼마나 쉽게 적용 가능한가에 대한 품질 기준
+ 적용성, 설치성, 대체성
UML(Unified Modeling Language)
* UML : 개발자들이 원활한 의사소통을 하기 위해 고안된 표준화 통합 모델링 언어
* 구성요소 : 사물, 관계. 다이어그램
- 사물
+ 구조 : 시스템의 개념적, 물리적 요소를 표현, (클래스, 유스 케이스, 컴포넌트, 노드)
+ 행동 : 시간과 공간에 따른 요소들의 행위를 표현, (상호작용, 상태 머신 등)
+ 그룹 : 요소들을 그룹으로 묶어서 표현 (패키지 package)
+ 주해 : 부가적인 설명이나 제약조건 등을 표현 (노트 note)
- 관계
+ 연관 관계 : 2개 이상 사물이 서로 관련 ( 소유자 -> 소유물 )
+ 집합 관계 : 하나의 사물이 다른 사물에 포함 ( 포함하는 쪽 ◇- 포함되는 쪽 )
+ 포함 관계 : 포함하는 사물의 변화가 포함되는 사물에게 영향을 미치는 관계 ( 포함하는 쪽 ◆- 포함되는 쪽 )
+ 일반화 : 상속 관계 ( 일반적 [상위] ◁- 구체적 [하위] )
+ 의존 관계 : 필요에 의해 짧은 기간 동안 관계 유지 ( 영향 주는 [이용자] ·····> 영향받는 [제공자] )
+ 실체화 : 서로를 그룹화할 수 있는 인터페이스(기능) ( 행동 및 기능 ◁····· 사물 )
- 다이어그램
= 구조적 다이어그램
+ 클래스 : 시스템의 구조를 파악하고 구조상의 문제점을 도출할 수 있다.
+ 객체 : 클래스에 속한 사물(객체)들, 인스턴스(Instance)를 특정 시점의 객체와 객체 사이의 관계로 표현
+ 컴포넌트 : 구현 단계에서 사용되는 다이어그램. 인터페이스를 표현.
+ 배치 : 구현 단계에서 사용되는 다이어그램
+ 복합체 구조 : 내부 구조를 표현
+ 패키지 : 유스 케이스나 클래스 등의 모델 요소들을 그룹화한
= 행위 다이어그램
+ 유스 케이스 : 사용자의 요구를 분석하는 것으로 기능 모델링 작업에 사용
+ 시퀀스 : 상호 작용하는 시스템이나 객체들이 주고받는 메시지를 표현
+ 커뮤니티케이션 : 시퀀스와 같이 동작에 참여하는 객체들이 주고받는 메시지뿐만 아니라 연관까지 표현
+ 상태 : 자신이 속한 클래스의 상태 변화 혹은 다른 객체와의 상호 작용에 따라 어떻게 변화하는지를 표현
+ 활동 : 시스템이 어떤 기능을 수행하는지 객체의 처리 로직이나 조건에 따른 처리의 흐름을 순서에 따라 표현
+ 상호작용 개요 : 상호작용 다이어그램 간의 제어 흐름을 표현
+ 타이밍 : 객체 상태 변화와 시간 제약을 명시적으로 표현.
유스 케이스 (USE CASE) 다이어그램
- 기능 모델링이며, 기능을 사용자의 관점에서 표현한 것.
- 시스템 범위, 액터, 유스 케이스, 관계로 구성
+ 포함 관계 : 새롭게 만든 포함되는 유스 케이스 쪽으로 점선 화살 연결 후 <<include>>라고 표기
+ 확장 관계 : 원래의 유스 케이스 쪽으로 점선 화살표, <<extends>>표기
활동 (Activity) 다이어그램
- 자료 흐름도와 유사하며, 사용자의 관점에서 시스템이 수행하는 기능을 처리 흐름에 따라 순서대로 표현
- 액션, 액티비티, 노드, 스윔 레인 등으로 구성
+ 시작 노드 : ●
+ 조건 노드 : ◇
+ 포크 노드 : →|↗↘(들어오는 건 하나 나가는 건 두 개)
+ 액션 또는 액티비티 : □
+ 종료 노드 : ⊙
클래스(Class) 다이어그램
- 정적 모델링이며(논리적인 구조를 표현) 제약조건, 클래스 사이의 관계를 표현한 것,
+ public : +
+ private : -
+ protected : #
+ package : ~
시퀀스(Sequence) 다이어그램
- 동적 모델링이며(변화하는 과정과 상호작용을 표현) 객체들이 메시지를 주고받으며 시간의 흐름에 따라 상호작용하는 과정을 사용하여 그림으로 표현한 것
- 액터, 객체, 라이프라인, 활성 상자, 메시지 등으로 구성
+ -▶ : 동기, 메시지를 보낸 후 결과가 반환될 때까지 기다림
+ -> : 비동기, 메시지를 보낸 후 결과가 반환될 때까지 기다리지 않고 다른 작업을 수행
+ ·····> : 생성, 메시지를 받는 새로운 객체를 생성
+ ·····▶: 응답, 동기 메시지의 대한 수행 결과이다.
커뮤니케이션(Communication) 다이어그램
- 커뮤니케이션 다이어그램은 시스템이나 객체들이 메시지를 주고받으며, 상호작용하는 과정을 그림으로 표현한 것.
- 액터, 객체, 링크, 메시지
상태(State) 다이어그램
- 객체들 사이에 발생하는 이벤트에 의한 객체들의 상태 변화를 그림으로 표현한 것.
- 상태, 이벤트, 상태 전환
'기타 > 정보처리기사실기' 카테고리의 다른 글
| [정보처리기사 실기 / 내용정리] 05. 인터페이스 구현 (0) | 2022.04.16 |
|---|---|
| [정보처리기사 실기 / 내용정리] 04. 통합 구현 (0) | 2022.04.15 |
| [정보처리기사 실기 / 내용정리] 03. 데이터 입출력 구현 (0) | 2022.04.13 |
| [정보처리기사 실기/내용 정리] 01. 요구사항 확인 (0) | 2022.03.28 |
| 정보처리기사 실기 따기 대작전!! (0) | 2022.03.13 |