[정보 처리 기사 실기 공부] UI 지침, 스토리 보드, 프로트타입, UML 다이어그램, UML 스테레오 타입

UI 설계 원칙 :

- 직관성(Intuitiveness) : 누구나 쉽게 이해하고 사용

- 유효성(efficiency) : 사용자의 목적을 정확하게 달성

- 학습성(learnability) : 누구나 쉽게 배우고 익힐 수 있어야 한다

- 유연성(flexibility) : 사용자의 요구사항을 최대한 수용하며 오류를 최소화

 

UI 품질 요구사항 중 사용성(Usability) 하위 3가지 특성

1) 이해성 : 소프트웨어의 논리적인 개념과 적용 가능성을 분간하는 데 필요한 사용자의 노력 정도

2) 학습성 : 소프트웨어 애플리케이션 익히는 데 필요한 사용자의 노력 정도

3) 운용성 : 소프트웨어 활용과 운용 통제에 필요한 사용자의 노력 정도

 

UI 설계 지침 :

사용자 중심 / 일관성 / 단순성 / 결과 예측 기능 / 가시성 / 표준화 / 접근성 / 명확성 / 오류 발생 해결

 

UI 지침이란?

UI 표준에 따라 사용자 인터페이스 설계, 개발 시 지켜야할 세부 사항을 규정하는 가이드라인

 

< 소프트웨어 개발 단계별 UI 지침 > 

1. 목표 정의 : 환경 분석 / UI 개발 목표 및 범위 정의

2. 프로젝트 계획 : 사용자 분석 및 니즈 조사

3. 요구사항 정의 : 사용자 요구사항 도출 / UI 컨셉션 정의

4. 설계 및 구현 : UI 상세 설계 / UI 화면 디자인 / UI 검증

5. 테스트 : 사용성 테스트 실행, 결과 분석

6. 배포 및 관리 : 메뉴얼 배포, 관리

 

UI 개발을 위한 주요 기법 :

3C 분석, SWOT 분석, 시나리오 플래닝, 사용성 테스트, 워크숍

 

사용자 요구사항 도출 :

페르소나 정의, 콘셉트 모델 정의, 사용자 요구사항 정의, UI 컨셉션 

 

사용성 테스트 :

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

 

스토리 보드란?

UI 화면 설계를 위해서 정책이나 프로세스 및 콘텐츠의 구성, 와이어프레임(UI, UX), 기능에 대한 정의, 데이터베이스의 연동 등 구축하는 서비스를 위한 대부분 정보가 수록된 문서

UI 화면 설계를 위해서는 와이어프레임, 스토리보드, 프로트타입이 활용

 

- 와이어 프레임 : 화면 구성 협의하거나 서비스 간략 흐름 공유를 위해 화면 단위의 레이아웃 설계 작업 (파워포인트/키노트/스케치/일러스트)

- 스토리 보드 : 정책, 프로세스 등 서비스 구축을 위한 모든 정보가 담겨 있는 설계 산출물 (파워포인트/키노트/스케치)

- 프로트타입 : 정적인 화면으로 설계된 와이어프레임, 스토리 보드 + 정적 효과 적용 (HTML/CSS)

 

스토리보드 작성 정차 :

전체 개요 작성 -> 서비스 흐름 작성 -> 스타일 확정 -> 메뉴별 화면 설계도 작성 및 상세 설명 -> 추가 관련 정보 작성

 

프로트타입이란?

컴퓨터 시스템이나 소프트웨어의 설계 또는 성능, 구현 가능성, 운용 가능성을 평가하거나 요구사항을 좀 더 잘 이해하고 결정하기 위하여 전체적인 기능을 간략한 형태로 구현한 시제품

 

UI 품질 요구사항 중 기능성(Functionality) 하위 2가지 특성

1) 적절성 : 소프트웨어 제품에 주어진 작업과 사용자의 목표에 필요 적절 기능을 제공하는지

2) 정밀성 : 소프트웨어 제품이 요구되는 정확도로 올바른 결과를 산출할 수 있는 능력

 

==================

 

UML(Unified Modeling Language)이란?

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

 

UML 특징 : 가시화 언어, 구축 언어, 명세화 언어, 문서화 언어 -> (가구명문) 가구 명문점

 

UML 구성 요소 : 사물, 관계, 다이어그램 => (사관다) 사과한다

 

< UML 다이어그램 >                     + 컴포넌트, 배치 다이어그램은 구현 단계

 

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

클객 컴배 복패 => 구조해라 큰(클)고객 컴 배리 복패(빨리)

클래스 / 객체 / 컴포넌트 / 배치 / 복합체 구조 / 패키지

 

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

유시 커 상 활타 => 행유시 커(큰) 상 활활 타라

유스케이스 / 시퀸스 / 커뮤니케이션 / 상태 / 활동 / 타이밍

 

[ UML 스테레오 타입 유형 ]

<<include >> : 하나의 유스케이스가 어떤 시점에 반드시 다른 유스케이스를 실행하는 포함 관계

<<extend>> : 하나의 유스케이스가 어떤 시점에 다른 유스케이스를 실행할 수도 있고, 그렇지 않을 수도 있는 관계

<<interface>> : 모든 메세드가 추상 메세드이며 바로 인스턴스를 만들 수 없는 클래스로 추상 메서드와 상수만으로 구성된 클래스

<<entity>> : 일반적으로 정보 또는 오래 지속되는 연관된 행위를 형상화하는 클래스 -> 기억 장치에 저장될 정보 표현

<<boundary>> : 시스템과 외부 액터와의 상호 작용을 담당하는 클래스

<<control>> : 시스템이 제공하는 기능의 로직 및 제어를 담당하는 클래스