A/B 테스트 기능 추가 — 노코드로 생성·배포·효과 측정까지

HeatMapX Engineering Team4 min read
  • ab-testing

HeatMapX에 A/B 테스트 기능을 추가했습니다. 히트맵으로 '페이지의 어디가 문제인지'를 찾았다면, 이번에는 '어떻게 고치면 좋아질지'를 실험으로 확인할 차례입니다. A/B 테스트는 페이지의 두 가지 버전(A와 B)을 방문자에게 나누어 보여주고, 어느 쪽이 더 많은 성과(클릭이나 신청 등)로 이어지는지 수치로 비교하는 기능입니다.

전문 지식이나 코드는 필요 없습니다. 히트맵과 동일하게 태그 한 줄로 측정을 시작한 화면에서 그대로 사용할 수 있습니다.

⚙ 노코드로 실험 만들기

  • 대상 사이트 선택: 등록된 사이트 중에서 테스트하고 싶은 사이트를 선택합니다.
  • 대상 페이지 지정: 서치 콘솔처럼 도메인은 고정 표시된 상태로 '어떤 페이지인지'만 입력합니다(비워두면 첫 페이지). 지정한 페이지 대상이 됩니다.
  • 변경 사항 만들기: 제목이나 버튼의 문구·색상 등의 변경을 화면에서 선택해 지정할 수 있습니다(비주얼 에디터). 잘 선택되지 않는 페이지를 위해 수동으로 지정하는 방법도 마련되어 있습니다.

🎯 '성과' 측정 방법 선택 가능

무엇을 성과로 볼지는 3가지 중에서 선택할 수 있습니다.

  • 클릭: 특정 버튼이나 링크가 클릭됨
  • 페이지 도달: 신청 완료 페이지 등에 도달함
  • 스크롤: 페이지의 일정 비율까지 읽어 내려감

⚖ '배포 비율'과 'A/B 비율'을 분리해서 설정

업계 표준에 맞춰 두 가지 설정을 분리했습니다.

  • 실험 포함 비율: 전체 방문자 중 몇 %를 실험 대상으로 할지(예: 우선 전체의 20%만으로 시작)
  • A/B 배분: 실험 대상 중에서 A와 B를 어떤 비율로 보여줄지(예: 50% 대 50%)

👁 변경 후 모습 미리보기

공개 전에 Variant B(변경 후)의 모습을 실제 페이지에 적용한 상태로 미리 볼 수 있습니다. 배포에는 영향을 주지 않으므로 안심하고 확인할 수 있습니다.

▤ 진행 중인 실험을 한눈에 확인

  • 실험 목록에 현재 진행 중인 개수와 상한을 표시합니다.
  • 실험은 일시정지/중지/재개가 가능하며, 각각의 의미를 알기 쉬운 라벨로 표시했습니다.

🌐 일본어·영어 지원

실험 생성 화면부터 목록·상세 화면까지 일본어와 영어 표시를 지원합니다.

영향 범위

A/B 테스트는 기존 측정 태그를 그대로 사용합니다. 추가 태그 설치는 필요하지 않습니다. 신용카드 등록 없이 시작할 수 있습니다.

Claude Code에서 실행하는 히트맵, 무료로 시작.

한 줄의 트래커 태그를 붙이고 CLI에서 분석부터 개선 제안까지.