UI\UX 공부/UIUX강의정리

[실전UI디자인] ch1. UI 디자인의 개념

아노말로카리스 2025. 8. 7. 19:48
UI 디자인 목적
  • UI = User Interface : 사용자가 시스템과 만나는 첫 장면이자 사용자의 행동을 유도하는 설계된 접점.
  • UI 디자인의 본질은 행동을 설계하는 일로, 사용자가 서비스를 사용하는 모든 순간, 우리가 원하는 행동을 하도록 유도하는 것이 목적이다.
사용자 흐름 설계
  • 디자이너가 설계하는 것은 UI의 화면 구성 뿐만 아니라 사용자가 자연스럽게 흐름에 따라서 움직이도록 도와줄 화면을 설계하는 것이다.
  • 디자인의 좋고 나쁨을 가르는 기준 역시, 사용자가 흐름에 따라서 원하는 바를 더 빠르게 얻을 수 있도록 하는 디자인이 좋은 디자인이다.
  • 즉, 디자인 설계구체적인 목적지에 무사히 도달하도록 사용자의 행동의 흐름을 설계하는 것으로, 이는  사용자 행동을 중심으로 설계하는 것하는 것으로 답을 줄 수 있다.
    • 목표(Goal): 사용자가 이루고자 하는 목적
    • 행동(Task): 목적을 이루기 위한 단계별 액션
    • 흐름(Flow): 액션을 연결하는 정보 구조행동 설계의 주요 3가지 요소 
북극성 지표
  • 설계한 사용자 행동에 맞춰서 어떻게 UI를 설계해야 그 행동의 목적을 달성할 수 있게 도울지를 고민하는 것이 필요하다.
  • 북극성 지표는 사용자 목적의 방향의 기준이나 지표를 숫자로 나타낸 것으로, 분석한 데이터를 통해 확신할 수 있는 기준을 만든다.
  • 이 지표는 과거, 항해사들이 북극성을 길잡이로 쓴 것처럼 실무에서 여러 사람이 함께 협업하는 과정에서 디자인이 올바른 방향으로 가고 있는지를 알려주는 요소이다.
  • 단순 클릭이나 노출 수보다 더 의미 있는 행동에 대해 분석하여 제품이나 서비스가 가야할 방향을 알려주는 기준이 된다.
인게이지먼트 게임
  • 제품과 사용자의 목적에 따라 핵심 지표의 유형이 달라지는 것으로, 차이에 따라 사용자가 어떤 패턴으로 제품의 행동에 몰입하는 지를 정의한 특징이다.
    • ① Attention Game: 오래 머무를 수록 이득이 발생
      • 사용자가 ‘더 보고 싶어지는’ 경험을 느끼도록 UI를 설계하여, 사용자가 더 오래, 더 자주 앱을 사용하도록 유도한다.
      • 대표적으로는 콘텐츠 소비를 통한 몰입을 통해 체류 시간, 스크롤 깊이, 페이지뷰를 늘리는 것이 있다.
    • ② Transaction Game: 거래가 발생할 수록 이득이 발생
      • 사용자가 앱 안에서 물질 재화와 무형 서비스의 거래나 결과를 만들어내게 한다.
      • 사용자가 빠르게 목적을 달성할 수 있도록 빠르고 명확한 흐름을 설계하여 주문 수, 완료율, 구매 전환율 등을 올리도록 한다.
    • ③ Productivity Game: 업무를 완수할 수록 이득이 발생
      • 사용자가 앱 안에서 생산적인 활동을 하여 업무나 특정 작업을 돕는 형태의 서비스.
      • 생성된 콘텐츠 수, 정리된 데이터 수, 공유 빈도 등을 통해 사용자에게 무언가를 만들어가는 의미와 무언가를 끝마치는 성취감을 주도록하는 것이 중요하다.
  • 확장 : 하나의 서비스는 반드시 하나의 게임만 하진 않는다. 대부분의 제품이 하나의 게임에 집중하여 시작하고, 충분히 성장하면서 다른 게임의 속성까지 확장한다.
실무 설계로 사용자 행동 흐름 만들기
  • 북극성 지표와 인게이지먼트 게임은 UI 디자인을 UX와 연결하는 핵심 모델로, 이 둘을 어떤 흐름으로 설계하고 키우기 위해서 이를 유도하는 흐름이 필요하다.
  • 실무에서는 기능이나 UI 화면을 우선 시 하기보다는, 가장 중요한 목적을 향한 사용자 흐름을 먼저 고민하여, 지표를 올리는 게임을 어떤 흐름으로 설계할 지 고민하는 일이 많다.
  • 이 고민은 UI 디자인의 방향을 알려주는 동시에 UX 설계의 핵심이 되는 요소이다.
문제 정의
  • 하나의 제품과 서비스 내에서도 사용자는 다양한 의도와 목표를 가지고 움직이며, 그 중에서도 반드시 이끌어 줘야하는 목표가 있다.
  • 이러한, 사용자가 행동을 하는 이유나 목적을 찾아서 지목하는 것을 문제 정의라고 한다.
  • 문제 정의는 무엇을 어떻게 해결할지 결정하는 기준과 서비스가 존재하는 이유를 찾는 것이다.
  • 문제 정의는 문제가 가져온 결과나 현상이 아니라 문제 그 자체를 정의하는 것으로, 반드시 사용자의 경험과 행동을 중심으로 문제를 다시 보는 것을 통해 디자이너가 문제를 다시 정의할 수 있어야 한다.
    EX)
    장바구니 UI가 불편하다-> 결과에 대한 개인적인 의견 |
    장바구니 UI가 다른 제품에 비해서 A라는 기능이 없어 불편하다->문제 정의.|

  • 자주 실수하는 문제 접근 방식
    • 이탈률이 높다 → 사용자의 의도와 동선이 맞지 않는다
      • ❌ “여기서 왜 나갔지? 그냥 UI가 별로인 건가?”
      • ✅ “혹시 사용자가 기대한 기능이나 정보가 이 화면에 없던 건 아닐까?”
      • 사용자 입장에서 ‘여기까지 들어왔으면 뭘 하고 싶었을까?’를 먼저 생각해봐야 한다. 
    • 전환율이 낮다 → 선택 순간에 망설이게 하는 요소가 있다
      • ❌ “버튼 색이 너무 약했나? CTA를 좀 더 눈에 띄게 해볼까?”
      • ✅ “이 사람이 클릭을 주저하는 이유는, 선택했을 때 뭘 얻게 되는지를 확신하지 못해서일 수 있어요.”
      • UI 디자인보다 신뢰, 맥락, 불확실성 제거를 통해 정보의 확신을 먼저 줘야한다.
    • 탭 전환율이 적다 → 구조가 아닌 맥락에 문제가 있다.
      • ❌ “탭 메뉴가 안 쓰이네. 아이콘을 바꿔볼까?”
      • ✅ “지금 사용자 입장에서 저 탭을 눌러야 할 ‘상황’인가?”
      • 탭은 구조가 아니라 다음 행동의 기대를 잘 연결시킨 흐름에 따라 누른다.
    • 리뷰가 부정적이다 → 사용자의 기대와 실제 경험이 다르다
      • ❌ “리뷰에 별점 낮게 준 사람은 그냥 까다로운 거 아냐?”
      • ✅ “그 사람은 어떤 기대를 가지고 앱을 켰을까? 그 기대가 어떻게 어긋났을까?”
      • 부정 리뷰에서 사용자들이 어떤 기대를 하고 서비스를 마주했고, 어떠한 기대의 충돌이 일어났는 지를 파악하지 않으면 경험 설계는 헛발질이 돼요.
    • 기능을 안 쓴다 → 기능을 위한 기능이 되어 버렸다
      • ❌ “유용한 기능인데 왜 아무도 안 쓰지? 노출 위치를 바꿔야 하나?”
      • ✅ “이 기능이 정말 사용자의 맥락 안에 있었을까? 아니면 제품팀이 만들고 싶어서 만든 걸까?”
      • 기능이 쓰이지 않는 건 사용자의 문제가 아닌 것 같이 의미 없는 시나리오로  억지로 해결하려고 할 때 생긴다.
  • UX 디자이너는 문제 정의에서 겉으로만 드러나는 결과나 현상만 보는 것이 아니라, 그것을 만든 구조와 원인을 찾아서 어느 곳에서 어긋났는지를 파악할 수 있어야 한다.