UI (User Interface)
UI(사용자 인터페이스)는 사람들이 컴퓨터와 상호작용하는 시스템을 의미한다. 화면상의 그래픽요소는 물론 키보드, 마우스 등의 물리적 요소도 컴퓨터와 상호 작용하기 위한 시스템이기에 UI라고 볼 수 있다. 이 중 최근 스마트폰, 컴퓨터, 키오스크, 터치 스크린 안내판 등 현대 사회에서 화면과의 상호 작용을 통해 사용하는 기기들은 점차 늘어감에따라 그래픽 UI, 즉 GUI(Graphical User Interface)의 비중이 높아지며 특히 중요해졌다.
GUI (Graphical User Interface)
GUI(그래픽 사용자 인터페이스)는 사용자가 그래픽을 통해 컴퓨터와 정보를 교환하는 작업환경을 말한다. 우리가 보는 운영체제(Window, Mac OS)의 화면, 혹은 애플리케이션 화면 등이 이에 속한다. 프론트엔트 개발자로서의 UI는 대부분 GUI를 의미한다.
UX(User Experience)
UX(사용자 경험)의 사전적 의미는 사용자가 어떤 시스템, 제품, 서비스를 직-간접적으로 이용하며 느끼고 생각하는 총체적 경험이다. 제품, 서비스 그 자체에 대한 경험, 홍보, 접근성, 사후 처리등의 사용자의 총체적경험인 것이다.
UX에 영향을 주는 이 많은 요소 중에 프론트엔드 개발에게 가장 중요한 요소는 UI이다. 따라서 제품이나 서비스의 UI가 사용자로 하여금 가능하면 좋은 UX가질수 있도록, 최소한 나쁜 경험을 하지 않도록 해야한다.
UI와 UX의 관계
UX는 UI를 포함한다. 좋은 UX는 좋은 UI를 의미하나 좋은 UI가 좋은 UX를 보장하지는 않는다. 이처럼 UX와 UI는 다르지만 서로를 보완하는 역할을 한다. UX가 좋지 않은 곳을 찾아냄을 UI 개선점을 찾아내거나 UI를 개선함으로 UX가 좋아지는 등의 보완이 되는 것이다.
UI 디자인
UI 디자인 패턴은 프로그래밍 시 자주 반복되어 나타나는 문제점을 해결하고자 과거의 다른 사람이 해결한 결과물을 재사용하기 좋은 형태로 만든 패턴을 말한다. 쉽게 말하면 자주 사용되는 UI 컴포넌트라고 할 수 있다.
자주 쓰이는 UI 디자인 패턴을 익혀두면 UI 디자인이 보다 쉬워지고 프론트엔드 개발자, 디자이너, PM 과의 의사소통도 원활해져 협업 효율도 높아진다.
