UI/UX

User Interface, User Experience

UI와 UX 묶어 사용자의 인터페이스 이용 편의성, 만족도를 이르는 개념

UI 는 사용자가 시스템과 만나는 화면·버튼·메뉴 같은 접점이고, UX 는 그 접점을 포함해 서비스를 쓰는 동안 사용자가 느끼는 경험 전체이다. 좋은 UI 는 좋은 UX 의 필요조건이지만 충분조건은 아니어서, 실무에서는 둘을 함께 설계·평가한다.

UI 와 UX 의 비교

구분	UI	UX
대상	화면 배치, 버튼, 아이콘, 색, 글꼴, 입력 방식	이용 전·중·후의 인식, 감정, 만족, 재방문
질문	어떻게 보이고 어떻게 조작하는가	쓰고 나서 어떻게 느끼는가, 목적을 이뤘는가
성격	시각·조작 설계(결과물)	사용자 조사부터 평가까지의 과정
평가	일관성, 가독성, 조작 오류율	과업 성공률, 만족도, 이탈률, 재접근률

UX 의 구성 요소

피터 모빌(Peter Morville)의 UX 벌집 모형은 좋은 경험의 조건을 일곱 가지로 든다.

• 유용성(Useful): 사용자에게 필요한 기능을 준다
• 사용성(Usable): 쉽고 효율적으로 쓸 수 있다 → 사용성
• 매력성(Desirable): 디자인과 브랜드가 호감을 준다
• 검색성(Findable): 원하는 정보와 기능을 쉽게 찾는다
• 접근성(Accessible): 장애인·고령자도 쓸 수 있다 → 웹 접근성
• 신뢰성(Credible): 내용과 서비스를 믿을 수 있다
• 가치성(Valuable): 사용자와 조직 모두에게 가치를 만든다

설계 원칙

• 일관성: 같은 기능은 같은 위치·모양·용어로 둔다
• 직관성: 설명 없이도 다음 행동을 알 수 있게 한다
• 피드백: 조작의 결과와 시스템 상태를 바로 보여 준다
• 오류 예방과 복구: 실수하기 어렵게 만들고, 실수해도 되돌릴 수 있게 한다
• 효율성: 작업 단계와 시간을 줄인다
• 포용성: 다양한 기기·브라우저·사용자 특성에서 동등하게 쓸 수 있게 한다

공공 웹사이트에는 행정안전부의 전자정부 웹사이트 UI·UX 가이드라인이 이 원칙을 설계 기준으로 구체화해 적용된다.

설계 절차

1. 사용자 조사: 인터뷰·관찰·로그 분석으로 사용자와 맥락을 이해한다
2. 모델링: 페르소나와 고객 여정 지도로 대표 사용자와 경험 흐름을 정리한다
3. 설계: 정보 구조, 와이어프레임, 화면 설계
4. 프로토타입: 클릭 가능한 시안을 만든다
5. 평가: 사용성 평가로 문제를 찾아 반복 개선한다

같이 보기

• 사용자 인터페이스
• UX
• 사용성
• 웹 접근성
• 웹 호환성
• 디자인 싱킹
• 페르소나
• 전자정부 웹사이트 UI·UX 가이드라인