1. 사용자 인터페이스(UI;User Interface)란?
: 사용자와 시스템 간 상호작용을 도와주는 소프트웨어.
2. UI의 특징
– 사용자의 만족도에 가장 큰 영향을 미침.
– 수행 결과의 오류를 줄이고, 작업 시간 단축.
– 업무에 대한 이해도 증가, 편리성과 가독성 증가.
3. UI의 구분 ★★
- CLI(Command Line Interface): 명령과 출력이 텍스트 형태로 이루어진 인터페이스.
- GUI(Graphical User Interface): 마우스로 아이콘이나 메뉴를 선택하여 작업을 수행하는 그래픽 환경의 인터페이스.
- NUL(Natural User Interface): 사용자의 말이나 행동으로 기기를 조작하는 인터페이스.
- VUI(Voice User Interface): 사람의 음성으로 기기를 조작하는 인터페이스.
- OUI(Organic User Interface): 모든 사물과 사용자 간의 상호작용을 위한 인터페이스.
4. UI의 기본 원칙 ★★
- 직관성: 누구나 쉽게 이해하고, 사용할 수 있어야 함.
- 유효성: 사용자의 목적을 정확하고 완벽하게 달성해야 함.
- 학습성: 누구나 쉽게 배우고, 익힐 수 있어야 함.
- 유연성: 사용자의 요구 사항을 최대한 수용하고 실수를 최소화해야 함.
5. UI의 표준 및 설계지침
– UI 표준 및 지침을 토대로 웹 표준, 웹 접근성, 웹 호환성이 고려되었는지 확인.
– UI 설계 시 고려사항: 사용자 중심, 일관성, 단순성, 결과 예측 가능성, 가시성, 표준화, 접근성, 명확성, 오류 발생 해결 등.
– 웹의 3요소: 웹 표준, 웹 접근성, 웹 호환성
– 전자정부 웹 표준 준수 지침: 정부기관의 홈페이지 구축 시 반여해야 할 최소한의 규약을 정의.
6. UI의 설계 도구 ★
: 사용자의 요구사항에 맞게 UI의 화면 구조나 화면 배치 등을 설계할 때 사용.
- 와이어프레임(Wireframe): 개략적인 Layout이나 UI요소 등 뼈대를 설계. 계획 초기에 제작.
* Tool: 손그림, PPT, 스케치, 일러스트, 포토샵 등
- 목업(Mockup): 와이어프레임보다 좀 더 실제 화면과 유사하게 만든 정적인 형태의 모형.
* Tool: 파워 목업, 발사믹 목업 등
- 스토리보드(Story Moard): 와이어프레임의 콘텐츠에 대한 설명, 페이지 간 이동 흐름 등을 추가한 문서.
* Tool: PPT, 키노트, 스케치,Axure 등
- 프로토타입(Prototype): 인터랙션을 적용함으로써 실제 구현된 것처럼 테스트 가능한 동적모형.
* Tool: HTML/CSS, Axure, 카카오 오븐 등
- 유스케이스(Use Case): 사용자 측면에서의 요구사항, 사용자가 원하는 목표를 달성하기 위해 수행할 내용을 기술.
* Tool: Diagram형식
7. HCI / UX / 감성공학
7. 1. HCI(Human Computer Interaction or Interface)
: 사람이 시스템을 보다 편리하고 안전하게 사용할 수 있도록 연구하고 개발하는 학문. 최적의 사용자 경험(UX)을 만드는 것을 최종목표로 함.
7. 2. UX(User Experience)
: 사용자가 시스템이나 서비스를 이용하면서 느끼고 생각하는 총체적인 경험.
- UX의 특징
-
- 주관성(Subjectivity): 개인적, 신체적, 인지적 특성에 따라 다름.
- 정황성(Contextuality): 경험이 일어나는 상황 또는 주변 환경에 영향을 받음.
- 총체성(Holistic): 개인이 느끼는 총체적인 심리적, 감성적 결과.
7. 3. 감성공학
: 제품이나 작업환경을 사용자의 감성에 알맞도록 설계 및 제작하는 기술.
- 1류: 인간의 감성
- 2류: 심리적 기능
- 3류: 공학적 및 수학적 모델. 객관적.