---
tags: [개발/설계, template/mermaid, user-flow, ux]
---

# 유저 플로우 · 여정

사용자가 화면·단계를 거치는 경로를 그린다. 기획·화면 설계·전환 지점 설명에 쓴다.

## 화면 전이형 (flowchart)

```mermaid
flowchart LR
    LAND[랜딩] --> SIGNUP{가입 여부}
    SIGNUP -->|신규| REG[회원가입]
    SIGNUP -->|기존| LOGIN[로그인]
    REG --> ONBOARD[온보딩]
    LOGIN --> HOME[홈]
    ONBOARD --> HOME
    HOME --> BROWSE[상품 탐색]
    BROWSE --> CART[장바구니]
    CART --> CHECKOUT[결제]
    CHECKOUT -->|성공| DONE[주문 완료]
    CHECKOUT -->|이탈| CART
```

## 감정 여정형 (journey — 만족도 1~5)

```mermaid
journey
    title 신규 사용자 첫 주문 여정
    section 발견
      광고 클릭: 3: 사용자
      랜딩 도착: 4: 사용자
    section 가입
      회원가입: 2: 사용자
      이메일 인증: 2: 사용자
    section 첫 구매
      상품 탐색: 4: 사용자
      장바구니: 4: 사용자
      결제: 3: 사용자
      완료: 5: 사용자
```

반드시 표기할 것: 이탈 지점, 분기 조건, 마찰이 큰 단계(journey의 낮은 점수 = 개선 우선순위). → UX 원리 [[UX 원리]].