1. UI (User Interface) 
️️
사용자와 시스템 사이에서 의사소통을 할 수 있도록 고안된 물리적 가상의 매개체
•
CLI (Command Line Interface) - 텍스트
•
GUI (Graphical User Interface) - 그래픽
•
NUI (Natural User Interface) - 터치, 음성
•
OUI (Organic User Interface) - 현실에 존재하는 모든 사물
UI 설계 원칙
(직유학유)
•
직관성 : 누구나 쉽게 이해하고 사용할 수 있어야 한다.
•
유효성 : 정확하고 완벽하게 사용자의 목표에 달성할 수 있어야 한다.
•
학습성 : 초보자와 숙련자 모두가 쉽게 배우고 사용 가능해야 한다.
•
유연성 : 사용자의 인터렉션을 최대한 포용하고 실수를 방지할 수 있어야 한다.
UI 설계 지침
사용자 중심, 일관성, 단순성, 결과 예측 가능, 가시성, 표준화, 접근성, 명확성, 오류 발생 해결
2. UI 표준 ️
디자인 철학과 원칙에 기반하여 시스템에 공통적으로 적용되는 화면 간 이동, 화면 구성에 대한 규약
UI 구동 환경의 정의
•
OS 확인
•
웹 브라우저
•
모니터 해상도
•
프레임 시트
◦
프레임을 구분, 단일 프레임 웹 애플리케이션
•
리치 클라이언트 : 소프트웨어 실행을 클라이언트가 책임지는 기술
•
씬 클라이언트 : 소프트웨어 실행을 서버가 책임지는 기술
•
SSO(Single Sign On) : 한 번의 로그인을 통해 다른 사이트에 자동으로 접속하여 이용하는 방법
3. UI 지침 ️
UI 표준에 따라 UI 설계와 개발 시 따라야 하는 가이드라인
UI 개발 주요 기법
•
3C 분석 : 고객, 경쟁사, 자가 분석
•
SWOT : 강점, 약점, 기회, 위기 분석
•
시나리오 플래닝 : 불확실성이 높은 상황 변화를 예측하고 다양한 시나리오 설계
•
사용성 테스트 : 사용자가 직접 제품을 사용하면서 미리 작성된 시나리오에 맞춰 과제를 수행한 후 답하는 테스트
•
워크샵 : 소규모 과제, 회의(세미나)
사용자 요구사항 도출
•
페르소나 정의 : 잠재적 사용자의 다양한 목적과 관찰된 행동 패턴을 응집시켜놓은 가상의 사용자
•
콘셉트 모델 정의 : 브레인스토밍
•
요구사항 매트릭스 정의 : 페르소나 결과물을 토대로 요구사항을 도출하고 우선 순위를 정함. 정황 시나리오 제작
•
UI 컨셉션 : 정리된 요구사항을 구체화하는 단계
4. UI 설계 도구 ️️
스토리보드
UI 화면 설계를 위해 와이어 프레임과 데이터베이스 연동 등 구축하는 서비스의 정보가 수록된 문서
와이어 프레임
기획 초기에 화면 단위로 대략적인 레이아웃을 설계하는 단계
프로토타입
정적인 화면으로 설계된 와이어 프레임, 스토리보드에 동적인 요소(인터랙션)를 적용하여 실제 구현된 것처럼 시뮬레이션 가능한 모형
목업
실제 화면과 유사한 정적인 형태 모형
유스케이스
사용자 측면 요구사항 및 목표를 다이어그램으로 표현