[정보처리기사 실기] 02. 화면 설계 (빈칸버전)

이 게시글은 정보처리기사 실기 준비를 위해 수제비책과 ToDev님 블로그를 참조했으며

N번째 시험을 겪으며 중요하다고 느껴지는 개념을 위주로 담았고

이번 시험이 마지막이길 기원하며 정리한 글입니다.

개념의 설명을 보고 어떤 개념인지 유추하고 맞춰보며 학습하도록 빈칸을 쳐 놓았습니다.

드래그를 통해 답을 맞춰보실 수 있습니다.

---

01 UI 요구사항 확인

▶ UI 설계 원칙(직유학유)

⦁  직관성(Intuitiveness) : 누구나 쉽게 이해하고, 쉽게 사용할 수 있어야 한다.

⦁  유효성(Efficiency) : 정확하고 완벽하게 사용자의 목표가 달성 될 수 있도록 제작한다.

⦁  학습성(Learnability) : 모두가 쉽게 배우고 사용할 수 있어야 한다.

⦁  유연성(Flexibility) : 사용자의 인터랙션을 최대한 포용하고, 실수를 방지할 수 있도록 제작

 

▶ UI 설계 지침

⦁  단순성 : 조작 방법은 가장 간단하게 작동되도록 해 인지적 부담 최소화

⦁  가시성 : 주요 기능을 메인 화면에 노출해 쉬운 조작이 가능해야 함

⦁  일관성 : 사용자가 기억하기 쉽고 빠르게 습득할 수 있도록 설계

⦁  명확성 : 사용자가 개념적으로 쉽게 인지해야 함

 

▶ UI 품질 요구사항(ISO/IEC 9126 기반)

⦁  기능성(Functionality) : 적절성, 정밀성, 상호 운용성, 보안성, 호환성

⦁  신뢰성(Reliability) : 성숙성, 고장 허용성, 회복성

⦁  사용성(Usability) : 이해성, 학습성, 운용성

⦁  효율성(Efficiency) : 시간 효율성, 자원 효율성

⦁  유지보수성(Maintainability) : 분석성, 변경성, 안정성, 시험성

⦁  이식성(Portability) : 적용성, 설치성, 대체성

 

▶ UI 개발을 위한 주요 기법

⦁  3C 분석 : 고객(Customer), 자사(Company), 경쟁사(Competitor) 비교하고 분석

⦁  SWOT 분석 : 기업 내부 환경과 외부환경을 분석해 Strength, Weakness, Opportunity, Threat 요인을 규정하고 이를 토대로 경영 전략 수립

⦁  시나리오 플래닝 : 상황 변화를 사전에 예측하고 다양한 시나리오 설계하는 방법

⦁  사용성 테스트(Usability Test) : 사용자가 직접 제품을 사용하면서 미리 작성된 시나리오에 맞추어 과제를 수행 한 후, 질문에 답하도록 하는 테스트

 

▶ UI 화면 설계 구분

⦁  스토리 보드 : 정책, 프로세스, 와이어 프레임, 기능 정의, 데이터베이스 연동 등 서비스 구축을 위한 정보가 수록된 문서, 디자이너와 개발자가 최종적으로 참고하는 산출 문서

⦁  와이어 프레임 : 화면 단위의 레이아웃을 설계한는 작업

⦁  프로토타입 : 정적인 화면(와이어 프레임, 스토리보드)에 동적 효과를 적용해 실제 구현된 것처럼 시뮬레이션 할 수 있는 모형

 

 

02 UI 설계

▶ UML(Unified Modeling Language)

객체지향 소프트웨어 개발 과정에서 산출물을 명세화, 시각화, 문서화 할 때 사용되는 모델링 기술과 방법론을 통합해서 만든 표준화된 범용 모델링 언어

 

▶ UML의 구성요소

사물(Things),    관계(Relationships),    다이어그램(Diagrams)

 

▶ UML 다이어그램

◇ 구조적(Structural) 다이어그램 / 정적(Static) 다이어그램

⦁  클래스 : 클래스의 속성 및 연산과 클래스 간 정적 관계를 표현한 다이어그램

⦁  객체 : 클래스에 속한 사물, 인스턴스

⦁  컴포넌트 : 컴포넌트와 그들 사이의 의존 관계

⦁  배치(Deployment) : 컴포넌트 사이의 종속성, 물리적 요소들의 위치

⦁  복합체 구조(Composite Structure) : 클래스나 컴포넌트가 복합 구조를 갖는 경우 그 내부 구조를 표현하는 다이어그램

⦁  패키지 : 유스케이스나 클래스 등의 모델 요소들을 그룹화한 패키지들의 관계, 서로 다른패키지들 사이의 의존 관계 표현

 

◇ 행위적(Behavioral) 다이어그램/ 동적(Dynamic) 다이어그램

⦁  유스케이스 : 시스템이 제공하고 있는 기능 관련된 외부 요소를 사용자의 관점에서 표현

⦁  시퀀스(Sequence) : 객체 간 상호작용을 시간적 개념을 중심으로 메시지 흐름으로 표현

⦁  커뮤니케이션 : 동작에 참여하는 객체들이 주고받는 메시지, 객체 간의 연관

⦁  상태(State) : 상호작용에 따라 상태가 어떻게 변화하는지

⦁  활동(Activity) : 어떤 기능을 수행하는지, 객체의 처리 로직, 조건에 따른 처리의 흐름

⦁  타이밍 : 객체 상태 변화와 시간 제약을 명시적으로 표현

 

▶ UML - 클래스 간의 관계

⦁  연관 관계(Association) : 2개 이상의 사물이 서로 관련되어있는 상태

⦁  집합 관계(Aggreation) : 하나의 객체에 여러 개의 독립적인 객체들이 구성

⦁  복합 관계(Composition) : 영구적, 집합 관계보다 더 강한 관계 (포함하는 사물의 변화가 포함되는 사물에게 영향을 미치는 관계)

⦁  일반화 관계(Generalization) : 하나의 사물이 다른 사물에 비해 더 일반적인지 구체적인지 표현(부모클래스,자식클래스)

⦁  의존 관계(Dependency) : 하나의 클래스가 또 다른 클래스 사용, 하나의 클래스의 인자가 변하면 다른 클래스에 영향을 미치는 관계

 

▶ UML - 패키지 다이어그램

시스템의 서로 다른 패키지들 사이의 의존 관계를 표현하기 위한 다이어그램

 

▶ UI 시나리오 문서의 작성 요건

완전성, 일관성, 이해성, 가독성, 추적 용이성, 수정 용이성