1. UX를 공부할 때 가장 먼저 어려운 것
처음 UX/UI를 공부하면 많은 사람들이 디자인 툴부터 떠올린다. 하지만 실제 실무에서 가장 먼저 어렵게 느껴지는 것은 디자인 자체보다 ‘실무 용어’인 경우가 많다. 회의에서는 와이어프레임, 프로토타입, QA, 반응형 같은 단어들이 자연스럽게 오가는데, 처음에는 무슨 의미인지 이해하기 어렵다. 그리고 이런 용어들을 이해하지 못하면 프로젝트 흐름 자체를 따라가기 힘들어진다.
UX는 혼자 만드는 작업이 아니다. 기획자, 디자이너, 개발자 등 여러 사람이 함께 서비스를 만들기 때문에 같은 언어를 사용하는 것이 중요하다. 예를 들어 디자이너가 “프로토타입을 만들었다”고 하면, 개발자는 단순한 시안 이미지가 아니라 실제 클릭이 가능한 테스트 화면으로 이해해야 한다. 반대로 기획자가 “스토리보드를 수정한다”고 하면 화면 구조나 기능 흐름이 바뀔 수 있다는 의미로 받아들여야 한다. 즉, UX 용어는 단순한 단어가 아니라 협업을 위한 공통 언어에 가깝다.
많은 사람들이 UX를 단순히 화면 디자인이라고 생각하지만 실제 UX는 사용자의 경험 전체를 설계하는 과정에 가깝다. 사용자가 어디서 버튼을 발견하는지, 어떤 흐름으로 이동하는지, 어디서 불편함을 느끼는지까지 모두 UX의 영역 안에 포함된다. 결국 UX는 ‘예쁜 화면’을 만드는 것이 아니라 사용자가 자연스럽게 행동할 수 있도록 구조를 설계하는 일이다.
그래서 UX를 공부할수록 중요한 것은 단순한 디자인 감각보다 “왜 이렇게 설계했는가”에 대한 이유를 이해하는 것이다. 좋은 UX는 사용자가 고민하지 않아도 자연스럽게 사용할 수 있는 흐름을 만든다. 그리고 그런 경험은 단순히 감각이 아니라 사용자 행동에 대한 이해와 반복적인 수정 과정을 통해 만들어진다.
2. 화면을 설계할 때 사용하는 용어
UX/UI 실무에서는 디자인을 바로 시작하지 않는다. 대부분의 프로젝트는 화면 구조를 먼저 설계하고, 사용자 흐름을 정리한 뒤 실제 디자인 작업으로 넘어간다. 그 과정에서 가장 자주 등장하는 용어들이 바로 와이어프레임, 스토리보드, 플로우 차트, 목업, 프로토타입이다. 이 용어들은 모두 비슷해 보이지만 역할이 서로 다르며, 프로젝트 단계마다 사용하는 목적도 다르다.
2.1 와이어프레임(Wireframe)
와이어프레임은 화면 설계의 가장 초기 단계다. 쉽게 말하면 디자인 전에 만드는 ‘화면 뼈대’라고 볼 수 있다. 컬러나 이미지보다 중요한 것은 정보 구조와 배치다. 화면 안에 로고, 메뉴, 버튼, 배너, 텍스트 영역 등을 단순한 선과 도형으로 배치하며 전체 구조를 정리한다.
실무에서 와이어프레임을 가장 먼저 만드는 이유는 수정 비용 때문이다. 처음 구조를 잘못 잡으면 이후 디자인과 개발 단계에서 수정 범위가 매우 커진다. 반대로 와이어프레임 단계에서 사용자 흐름과 구조를 잘 정리해두면 이후 작업 속도도 훨씬 빨라진다. 그래서 UX에서는 디자인보다 먼저 ‘구조’를 설계하는 과정이 중요하게 여겨진다.
2.2 스토리보드(Storyboard)
스토리보드는 화면과 기능 흐름을 정리한 기획 문서다. 와이어프레임이 구조 중심이라면, 스토리보드는 여기에 기능 설명과 동작 방식까지 포함된다. 버튼을 클릭했을 때 어디로 이동하는지, 어떤 팝업이 뜨는지, 예외 상황은 어떻게 처리되는지 등을 상세하게 정리한다.
실무에서는 디자이너와 개발자가 가장 많이 참고하는 문서 중 하나다. 특히 개발 단계에서는 스토리보드 내용이 명확하지 않으면 기능 구현 방향이 달라질 수 있기 때문에 매우 중요하다. 실제 프로젝트에서는 PPT나 Figma, Notion 등을 활용해 제작하는 경우가 많으며, 화면 설명과 기능 정의를 함께 정리하는 형태로 구성된다.
2.3 플로우 차트(Flow Chart)
플로우 차트는 사용자의 이동 흐름을 정리한 구조도다. 사용자가 어떤 순서로 서비스를 이용하는지 화살표와 도형을 통해 한눈에 볼 수 있게 만든다. 예를 들어 로그인 → 메인 → 상품 선택 → 결제 완료 같은 흐름을 시각적으로 정리하는 방식이다.
UX에서 사용자 동선은 매우 중요하다. 사용자가 너무 많은 단계를 거치거나 어디로 이동해야 하는지 헷갈리기 시작하면 이탈 가능성이 높아지기 때문이다. 그래서 좋은 UX는 사용자가 생각하지 않아도 자연스럽게 다음 행동을 할 수 있도록 흐름을 단순하게 설계한다. 플로우 차트는 결국 사용자가 길을 잃지 않도록 만드는 구조 설계 과정에 가깝다.
2.4 목업(Mockup)
목업은 실제 서비스처럼 보이게 만든 시안 이미지다. 와이어프레임보다 훨씬 시각적인 단계이며, 컬러와 이미지, 폰트, UI 스타일 등이 적용된다. 쉽게 말하면 “실제로 출시되면 이런 느낌입니다”를 보여주는 단계라고 볼 수 있다.
특히 브랜드 프로젝트에서는 목업 단계가 중요하다. 같은 구조라도 컬러와 톤에 따라 브랜드 분위기와 신뢰감이 크게 달라지기 때문이다. 그래서 실무에서는 목업을 통해 전체적인 브랜드 무드와 사용자 인상을 먼저 확인하는 경우가 많다.
2.5 프로토타입(Prototype)
프로토타입은 실제 서비스처럼 동작하는 테스트 모델이다. 단순히 화면만 보는 것이 아니라 버튼 클릭, 페이지 이동, 스크롤 같은 인터랙션까지 확인할 수 있다. 피그마 같은 툴을 활용해 간단하게 프로토타입을 제작하는 경우가 많다.
프로토타입이 중요한 이유는 개발 전에 문제를 발견할 수 있기 때문이다. 디자인 시안으로 볼 때는 괜찮아 보였던 구조도 실제로 클릭해보면 불편한 경우가 많다. 그래서 UX에서는 단순히 예쁜 화면보다 사용자가 실제로 어떻게 행동하는지를 테스트하는 과정이 매우 중요하다.
3. UX 디자인에서 가장 중요한 개념들
UX 디자인은 단순히 화면을 예쁘게 만드는 작업이 아니다. 사용자가 서비스를 얼마나 쉽게 이해하고, 자연스럽게 행동할 수 있는지를 설계하는 과정에 가깝다. 그래서 실무에서는 단순한 비주얼보다 사용자의 행동과 경험을 더 중요하게 본다. 특히 유저빌리티, 어포던스, 사용자 흐름, 인터랙션 같은 개념들은 UX를 이해할 때 가장 기본이 되는 핵심 요소들이다.
3.1 유저빌리티(Usability)
유저빌리티는 사용자가 서비스를 얼마나 쉽고 편하게 사용할 수 있는지를 의미한다. 쉽게 말하면 “사용하기 쉬운가?”에 대한 개념이다. 아무리 디자인이 화려해도 사용자가 원하는 정보를 찾기 어렵거나 기능 사용 방법을 이해하지 못하면 좋은 UX라고 보기 어렵다.
좋은 UX는 설명이 많지 않아도 사용자가 자연스럽게 이해할 수 있어야 한다. 예를 들어 회원가입 버튼이 잘 보이지 않거나 메뉴 구조가 복잡하면 사용자는 쉽게 피로감을 느낀다. 반대로 버튼 위치가 직관적이고 정보 구조가 명확하면 사용자는 고민 없이 서비스를 이용할 수 있다.
유저빌리티에서는 접근성과 가독성도 중요하게 다뤄진다. 글씨 크기가 너무 작거나 대비가 약하면 읽기 어렵고, 모바일 환경에서 터치 영역이 좁으면 사용성이 떨어질 수 있다. 결국 좋은 UX는 사용자가 ‘생각하지 않아도’ 편하게 사용할 수 있도록 만드는 것이다.
3.2 어포던스(Affordance)
어포던스는 디자인이 특정 행동을 자연스럽게 유도하는 특성을 말한다. 쉽게 말하면 사용자가 별도의 설명 없이도 “이건 누르는 버튼이구나”, “여기는 입력하는 공간이구나”를 직관적으로 이해하게 만드는 것이다.
예를 들어 버튼은 그림자나 컬러를 통해 눌릴 수 있는 형태처럼 보여야 하고, 스크롤 가능한 영역은 더 아래로 내려갈 수 있다는 느낌을 줘야 한다. 만약 버튼이 일반 텍스트처럼 보인다면 사용자는 클릭 가능한 요소인지 헷갈릴 수 있다.
좋은 UX는 사용자가 배우지 않아도 사용할 수 있는 상태를 만든다. 그래서 어포던스는 직관적인 UX를 만드는 핵심 개념 중 하나로 자주 이야기된다.
3.3 사용자 흐름(User Flow)
사용자 흐름은 사용자가 서비스 안에서 이동하는 과정을 의미한다. 사용자가 어떤 경로로 들어오고, 어떤 순서로 행동하며, 최종적으로 어떤 목표에 도달하는지를 설계하는 것이다.
예를 들어 쇼핑몰에서는 사용자가 상품을 발견하고, 상세페이지를 확인한 뒤 결제까지 이어지는 흐름이 자연스러워야 한다. 만약 중간 단계가 너무 복잡하거나 이동 경로가 헷갈리면 사용자는 쉽게 이탈하게 된다.
그래서 UX는 결국 사용자의 행동을 설계하는 작업이라고 볼 수 있다. 사용자가 어디서 고민하는지, 어디서 멈추는지, 어떤 흐름에서 편안함을 느끼는지를 계속 관찰하고 개선하는 과정이 UX의 핵심이다.
3.4 인터랙션(Interaction)
인터랙션은 사용자의 행동에 반응하는 모든 움직임과 반응을 의미한다. 버튼 클릭 효과, 스크롤 애니메이션, 화면 전환, 로딩 효과 등이 모두 인터랙션에 포함된다.
작은 움직임처럼 보이지만 실제 사용자 경험에는 큰 영향을 준다. 예를 들어 버튼을 눌렀는데 아무 반응이 없다면 사용자는 제대로 눌렸는지 불안함을 느낄 수 있다. 반대로 버튼이 자연스럽게 반응하거나 화면 전환이 부드럽게 이어지면 서비스가 훨씬 안정적으로 느껴진다.
최근 UX/UI에서는 이런 작은 인터랙션 요소들을 중요하게 생각한다. 단순히 화면을 꾸미기 위한 애니메이션이 아니라, 사용자가 현재 어떤 행동을 하고 있는지 이해할 수 있도록 돕는 역할을 하기 때문이다.
4. 웹과 앱은 어떤 방식으로 만들어질까
사용자가 보는 서비스는 비슷해 보여도 실제 제작 방식은 서로 다르다. 어떤 구조로 개발하느냐에 따라 제작 비용, 유지보수 방식, 성능, 사용자 경험까지 달라진다. 그래서 UX/UI를 공부할 때는 디자인뿐 아니라 웹과 앱이 어떤 방식으로 만들어지는지도 함께 이해하는 것이 중요하다.
4.1 반응형 웹(Responsive Web)
반응형 웹은 화면 크기에 따라 레이아웃이 유동적으로 변하는 구조를 말한다. 하나의 웹사이트를 제작하면 PC, 태블릿, 모바일 환경에 맞춰 자동으로 화면이 재배치된다.
예를 들어 PC에서는 4개의 카드가 가로로 보이던 화면이 모바일에서는 1열 구조로 변경되는 방식이다. 최근에는 모바일 사용 비율이 매우 높아졌기 때문에 대부분의 웹사이트가 반응형 구조를 기본으로 사용한다.
특히 브랜드 홈페이지나 기업 사이트에서는 다양한 환경에서도 동일한 사용자 경험을 제공하는 것이 중요하기 때문에 반응형 웹이 거의 필수처럼 사용되고 있다.
4.2 적응형 웹(Adaptive Web)
적응형 웹은 디바이스별 화면을 따로 제작하는 방식이다. 반응형처럼 유동적으로 변하는 구조가 아니라, 미리 제작해둔 PC용 화면과 모바일용 화면을 각각 보여주는 개념에 가깝다.
예를 들어 PC에서는 데스크톱 전용 레이아웃이 보이고, 모바일에서는 모바일에 최적화된 별도 화면이 노출된다. 대표적으로 예전 네이버 모바일 페이지처럼 PC 주소와 모바일 주소가 따로 운영되는 방식이 이에 해당한다.
반응형보다 제작 난이도와 관리 비용은 높지만, 디바이스 환경에 맞춰 더 세밀하게 최적화할 수 있다는 장점이 있다.
4.3 네이티브 앱(Native App)
네이티브 앱은 각 운영체제에 맞춰 별도로 개발하는 앱 방식이다. 안드로이드 앱은 안드로이드용으로, iOS 앱은 아이폰용으로 각각 제작한다.
운영체제에 최적화되어 있기 때문에 성능이 뛰어나고 카메라, GPS, 센서 같은 스마트폰 기능도 안정적으로 활용할 수 있다. 그래서 게임이나 대형 플랫폼 서비스들은 대부분 네이티브 앱 방식을 사용한다.
다만 안드로이드와 iOS를 따로 개발해야 하기 때문에 제작 비용과 유지보수 부담이 크다는 단점도 있다.
4.4 하이브리드 앱(Hybrid App)
하이브리드 앱은 웹 기술을 기반으로 제작되는 앱 구조다. HTML, CSS, JavaScript 같은 웹 기술로 개발한 뒤 앱 형태로 감싸서 사용하는 방식이다.
하나의 코드로 여러 운영체제를 대응할 수 있기 때문에 개발 속도가 빠르고 비용 부담이 상대적으로 적다. 그래서 초기 스타트업이나 MVP 서비스에서 자주 사용하는 방식이기도 하다.
다만 네이티브 앱에 비해 성능이나 인터랙션 부분에서 한계가 있을 수 있으며, 복잡한 기능이 많아질수록 최적화 문제가 발생하기도 한다.
4.5 모바일 웹앱(Mobile Web App)
모바일 웹앱은 별도의 설치 없이 모바일 브라우저에서 바로 접속해 사용하는 서비스다. 사용자는 앱스토어를 거치지 않아도 URL만으로 서비스를 이용할 수 있다.
유지보수와 업데이트가 빠르다는 장점이 있으며, 수정 사항도 즉시 반영할 수 있다. 최근에는 웹 기술이 발전하면서 모바일 웹앱도 앱과 비슷한 경험을 제공하는 경우가 많아지고 있다.
다만 인터넷 연결이 필요하고, 스마트폰 기능 접근이나 성능 면에서는 일반 앱보다 제한적인 부분이 존재한다. 그럼에도 최근에는 앱과 웹의 경계가 점점 흐려지면서 모바일 웹 기반 서비스도 계속 증가하는 흐름을 보이고 있다.
5. 프로젝트 실무에서 자주 나오는 용어
실무에서는 디자인 작업만큼이나 프로젝트를 관리하고 협업하는 과정도 중요하다. 특히 UX/UI 프로젝트는 기획자, 디자이너, 개발자가 함께 움직이는 경우가 많기 때문에 공통적으로 사용하는 실무 용어들을 이해하는 것이 필요하다. 이런 용어들은 단순한 업무 표현이 아니라 프로젝트 흐름과 협업 구조를 이해하는 데 중요한 역할을 한다.
5.1 A/B 테스트
A/B 테스트는 두 가지 버전의 화면이나 기능을 비교하여 사용자 반응을 확인하는 테스트 방식이다. 예를 들어 버튼 색상이나 위치, 문구를 다르게 적용한 뒤 어떤 버전에서 더 높은 클릭률이나 전환율이 나오는지 비교하는 방식이다.
UX에서는 감각만으로 디자인을 판단하지 않는다. 실제 사용자의 행동 데이터를 기반으로 더 좋은 방향을 찾는 과정이 중요하다. 그래서 작은 버튼 하나도 A/B 테스트를 통해 사용자 반응을 확인하며 개선하는 경우가 많다.
5.2 Depth(깊이)
Depth는 사이트 구조의 계층 단계를 의미한다. 쉽게 말하면 사용자가 메뉴 안으로 몇 단계까지 들어가는지를 나타내는 개념이다.
예를 들어 메인 메뉴가 1Depth, 그 안의 세부 메뉴가 2Depth, 상세 페이지가 3Depth가 되는 방식이다. 일반적으로 사용자가 너무 깊은 구조 안으로 들어가게 되면 현재 위치를 헷갈리거나 길을 잃기 쉽다.
그래서 UX에서는 메뉴 구조를 단순하게 설계하는 것이 중요하다. 사용자가 최소한의 단계로 원하는 정보에 도달할 수 있어야 좋은 사용자 경험으로 이어진다.
5.3 킥오프 미팅(Kick-off Meeting)
킥오프 미팅은 프로젝트 시작 단계에서 진행하는 첫 회의를 의미한다. 프로젝트 목표와 일정, 역할 분담, 작업 방향 등을 전체적으로 공유하는 과정이다.
실무에서는 이 단계가 굉장히 중요하다. 처음 방향이 명확하게 정리되지 않으면 이후 디자인과 개발 과정에서 수정이 반복되기 때문이다. 특히 브랜드 방향이나 UX 목표가 초반에 제대로 공유되지 않으면 팀마다 이해하는 기준이 달라질 수 있다.
그래서 킥오프 미팅은 단순한 시작 회의가 아니라 프로젝트 전체 방향을 맞추는 과정에 가깝다.
5.4 레퍼런스(Reference)
레퍼런스는 디자인이나 기획 작업 전에 참고하는 사례 자료를 의미한다. 보통 비슷한 업종의 웹사이트나 앱, UI 스타일, 브랜드 무드 등을 수집하며 방향성을 정리한다.
하지만 레퍼런스는 단순히 예쁜 디자인을 찾는 과정이 아니다. 왜 이런 구조를 사용했는지, 어떤 사용자 경험을 만들고 있는지 분석하는 과정이 더 중요하다.
실무에서는 Pinterest, Behance, Dribbble 같은 사이트를 많이 참고하며, 최근에는 다양한 SaaS 서비스나 글로벌 브랜드 사이트들도 UX 레퍼런스로 자주 활용된다.
5.5 디자인 QA
디자인 QA는 디자인이 실제 개발 화면에서 제대로 구현되었는지 확인하는 검수 과정이다. 디자인 시안과 실제 개발 결과물은 생각보다 차이가 많이 발생하기 때문에 반드시 확인이 필요하다.
대표적으로 여백 간격, 폰트 크기, 버튼 스타일, 컬러값, 모바일 대응, 인터랙션 등이 다르게 적용되는 경우가 많다. 그래서 실무에서는 개발 완료 후 디자이너가 직접 화면을 보면서 수정 사항을 체크하는 과정을 진행한다.
좋은 UX는 디자인 파일에서 끝나는 것이 아니라 실제 사용자 화면까지 동일한 경험이 유지되어야 완성된다. 그래서 디자인 QA는 프로젝트 마무리 단계에서 매우 중요한 작업 중 하나로 여겨진다.
6. 결국 UX는 사람을 이해하는 일이다
많은 사람들이 UX를 단순히 화면을 예쁘게 만드는 작업이라고 생각하지만, 실제 UX는 훨씬 더 사람에 가까운 영역이다. 버튼 하나를 어디에 배치할지, 어떤 문구를 사용할지, 사용자가 어떤 순서로 이동할지를 계속 고민해야 하기 때문이다. 결국 UX는 화면 디자인 자체보다 사용자의 행동과 경험을 설계하는 과정에 가깝다.
좋은 UX는 사용자가 고민하지 않게 만든다. 회원가입 방법을 굳이 설명하지 않아도 자연스럽게 진행할 수 있고, 원하는 정보를 어렵지 않게 찾을 수 있어야 한다. 사용자가 서비스를 사용하면서 “어떻게 해야 하지?”라는 생각이 들기 시작하면 UX는 복잡해질 가능성이 높아진다.
그래서 UX에서는 단순히 보기 좋은 디자인보다 “왜 이렇게 설계했는가”에 대한 이유가 중요하다. 버튼 위치 하나에도 사용자 시선 흐름과 행동 패턴이 고려되고, 메뉴 구조 하나에도 사용자가 길을 잃지 않도록 하기 위한 의도가 담긴다. 결국 UX는 감각만으로 만드는 것이 아니라 사용자를 이해하고 관찰하는 과정 속에서 완성된다.
UX를 공부할수록 느끼게 되는 것은 결국 사람에 대한 이해가 중요하다는 점이다. 사용자가 어디에서 불편함을 느끼는지, 어떤 상황에서 이탈하는지, 무엇을 더 편하게 느끼는지를 계속 고민하게 된다. 그래서 UX는 단순한 디자인 분야라기보다 사람의 행동과 경험을 설계하는 분야에 더 가깝다고 볼 수 있다.