[내일 배움 캠프] 17일차

최준용·2026년 1월 21일

UI 디자인의 핵심, 화면이 아닌 '여정' 설계하기

UI 디자인을 단순히 예쁜 화면을 그리는 작업으로 오해하기 쉽지만, 본질은 사용자의 사고 경로를 설계하는 것입니다.

사용자 흐름(Flow): 사용자가 목표를 달성하기 위해 이동하는 단계입니다.

예시: 상품 탐색 → 거래 요청 → 대화 시작

Insight: 단순한 페이지 이동이 아니라, 사용자가 목적지에 도달하기까지의 심리적 허들을 낮추는 경로를 만드는 것이 중요합니다.

IA(Information Architecture)는 정보를 배치하는 것이 아니라, 사용자가 정보를 인식하는 순서를 결정하는 일입니다.

설계 원칙:

위계: 정보의 중요도에 따라 높낮이를 설정합니다.

선택과 집중: 결정(Decision)에 꼭 필요한 정보만 남깁니다.

그룹화: 행동(Action)을 돕는 정보끼리 묶어 인지 부하를 줄입니다.

역할 명확화: 각 화면이 탐색용인지, 결정용인지, 입력용인지 정의합니다.

[실전 적용 예시: 상품 상세 화면]

(상) 시각적 정보: 상품 이미지

(중) 핵심 정보: 가격 및 기본 정보

(하) 행동 유도: 거래 요청 버튼(CTA)

(기타) 신뢰 구축: 판매자 정보 및 후기

사용자의 시선은 기본적으로 좌→우, 상→하로 흐릅니다. 이 리듬을 깨지 않고 정보를 배치해야 합니다.

체크리스트:

One Goal: 각 화면에는 반드시 하나의 중심 행동만 존재하는가?

CTA 위치: 모든 정보를 충분히 인지한 후 시선의 끝에 버튼이 배치되었는가?

리듬감: 여백, 컬러, 폰트 크기를 통해 정보의 강약이 조절되었는가?

주제 선정: 가급적 제시된 시나리오를 활용하자. (피드백의 효율성과 명확한 기준을 위해)

화면 수: 핵심 흐름은 3장이 기본이며, 필요시 4~5장까지 확장 가능하지만 핵심 목표가 흐려지지 않게 주의하자.

정보 과부하 해결: 정보가 너무 많다면? 사용자의 결정을 돕는 최소 정보만 남기고 과감히 생략하자. (Less is More)

디자인을 시작하기 전, 텍스트로 먼저 정보의 위계를 정리하는 습관을 들여야 합니다. "사용자가 이 화면에서 무엇을 보고, 어떤 생각을 해서, 어디를 눌러야 하는가?"에 대한 답이 명확할 때 좋은 UI가 나옵니다.