소프트웨어 설계 - UI 요구사항 확인

#UI 요구사항 확인

■ UI (사용자 인터페이스; User Interface)

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

UX (사용자 경험; User eXperience)

사용자가 직·간접적으로 경험하면서 느끼고 생각하는 총체적 경험
UI는 UX안에 포함됨

■ UI 유형

● CLI (Command Line Interface)

• 텍스트 기반
• 명령어를 텍스트로 입력하여 조작

● GUI (Graphical User Interface)

• 그래픽 반응 기반
• 마우스나 전자펜을 이용하여 조작

● NUI (Natural User Interface)

• 직관적 사용자 반응 기반
• 신체 부위를 이용하여 조작(터치, 음성 등)

● OUI (Organic User Interface)

• 유기적 상호 작용 기반
• 현실에 존재하는 모든 사물을 입출력장치로 변화하여 조작

■ UI 특징

• 오류 최소화
• 작업기능 구체화
• 상호 작용
• 작업시간 감소
• 피드백 제공 (명령에 대한 진행상황과 표시된 내용을 해석할 수 있도록 도와줌)

■ UI 설계원칙

@직유 학유

● 직관성

누구나 쉽게 이해하고 쉽게 검색할 수 있어야함

● 유효성

정확하고 완벽하게 사용자의 목표가 달성될 수 있도록 제작

● 학습성

초보와 숙련자 모두가 쉽게 배우고 사용할 수 있게 제작

● 유연성

사용자의 인터랙션을 최대한 포용하고, 실수를 방지할 수 있도록 제작

UI 표준

• 전체 시스템에 공통으로 적용되는 화면 간 이동, 화면 구성 등에 관한 규약

■ UI 표준 구성

@액정 스패조

• 전체적인 UX 원칙
• 정책 및 철학
• UI 스타일 가이드
• UI 패턴 모델 정의
• UI 표준 수립을 위한 조직 구성

■ UI 표준 수립 시 고려사항

• 사용자가 불편하지 않아야 함
• 많은 업무 케이스를 포함해야 함
• 다양한 사용상황에 대처할 수 있어야 함
• 표준 적용이 쉽도록 충분한 가이드와 활용 수단 제공이 필요
• 변화하는 상황에 맞게 빠르게 변경할 수 있는 관리조직 수반이 필요

■ UI 제스처

구분	설명
탭 (Tap)	화면을 짧고 가볍게 터치
더블 탭(Double Tab)	화면을 빠르게 두번 터치
프레스(Press)	화면을 길게 꾹 누르기
플릭(Flick)	수평 또는 수직방향으로 빠르게 밀기
스와이프(Swipe)	화면을 터치한 상태로 드래그
팬(Pan)	손을 떼지 않고 드래그
드래그(Drag)	이미 등을 끌다가 손을 떼는 제스처
핀치(Pinch)	두 손가락을 터치한 상태에서 손가락 사이를 벌리거나 좁히는 제스처
로테이트(Rotate)	두 손가락을 터치한 상태에서 화면을 회전하는 제스처

UI 지침

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

1. 목표 정의
2. 프로젝트 계획
3. 요구사항 정의
4. 설계 및 구현
5. 테스트
6. 배포 및 관리

스토리보드

스토리보드(Storyboard)

• UI화면 설계를 위해서 정책이나 프로세스 및 콘텐츠의 구성, 와이어 프레임, 기능에 대한 정의, 데이터베이스의 연동 등 구축하는 서비스를 위한 대부분 정보가 수록된 문서
• 디자이너와 개발자가 최종적으로 참고하는 산출 문서
• 스토리모드, 와이어 프레임, 프로토타입이 활용

UI 화면 설계 구분

구분	설명
와이어 프레임	화면 구성을 협의하거나 화면 단위의 레이아웃을 설계하는 단계
스토리보드	서비스 구축을 위한 모든 정보가 담겨있는 산출물
프로토타입	실제 구현된 것 처럼 시뮬레이션할 수 있는 모형 HTML/CSS