필기 - 1. 소프트웨어 설계_ch2. 화면설계

1. UI 요구사항 확인

(1) UI 개요

1️⃣ UI(User Interface) 개념

• 넓은 의미 : 사용자와 시스템 사이에서 의사소통할 수 있도록 고안된 물리적, 가사의 매개체
• 좁은 의미 : 정보 기기나 소프트웨어의 화면 등에서 사람이 접하게 되는 화면

2️⃣ UI 유형

CG NO

유형	특징	설명
CLI (Command Line Interface)	정적인 텍스트 기반 인터페이스	명령어를 텍스트로 입력하여 조작하는 사용자 인터페이스
GUI (graphical User Interface)	그래픽 반응 기반 인터페이스	그래픽 환경을 기반으로 한 마우스나 전자펜을 이용하는 사용자 인터페이스
NUI (Natural User Interface)	직관적 사용자 반응 기반 인터페이스	신체 부위를 이용하는 사용자 인터페이스( 터치, 음성 등)
OUI (Organic User Interface)	유기적 상호 작용 기반 인터페이스	입력장치 = 출력장치, 현실에 존재하는 모든 사무이 입출력 장치로 변화 할 수 있는 사용자 인터페이스

 

3️⃣ UI 특징

특징	설명
오류 최소화	구현하고자 하는 결과의 오류를 최소화
작업기능 구체화	막연한 작업 기능에 대해 구체적인 방법을 제시
상호 작용	사용자 중심의 상호 작용이 되도록 함
작업시간 감소	사용자의 편의성을 높여 작업시간을 감소시킴
피드백 제공	시스템의 상태와 사용자의 지시에 대한 효과를 보여주어 사용자가 명령에 대한 진행 상황과 표시된 내용을 해석할 수 있도록 도와줌

 

4️⃣ UI 설계 원칙

직유 학유 - 정답으로 직접 유도하거나 학습 유도

설계 원칙	설명
직관성	누구나 쉽게 이해, 쉽게 사용
유효성	정확하고 완벽하게 사용자의 목표가 달성될 수 있도록 제작
학습성	모두가 쉽게 배우고 사용할 수 있게 제작
유연성	사용자의 인터랙션을 최대한 포용하고, 실수를 방지할 수 있도록 제작

 

5️⃣ UI 설계 지침

UI 설계 지침 - 사용자 중심, 효율성, 일관성, 단순성, 결과 에측 가능, 가시성, 표준화, 접근성, 명확성, 오류 발생 해결

 

6️⃣ UI 시스템의 필요 기능

• 사용자의 입력을 검증
• 에러 처리와 에러 메시지 처리
• 도움과 프롬프트를 제공

 

(2) UI 표준

1️⃣ UI 표준 개념

UI 표준은 디자인 철학과 원칙 기반하에 전체 시스템에 공통으로 적용되는 화면 간 이동, 화면구성 등에 관한 규약

 

2️⃣ UI 표준 구성

액(X)정스페조 - 액정에 스페이스가 조금 보이네

UI 표준 구성	설명
전체적인 UX원칙	사용자의 관점에서 사용자 업무를 효율적으로 수행할 수 있는 UX원칙
정책 및 철학	조직의 목표나 정체성을 포함하는 정책 및 철학 설정
UI 스타일 가이드	UI에 대한 구동 환경 및 레이아웃 등을 정의
UI 패턴 모델 정의	CRUD 방식을 기반으로 데이터 입력, 출력 패턴 모델 정의
UI 표준 수립을 위한 조직 구성	UI 팀 및 표준 개발 팀을 주축으로 추진 조직 구성

 

3️⃣ UI 화면 구성요소

시스템 요구사항에 대한 개념 모델을 논리적 모델(프로세스 모델, UI 설계, 논리 데이터 모델, 아키텍처 정의. 인터페이스 설계)로 상세화 한다.

 

(3) UI 지침

1️⃣ UI 지침 개념

UI 표준에 따라 사용자 인터페이스 설계, 개발 시 지켜야할 세부사항

 

2️⃣ UI 표준 적용을 위한 환경 분석

UI표준 적용을 위한 환경 분석을 위해 사용자 트렌드 분석, 기능 및 설계 분석을 한다

 

(4) 스토리보드

1️⃣ 스토리보드 개념

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

• 와이어프레임
• 스토리보드
• 프로토타입

 

2. UI 설계

(1) UI 설계 프로세스 및 UI 흐름 설계

1️⃣ UI 설계 프로세스

문사 작컴 인디 - 문서 작업용 컴퓨터 인디?

순서	프로세스	설명
1	문제 정의	시스템의 목적을 수립하고, 최적화하기 위하여 해결해야 할 문제를 정의
2	사용자 모델 정의	시스템을 사용할 사용자의 특성을 파악하여 사용자 모델을 정의
3	작업 분석	해결해야 할 문제를 정의하고 사용자 특직을 세분화하는 작업 분석 수행
4	컴퓨터 오브젝트 및 기능 정의	분석한 작업을 컴퓨터의 어떤 사용자 인터페이스를 통해 표현할 것인지 정의
5	사용자 인터페이스 정의	작업 모델을 기반으로 작업자가 예측한 대로 동작하도록 사용자 인터페이스를 정의
6	디자인 평가	설계한 인터페이스가 분석한 작업에 맞게 설계 되었는지 등을 평가

 

2️⃣ UI 흐름 설계

기업유양 - 기입 시 유럽양이라 쓰세요

순서	프로세스	설명
1	기능 작성	기능적 요구사항 검토
2	입력 요소 확인	화면에 표현되어야 할 기능 확인
3	유스케이스 설계	액터별 시나리오 작성
4	기능 및 양식 확인	규칙 정의

 

(2) 감성공학

1️⃣ 감성공학 개념

• 인간의 감성을 정성적, 정량적으로 측정 및 평가하고, 과학적으로 분석하여 이를 구체적인 제품 설계로  실현해 내는 공학
• 인간과 기계 또는 인간과 환경 사이를 연계시키는 인터페이스 설계 분야

(3) UI 설계 도구

1️⃣ UI 설계 도구의 개념

• UI 설계 도구는 UI의 설계를 지원하는 도구
• UI 설계에서 비용 절감 목적으로 실제 제품이 나오기 전에 만드는 모형인 목업을 활용