Unit 2] [사용자 친화 웹] UI/UX part.1

SEB _ FE _ 45

Section 3. Unit 2. [사용자 친화 웹] UI/UX part.1

---

UI / UX 많이 들어봤는데...?

UI(User Interface) 는 사람들이 컴퓨터와 상호작용하는 시스템을 말한다.

UI는 그래픽 요소뿐만 아니라 물리적 요소(키보드와 마우스, 버튼 등)도 포함된다.

물리적 요소에 대한 예를 들어보면, 우리가 컴퓨터를 켜면 가장 먼저 윈도우를 만나게 된다.
이때, 물리적 요소인 키보느나, 마우스 같은 입력 장치가 없다면????
아무리 좋은 그래픽 요소를 가진 프로그램도 물리적 요소가 없으면 사용할 수 없는 UI가 되는 것이다.

컴퓨터의 UI를 보면, 그래픽 기반의 UI가 많다. 이를 GUI(Graphical User Interface)라고 하며, 마우스를 이용해 직관적으로 컴퓨터와 상호작용이 가능하다.

윈도우는 그래픽 기반 UI(GUI)

과거의 컴퓨터나, 컴퓨터 프로그램 개발자 등 특정 명령을 위해 사용하는 터미널은 CLI(Command Line Interface) 명령 줄 인터페이스로 키보드를 주 입력 장치로 컴퓨터와 상호작용이 가능하다.

터미널은 명령 줄 인터페이스(CLI)

---

UX(User Experience)는 사용자 경험이라고 하며, 사용자가 어떤 시스템, 제품, 서비스를 직/간접적으로 이용하면서 느끼고 생각하는 총체적 경험이다.

휴대폰을 예로 들어 직접적인 경험과 간접적인 경험을 구분해보면, 아래와 같다.

직접적인 경험이란, 휴대폰을 예로 들면 앱 작동이 끊기지 않고 잘 되는지와 같이 제품의 실질적 작동과 관련한 부분이다.

간접적인 경험은 휴대폰이 고장났을 때 경험하게 되는 A/S, 제품의 홍보, 구매하기까지의 접근성(A라는 제품의 광고를 너무 관심있게 봐서 직접 보고 구매하고 싶은데, 판매 매장이 안보이는 것) 등이 이에 해당하겠다.

나쁜 UX의 가장 좋은 예는 간혹 혹하는 뉴스 기사가 있어 눌렀다가 광고지옥에 빠지는 것이다....

출처 :  http://www.the-pr.co.kr/news/articleView.html?idxno=22319

(종종 위 사진보다 더한 뉴스사이트도 많다...)

---

UI 와 UX의 관계

출처 : 코드스테이츠 URCLASS

UI는 디자인적 요소 및 사용자가 작동하는 환경의 차원이라면,

UX는 제품이나 서비스 등의 사용 외적인 부분의 경험도 해당된다.

좋은 UX가 반드시 좋은 UI를 의미하지 않고, 좋은 UI가 항상 좋은 UX를 보장하지 않는다.

계산기를 예를 들면, 디자인이 좋은(UI 가 좋은) 계산기가 제대로된 결과값을 안준다면?

좋은 UX을 보장하기는 어렵다.

즉, 제품이나 서비스가 본연의 기능에 충실해야 UI / UX가 의미가 있다.

단!!! 나쁜 UI는 보통 나쁜 UX를 제공한다. 

아래는 나쁜 UX의 예시와 21가지 나쁜 UX를 소개해놓은 글이 있어 공유해본다.

출처 : 코드스테이츠 URCLASS

https://ciaracarroll.medium.com/bad-bad-bad-ux-20-common-mistakes-in-user-experience-1394c5bb8d69

Bad Bad Bad UX: 20 Common Mistakes in User Experience

많이 실수하는 UX에 대해서는 다양한 자료를 이용하여, 실수 하지 않도록 해야겠다.

---

정리 및 회고

한번에 여러 내용을 정리하려고 보니, 글이 정리가 되지 않는다.

차라리 CS50강의처럼 part를 나누어 정리해서 올리는 것이 효율적일것 같다.

이번 포스팅에서는 UI와 UX에 대해 공부한 것을 블로깅을 통해 정리해보았다.

UI 와 UX는 평소에도 많이 눈에 띄는 내용인데, 크게 신경을 쓰지는 않았던 것 같다. 

프론트엔드 개발자가 되기 위해 공부하고, 준비하는 사람으로써

여러 웹사이트나 애플리케이션의 UI와 UX에 대해 조금 더 관심을 갖고,

개선될 사항은 없는지 고민해봐야 하겠다.