UI/UX란? 의미와 차이, 디자인 설계의 요령

“이 앱은 사용하기 쉽다”, “이 웹 사이트는 사용하기 어렵고, 원하는 정보에 찾기가 쉽지 않다” 등 일상적으로 인터넷을 이용하는 사람이라면, 이렇게 생각하고 느낀적이 있지 않은가? 이런 사용자에게 “좋은 앱”, “좋은 사이트"라고 느끼게 하려면 어떻게 하면 좋을까라고 하는 고민하고 실현하려는 것이 “UI와 UX"이다. Web 업계의 종사자나 디자인에 관련하는 업무를 하는 사람들이 주로 많이 고민하는 것이 이 주제일 것이다.

여기에서는 이러한 UI와 UX에 대한 기초부터 설명한다.

UI/UX란?

웹사이트나 웹 앱뿐만 아니라 제품이나 서비스를 만드는데 있어서도 빼놓을 수 없는 것이 UI/UX 디자인이다.
UI와 UX는 하나의 단어처럼 말하는 경우가 많은데, 실은 두개는 의미는 다르다. 각각에 대해 아래에서 설명한다.

우선 결론부터 말하면, 모두 제품이나 서비스에 관련하는 단어이다. UI(사용자 인터페이스, user interface)는 “사용자와의 접점"인데 반해, UX(사용자 경험,user experience)는 “사용자가 제품이나 서비스를 통해 얻은 경험” 전부를 가리킨다.
그리고, 사용자와의 접점도 사용자가 경험하는 일부이기 때문에, UI는 UX에 내포되는 개념이다.

UI란?

UI란, 제품이나 서비스와 사용자의 접점을 나타내는 용어로, 사용자가 보고 만지는 부분을 가리킨다. UI 라고 하ㄴ 디자인 뿐이라고 생각해 버리는 경향이 있지만, 사용자가 보는 거나 조작하는 모든 것이 UI에 포함된다.

UX란?

UX는 웹사이트, 앱, 제품, 서비스 등을 통해 사용자가 얻는 모든 경험을 나타내는 용어이다. 예를 들어, 사용자가 EC 사이트(Electronic Commerce Site)를 방문하여 제품을 선택하고 구매한 후 제품을 사용한 후 다시 구매하고 싶을 때까지 모든 것이 “사용자 경험”, 즉 UX이다.

UI와 UX의 차이점

여기서는 UI와 UX의 관계에 대해 설명한다. 앞서 언급했지만 UI는 UX를 실현하는 한 가지 방법으로 생각할 수 있다. 두의 구체적인 예를 보면서 설명하겠다.

구체적인 예제 1)
UX : 페이지의 이동이 알기 쉽고, 사용자가 원하는 정보에 바로 찾을 수 있다.
↓ 실현하기 위한 수단
UI : 메뉴와 버튼을 쉽게 찾을 수 있으며, 모든 페이지에서 쉽게 톱 페이지로 돌아갈 수 있다.

구체적인 예제 2)
UX: 신청이나 회원 등록을 간단하게 할 수 있다.
↓ 실현하기 위한 수단
UI: 링크나 버튼의 위치나 색이 알기 쉬운, 입력 폼의 항목 수가 필요 최저한, 입력 폼에 입력 보조 기능이 있다.

구체적인 예제 3)
UX : 사용자의 흥미를 유발하는 그래픽
↓ 실현하기 위한 수단
UI : 텍스트 폰트나 색에 위화감이 없다.

이렇게 UI는 UX를 실현하기 위한 요소 중 하나일 뿐이다. 그래서 아무리 UI가 뛰어났다고 해도 제품이나 서비스 전체의 사용자 경험이 고려되어 있지 않으면 낭비가 되어 버린다.
UX 디자인은 사용자 만족도를 높이기 위해 UI 영역 이외의 것보다 큰 관점에서 전체 사용자 경험을 종합적으로 설계해야 한다.

즉, 좋은 제품이나 서비스를 만들려면 먼저 사용자의 요구를 이해한 UX 디자인을 실시하고 그것을 바탕으로 UX를 향상시키는 UI 디자인을 설계해야 한다.

UI/UX의 구체적인 예

EC 사이트(쇼핑 사이트)에서는 UI 및 UX 디자인의 품질이 직접 판매에 관여한다. 그러기 때문에 운영 담당자는 항상 사용자의 유동이나 동향을 계측해 분석을 하여, 얻어진 데이터를 기초로 가설을 세우고 Web 페이지 이동의 최적화나 사용자 경험의 향상을 목표로, UI의 업데이트 및 UX 개선을 위해 노력하고 있다. 이때 UI/UX 디자이너가 중요한 역할을 담당한다.
EC 사이트에서는 모든 사람에게 알기 쉽고 안심하고 쇼핑할 수 있는 웹페이지를 설계해야 한다. 이를 위해서는 제품의 사진을 쉽게 볼 수 있는지, 사용자가 필요로 하는 정보를 쉽게 찾을 수 있는지, 문자의 색상과 크기를 쉽게 알 수 있는지, 버튼이나 링크를 누르기 쉬운지 등을 고려해야 한다. 그 밖에도 음성 기능을 추가하거나 다양한 디바이스에의 대응 등도 UI 디자인의 영역이다. UX 디자인은 단순히 사용의 용이성뿐만 아니라, 상품 선택이나 구입시의 경험이 쾌적하고 안심하고, 더욱 흥미롭게 할 수 있는지 등의 시점에서 사용자의 경험을 생각한다.
예를 들어, 페이지 로딩 속도, 상품 주문부터 도착까지의 속도 등 제품 및 서비스의 품질을 고려해야 한다. 그 밖에도 사용자의 구입 도중에서의 이탈율이 높은 경우는 UI의 개선 뿐만이 아니라, 고객 지원의 충실이나 알림 기능의 추가 등 다양한 방법을 이용해 정책을 시행한다.

UI/UX 디자인 설계의 목적

사용자가 생각하게 않게 한다.

사용자의 요구나 동향을 예측하여 사용자가 많이 생각하지 않고도 목적을 달성할 수 있도록 설계를 하는 것이다. 그렇게 되면, 사용자는 어렵지 않게 생각하지 않고 직관적이며, 부드럽고 편안하게 제품과 서비스를 이용할 수 있게 된다.

사용자의 장애가 되는 것은 제거한다.

비록 작은 것에서도 사용자가 그 제품이나 서비스를 여러번 사용하는데 있어서 매우 큰 장애가 될 수 있다.

UI/UX 디자인 설계 요령

여기에서 실제로 “좋은 UI”, “좋은 UX"를 설계하려면 어떻게 해야 하는지 UI/UX 디자인의 목적을 근거로 설명한다.

사용자의 관점에서 생각하기

UI/UX 디자인을 설계하는데 있어서 가장 중요한 것은 사용자의 관점에서 생각하는 것이다. 자주 있는 케이스로서는 개발자가 개발을 진행해 가면서 시야가 좁아져, 자기 표현을 추구하게 되면, 개발자측에 있어서 편리한 디자인이 되어 버리는 경우가 있다. 참신한 디자인이나 다기능성도 사용자의 요구에 맞지 않으면 반대로 스트레스를 느끼게 되어 버리므로 조심해야 한다.
사용자 관점에서 생각하기 위해서는, 우선, 대상의 제품이나 서비스에 대해 숙지하는 것이다. 가능한 한 대상의 제품이나 서비스에 관한 모든 데이터를 모아 거기에서 어떻게 하면 사용하기 쉬워지는지, 기분 좋게 경험해 주실 수 있을까 등의 개선책을 도출해 나갈 것이다.

목표를 설정하기

자사의 제품과 서비스는 누구를 위해 무엇을 위한 것인지를 생각하고, 최종적으로 어느 정도 인지되고 싶은지, 어떤 유저층에 이용되고 싶은지, 얼마나 매출이나 유저수를 늘리고 싶다 또는 목표를 설정하는 것도 효과적이다. 그것이 정해지면 UI/UX 디자인의 방향성도 끊임없이 정해진다. 반대로 목표가 불명확하다면 실제로 완성되어도 모호한 것이 될 수 있다.

페르소나의 설정을 명확하게 하기

앞에서 “어떤 사용자 층에 이용되고 싶은가"라고 했는데, 이 페르소나(Persona)란 제품이나 서비스를 이용하는 전형적인 사용자 대상이다. 뛰어난 UI/UX 디자인을 설계하기 위해서는 어떤 사람이 어떤 목적으로 대상 제품이나 서비스를 사용하는지를 생각하고 명확하게 하는 것이 중요하다.
예를 들어, 청소년과 중년은 선호하는 디자인과 기능이 다르다. 또한 같은 장르라고 해도 초보자와 중급, 상급자는 요구하는 정보의 질과 양이 달라진다.
연령, 성별, 속성 등을 상세하게 상정하고, 그 사용자가 요구하는 내용과 어긋남이 없도록 UI/UX 를 디자인할 필요가 있다.
페르소나는 실제 데이터를 바탕으로 설정하는 경우도 있고, “이런 사용자 층에 이용되고 싶다"라고 하는 가상의 인물상을 만들 수도 있다. 보다 구체적으로 사용자 대상을 설정하면 UX도 쉽게 설계할 수 있다.

페르소나의 목적을 편안하게 달성하는 구조를 생각한다.

예를 들어, 사용자가 상품을 구매하고 싶다면 구매 목적을 달성하기 전에 어떤 프로세스를 밟아야 하는지 생각해 보자. 상품 선택의 단계에서는, 사용자가 보다 좋은 상품을 만날 수 있도록, 상품을 가격순, 평가가 높은 순서로 표시하는 기능을 추가하거나, 상품에 리뷰 기능을 붙일 수 있다고 할 수 있다. 이렇게 하면 사용자가 제품을 음미 할 수 있으며 UX도 향상된다.

검증을 반복한다.

UI/UX의 개선에 명확한 정답이나 목표는 없다. 예를 들어, 사용자의 요구를 이해하는 수단으로 “사용자 테스트"가 있다. 자사의 제품이나 서비스 등을 실제로 사용하는 모습을 관찰하거나, 리뷰을 받는 것으로 개선점을 찾아내기 쉬워진다. 다른 웹 서비스라면 Google Analytics와 같은 분석 도구를 사용하여 효과를 측정 할 수 있다. 이것으로부터 얻은 데이터를 향후의 개량에 반영시키는 등 자세하게 PDCA를 돌려 가는 것이 유저의 요구에 부응하는 UI/UX에의 지름길이다.

UI/UX 디자인을 다루는 직종

Web 디자이너

말할 필요도 없지만, UI/UX디자인을 취급하는 직종의 대표격으로서 Web디자이너를 들 수 있다. 덧붙여서 Web 디자이너와는 별도로 UI를 전문으로 취급하는 UI 디자이너라는 직종도 있다. 두 직종의 차이는 Web 디자이너의 역할은 외형 그 자체를 좋게 하는 것이지만, UI 디자이너는 사용자의 사용의 용이성이나 조작성이라고 하는 기능면을 추구했다는 차이가 있다.

엔지니어

회사에 따라 엔지니어도 UI/UX 디자인을 다룰 수 있다. 소규모 회사라면 엔지니어가 UI/UX 디자인을 생각하면서 앱이나 웹사이트를 설계하는 경우도 많다. 또한 대규모 회사에서도 개발의 상류 공정을 맡은 경우에는 UI/UX를 고려한 설계가 요구된다.

요약

UI는 사용자와의 접점이 되는 외관이나 조작성에 관련되는 부분이며, UX는 UI를 포함한 사용자의 경험의 전체이다. 좋은 제품과 서비스를 만들려면 먼저 사용자의 요구를 이해한 UX 디자인을 해야 하고, 그것을 바탕으로 사용자가 망설이지 않고 직관적으로 이해할 수 있고 원활하게 사용할 수 있는 UI 디자인을 설계할 필요가 있다.
이를 위해서는 사용자의 관점에서 생각하고 데이터를 분석하고 목표를 세우고 이에 대한 최적의 접근법을 도출하는 것이 중요히다.




최종 수정 : 2022-12-31