송골농원에 주문·결제 화면을 붙였습니다

청송에서 사과를 직거래로 파시는 송골농원에 손님이 직접 고르고 주문하고 결제하는 화면을 붙였습니다. 리뉴얼 때는 전화와 문자, 계좌로 주문을 받았습니다. 이제는 홈페이지 안에서 주문이 끝납니다.

고르기부터 주문서까지 한 줄로 이었습니다

상품 상세에서 [바로 구매]를 누르면 장바구니에 담기고 곧바로 주문서로 넘어갑니다. 담기를 누른 뒤 장바구니를 다시 찾아 들어가는 걸음을 없앴습니다.

휴대폰에서는 화면 아래에 구매 바가 고정돼 있습니다. 사진과 상세정보를 한참 내려 읽어도 버튼이 늘 손끝에 있습니다. 이 고정 바는 위쪽 구매 폼을 그대로 보내기 때문에, 위에서 수량을 세 개로 고치고 아래 버튼을 눌러도 정확히 세 개가 담깁니다. 수량을 올리고 내릴 때마다 금액과 배송비 안내가 그 자리에서 함께 바뀝니다.

손이 멈추는 자리를 없앴습니다

주문서를 열어 놓고도 결제까지 가지 않는 자리는 대개 손으로 쳐야 하는 칸입니다. 칠 것을 눌러서 고르는 것으로 바꿨습니다.

• 주소는 빈 칸이 아니라 [주소 찾기] 버튼이 먼저 나옵니다. 동네 이름만 넣으면 우편번호와 주소가 채워지고, 직접 치는 칸은 동·호수 하나뿐입니다.
• 배송 요청사항도 '문 앞에 놓아 주세요', '부재 시 경비실에' 같은 버튼을 눌러 넣습니다. 문장을 직접 치지 않아도 됩니다.
• 한 번 주문하신 분은 다음 주문서에서 이름·연락처·배송지가 미리 채워집니다. 그 위에 미리 채워 두었다는 한 줄을 함께 띄워, 낯선 글자를 보고 멈칫하지 않게 했습니다.
• 다만 지난 주문이 선물이었다면 그 주소는 가져오지 않습니다. 예전에 선물 보낸 남의 집으로 이번 주문이 나가는 일을 막기 위해서입니다.
• 받는 분이 주문자와 같으면 체크 한 번으로 그 칸이 접힙니다. 같은 정보를 두 번 칠 일이 없습니다.

아이디가 기억나지 않아 로그인에서 멈추는 분이 계셔서, 네이버 계정으로 바로 들어오는 길도 함께 열어 두었습니다.

결제 수단은 세 갈래입니다

무통장입금, 카드·간편결제, 카카오페이 중에서 고르십니다. 카드만 받으면 그동안 계좌로 보내시던 단골이 전화로 돌아옵니다. 그래서 무통장입금을 그대로 남겼습니다.

카드를 고르면 계좌번호와 입금자명 칸이 화면에서 사라집니다. 카드로도 긁고 계좌로도 보내는 이중 입금을 막기 위해서입니다. 계좌 안내는 무통장입금을 고른 주문에만 나갑니다. 들어온 입금은 사장님이 통장을 보고 직접 확인하십니다.

금액은 화면이 아니라 서버가 계산합니다

화면에 보인 금액과 빠져나간 금액이 어긋나면 손님은 그 가게를 다시 찾지 않습니다. 그래서 주문 금액은 화면이 보낸 값을 믿지 않고 서버가 장바구니에서 다시 계산합니다.

배송비 기준도 한 곳에만 적어 두고 상품목록·상세·장바구니·주문서 네 화면에 같은 값으로 내보냅니다. 기준이 바뀌었는데 한 화면만 옛 금액을 말하는 일이 생기지 않습니다.

실패했을 때 다음 길을 함께 둡니다

결제에 실패하면 '결제가 안 됐습니다'로 끝내지 않습니다. [다시 결제하기]와 [무통장입금으로 바꾸기]를 같은 화면에 함께 둡니다. 카드가 자꾸 거절되는 손님도 버튼 하나로 길을 바꾸실 수 있습니다.

승인 응답이 늦어 돈이 나갔는지 알 수 없을 때는 결과를 확인하고 있다는 화면을 따로 보여 줍니다. 이 화면에는 다시 결제하는 버튼을 일부러 두지 않았습니다. 그 자리에 버튼이 있으면 손님이 한 번 더 눌러 두 번 결제되기 때문입니다.

주문한 뒤에 전화를 걸지 않게

주문 완료 화면은 무통장입금·결제완료·결제대기·확인 중 네 갈래로 갈립니다. 지금 무엇을 해야 하는지가 화면마다 다르게 적힙니다. 주문번호는 날짜가 앞에 오는 형식이라, 전화로 주고받을 때 어느 날 주문인지 서로 바로 압니다.

그다음은 마이페이지입니다. 주문내역에서 자기 주문을 최신순으로 보고, 운송장이 붙은 주문만 모아 보는 배송조회 화면이 따로 있습니다. 운송장이 등록되면 택배사 조회 페이지로 바로 가는 [배송조회] 버튼이 그 자리에 생깁니다. 아직 보내지 않은 주문은 손님이 직접 취소하실 수 있고, 취소 버튼은 실제로 취소가 되는 주문에만 그려집니다.

그래도 남는 궁금증은 전화보다 글이 편합니다. 낮에는 밭일로 전화를 못 받을 수 있어서, 카카오톡 채널과 네이버 톡톡 버튼을 화면에 함께 붙였습니다.

비슷한 고민이 있으시면

주문을 받기 시작하면 결제창을 붙이는 일보다 그 앞뒤가 더 손이 갑니다. 금액을 어디서 계산할지, 실패했을 때 손님을 어디로 보낼지, 주문한 뒤에 손님이 무엇을 혼자 확인할 수 있는지는 결제창이 대신해 주지 않습니다. 이 세 가지가 비면 그만큼이 전화 문의로 돌아옵니다.

지금 쓰고 계신 화면을 놓고 어디가 비어 있는지부터 함께 짚어 드립니다. 궁금한 점은 문의게시판에 남겨 주시면 답변드리겠습니다.