모바일 결제 이탈을 줄이는 체크아웃 UX

장바구니까지 잘 오던 손님이 결제 버튼 앞에서 사라지는 순간, 그게 제일 아파요. 광고비 써서 데려오고, 상세페이지에서 설득하고, 카트에 담기까지 시켰는데 마지막 한 걸음에서 놓치는 거니까요. 저도 자사몰 처음 열었을 때 결제 전환율이 1.2% 나오는 걸 보고 상세페이지만 붙잡고 몇 주를 고쳤어요. 근데 문제는 상세페이지가 아니라 결제창이었어요.

모바일에서 주문의 80% 이상이 일어나는데, 정작 결제 단계는 PC 기준으로 짜여 있는 경우가 많아요. 손가락으로 눌러야 하는데 필드는 열두 개고, 주소는 직접 타이핑해야 하고, 카드번호 넣다가 오타 한 번 나면 그냥 창을 닫아버려요. 오늘은 그 마지막 구간, 모바일 체크아웃에서 이탈을 어떻게 줄였는지 실제로 만졌던 것들 위주로 풀어볼게요.

결제 단계는 무조건 줄이는 게 정답일까

흔히 "단계를 줄여라"라고 하는데, 이게 반은 맞고 반은 틀려요. 화면 수를 줄이는 것과 손님이 해야 할 일을 줄이는 건 다른 얘기거든요. 한 화면에 필드 열다섯 개를 몰아넣으면 화면은 하나지만 손님 입장에선 더 숨 막혀요. 반대로 화면을 나눠도 각 화면이 가벼우면 오히려 편하게 느껴요.

제 경험상 모바일 결제는 "진행 상황이 보이는 짧은 스텝"이 제일 안정적이었어요. 배송정보 → 결제수단 → 확인, 이렇게 세 덩어리로 나누고 상단에 진행 바를 두니까 중간 이탈이 눈에 띄게 줄었어요. 손님이 "아 이제 거의 다 왔네" 하고 느끼는 게 중요하더라고요...

실제로 우리 스토어에서 결제 흐름을 손보기 전후를 비교하면 이런 식이었어요. 표로 정리해봤어요.

전환율이 1.2%에서 2.6%로 두 배 넘게 올랐는데, 특별한 마법은 없었어요. 손님이 손가락으로 눌러야 할 횟수와 타이핑할 글자 수를 줄인 게 전부예요. 광고비 한 푼 더 안 쓰고 매출이 두 배가 된 셈이라, 사실 이게 광고 최적화보다 훨씬 남는 장사였어요. ROAS만 붙잡고 있을 때는 몰랐던 부분이에요.

폼 필드, 이렇게 줄이면 손님이 안 도망가요

결제 이탈의 진짜 범인은 대부분 입력 폼이에요. 특히 모바일에서요. 필드 하나 늘어날 때마다 이탈이 붙는다고 보면 돼요. 제가 실제로 적용해서 효과 봤던 것들을 순서대로 적어볼게요.

1. 안 쓸 필드는 지워요. 회사명, 상세주소 이중 입력, 별도 배송 메모 같은 건 필수에서 빼도 매출에 지장 없어요. "혹시 몰라서" 받아두는 정보가 손님을 쫓아내요. 우리는 회원가입 없이 비회원 주문 기본으로 열어두고, 이름·연락처·주소·결제 이 네 덩어리만 남겼어요.

2. 자동으로 채울 수 있는 건 자동으로. 우편번호 검색으로 주소 앞부분 자동 입력, 전화번호는 숫자만 치면 하이픈 자동, 카드번호는 네 자리마다 자동 띄어쓰기. 이런 작은 자동화가 오타를 막고 짜증을 줄여요. 오타 한 번이 이탈 한 번이에요.

3. 키보드 타입을 맞춰줘요. 이게 은근히 많이 놓치는 부분인데, 전화번호·카드번호 필드에 inputmode="numeric"를 안 걸어두면 모바일에서 문자 키보드가 떠요. 손님이 숫자 키패드로 바꾸려고 한 번 더 눌러야 하죠. 별거 아닌 것 같아도 이런 마찰이 쌓여요.

4. 에러는 그 자리에서, 부드럽게. 다 입력하고 결제 눌렀는데 "필수 항목을 확인하세요"라고 맨 위로 튕겨 보내면 손님은 어디가 틀렸는지 찾다가 지쳐요. 필드를 벗어나는 순간 바로 아래에 빨간 안내를 띄우고, 무엇을 어떻게 고쳐야 하는지 구체적으로 알려줘야 해요. "형식이 올바르지 않습니다"가 아니라 "010으로 시작하는 11자리를 입력해주세요" 이렇게요.

간편결제가 결국 승부처예요

모바일 결제에서 가장 큰 이탈 지점은 카드번호 입력이에요. 지갑 꺼내서 16자리 치고, 유효기간 치고, CVC 찾고... 이 과정을 손님이 한밤중에 침대에서 하고 싶어 하지 않아요. 그래서 간편결제를 얼마나 잘 깔아두느냐가 사실상 승부처예요.

네이버페이, 카카오페이, 토스, 페이코 같은 간편결제를 결제수단 맨 위에 두고, 그중 손님이 가장 많이 쓰는 걸 기본 선택으로 잡아두세요. 우리 스토어는 여성 의류라 네이버페이·카카오페이 비중이 압도적이라 이 둘을 최상단에 뒀어요. 지문이나 얼굴 인증 한 번으로 결제가 끝나니까, 카드 입력 구간을 통째로 건너뛰는 거예요.

간편결제 도입 전후로 결제수단 선택 구간 이탈이 21%에서 9%로 떨어졌는데, 이 한 방이 제일 컸어요. 카드 직접 입력을 고집하는 손님을 위해 그 옵션도 남겨두되, 첫눈에 보이는 자리는 간편결제한테 내주는 게 맞아요.

한 가지 더, 간편결제 로고는 공식 배지 이미지를 써야 신뢰가 가요. 대충 만든 텍스트 버튼보다 브랜드 로고가 박힌 버튼이 심리적으로 훨씬 안심돼요. 손님은 익숙한 아이콘을 보면 "아 이거 안전하지" 하고 무의식적으로 판단하거든요. 결제 직전의 이 짧은 순간에 신뢰가 흔들리면 그대로 이탈이에요...

무통장 입금은 단계는 짧아 보여도 "결제 후 이탈"이 많아요. 주문은 넣고 입금은 안 하는 케이스요. 그래서 저는 무통장을 아예 빼진 않되 눈에 덜 띄는 자리로 내렸어요. 손님 성향에 따라 다르니 이건 데이터 보고 판단하세요.

버튼 하나, 배송비 한 줄이 전환을 바꿔요

결제 버튼도 그냥 "결제하기"라고만 쓰지 말고 금액을 같이 보여주세요. "37,000원 결제하기"처럼요. 손님이 내가 지금 얼마를 내는지 버튼에서 바로 확인하면 마지막 망설임이 줄어요. 어디에도 안 나오던 최종 금액을 찾아 스크롤 올렸다 내렸다 하는 순간, 결제 의욕이 식어요.

그리고 배송비는 무조건 미리, 명확하게 보여줘야 해요. 결제 마지막에 갑자기 배송비 3,000원이 툭 붙으면 손님은 속은 기분이 들어서 창을 닫아요. 이게 장바구니 이탈의 숨은 1위예요. 차라리 무료배송 조건을 상단에 걸어두는 게 나아요. "3,000원만 더 담으면 무료배송" 같은 안내는 객단가도 올려주고요. 이건 무료배송 기준선 잡는 얘기로 따로 정리해뒀으니 참고하세요.

이런 자잘한 개선을 하나씩 적용할 때 반드시 같이 봐야 하는 게 실제 순수익 변화예요. 전환율이 올라도 배송비를 우리가 떠안으면 남는 게 없을 수 있거든요. 저는 대시부스터 실시간 대시보드로 주문이 들어올 때마다 광고비·배송비·부가세 다 빼고 진짜 남는 순수익을 보면서 조정했어요. "전환율은 올랐는데 왜 통장은 그대로지?" 하는 착시를 막아주더라고요. 결제 UX를 만질 때도 결국 기준은 매출이 아니라 순익이어야 해요.

마지막으로 속도. 결제 페이지가 3초 넘게 로딩되면 그 자체로 이탈이에요. 무거운 이미지, 불필요한 스크립트, 느린 배너를 결제 단계에서는 다 빼세요. 손님은 결제 직전에 가장 예민해요. 이 구간만큼은 화려함보다 빠름이 전환을 만들어요.

Q. 회원가입을 꼭 받아야 재구매가 늘지 않나요?

결제 단계에서 강제 가입을 요구하면 첫 구매 자체가 줄어요. 비회원 주문을 열어두고, 결제 완료 후에 "간편하게 가입하고 적립금 받으세요"로 유도하는 게 훨씬 나아요. 가입은 구매를 막는 문턱이 아니라 구매 다음의 보너스여야 해요.

Q. 간편결제 수수료가 카드보다 비싼데 그래도 붙이는 게 이득인가요?

수수료 0.1~0.5% 차이보다 전환율 두 배가 훨씬 커요. 이탈해서 아예 안 사는 손님보다 수수료 조금 더 내고 사는 손님이 백배 낫죠. 다만 순수익 기준으로 실제 남는지는 꼭 숫자로 확인하세요.

Q. 필드를 줄이면 배송 사고나 반품 문제가 늘지 않을까요?

정말 배송에 필요한 필드(이름·연락처·주소)는 남기고, "혹시 몰라서" 받던 것들만 빼는 거예요. 오히려 자동완성으로 주소 정확도가 올라가서 오배송이 줄었어요. 정보가 많다고 사고가 주는 게 아니라, 정확한 정보가 사고를 줄여요.