[Braze] 인앱메시지를 사용하여 결제 페이지에서 유저 이탈 방지하기🔒

인앱메시지

캠페인 기획

- 목표: 인앱 결제 페이지에서 구매하지 않고 나가는 유저의 이탈을 막고, 다시 한번 결제로 유도
- 발송 타이밍: 유저가 인앱 결제 페이지에서 닫기 버튼을 눌렀을 때
- 메시지: "무료 체험을 언제든 취소하실 수 있어요. 혜택을 포기하시겠어요?"
- 버튼: "사용해 볼게요!" , "무료로 시작해보기" , "무료 이용권 받을래요"
- 랜딩페이지: 시스템 결제창

캠페인 준비

- custom event: touch_close_purchase (유저가 결제 페이지에서 닫기 버튼을 눌렀을 때)
- event property: type_of_subscription (유저가 결제 페이지에서 닫기 버튼을 눌렀을 때, 유저가 어떤 이용권을 선택했었는지 / 값 단위를 개월로 통일한 후에 number로 로깅해야 시스템 결제창 딥링크에 활용 가능 * 우리 앱은 1개월, 1년 이용권에 대한 이용권(구독)이 있다.)
- custom attribute: subscription_status (발송 타겟이 미구독 유저이므로, 미구독 상태에 대해 커스텀 어트리뷰트가 기록되어야함)
- landing page: AOS/iOS 시스템 결제창에 대한 딥링크. 아래와 같이 이벤트 프로퍼티를 If문에 넣어서 딥링크에 바로 사용할 수 있다.

{% if {{event_properties.${type_of_subscription}}} == 1 %}
https://srisriapp/braze?screen=purchase&month=1
{% elsif {{event_properties.${using_perid}}} == 12 %}
https://srisriapp/braze?screen=purchase&month=12

캠페인 세팅

Braze의 Text with Optional Image Modal

나의 경우 캠페인을 custom code modal로 만들고자 하여, 디자인팀과 개발팀에 협업을 요청하였다. 브레이즈 기본 템플릿 모달로도 꽤 괜찮은 모달을 만들 수 있다. 작은 이미지가 들어가는 모달(text with optional image)과 이미지온리 모달(Image only)가 있는데, 작은 이미지가 들어가는 모달의 경우 29:10 비율의 이미지만 들어갈 수 있어서 디자인의 한계가 있지만 텍스트 부분에 liquid로 개인화가 가능하다는 장점이 있다. 이미지온리 모달의 경우 디자인을 이미지로 박아서 적용할 수 있어서 더 예쁜 모달을 만들 수 있지만, 텍스트 자체를 이미지에 넣어버리는 것이기 때문에 event property, custom attribute 등을 활용한 개인화 텍스트를 적용할 수 없다는 단점이 있다. 

커스텀으로 인앱메시지를 만들어도 버튼 클릭률을 확인할 수 있으며, 해당 버튼을 클릭한 유저 세그먼트를 생성하여 구매 이벤트 수행 비율을 확인할 수 있다. "무료 이용권 받을래요" 버튼을 클릭하고 나서 진짜 무료 체험을 시작했는지, 결제를 수행했는지 등을 볼 수 있는 것이다. 이를 위해서는 HTML 코드 안에서 appboyBridge.logClick() 부분에서 ( ) 안에 버튼 이름을 넣어야 한다.

이후 단계

현재 커스텀 코드에 대한 마이너한 수정 사항이 필요하여 아직 런치하지 못한 단계이다. 기대한 만큼 결과가 나올지, 나중에 또 포스팅 할 예정!