A/B 테스트 결과가 화면 크기에 따라 다를 수 있다. 모바일에서 좋은 디자인이 데스크톱에서 안 좋을 수 있다.
사용자 행동 차이
모바일 사용자는 스크롤을 많이 한다. 데스크톱 사용자는 한눈에 보려 한다. 같은 CTA 버튼 위치라도 효과가 다르다.
세그먼트 분리
A/B 테스트 도구에서 디바이스 타입별로 세그먼트를 나눠서 분석하자. 화면 크기 확인기로 각 세그먼트의 화면 크기를 파악하자.
결과 해석
전체 결과와 세그먼트별 결과가 다를 수 있다. 모바일 트래픽이 많으면 모바일 결과에 가중치를 줘야 한다. 확인기로 사용자 환경을 이해하자.
개발 워크플로우에 통합
화면 크기 확인을 개발 워크플로우의 일부로 만들자. 코드를 수정할 때마다 화면 크기 확인기로 다양한 크기에서 확인하는 습관이 중요하다. 자동화 테스트에 반응형 테스트를 포함시키는 것도 좋은 방법이다.
디자이너와의 협업
디자이너가 만든 시안이 어떤 화면 크기 기준인지 확인하자. 그리고 개발할 때 그 크기에서 먼저 구현하고, 다른 크기로 확장하면 효율적이다. Figma 프레임 크기와 실제 브라우저 크기를 확인기로 비교해보자.
QA 체크리스트
배포 전 주요 화면 크기에서의 동작을 확인하는 체크리스트를 만들어두자. 모바일(375px), 태블릿(768px), 데스크톱(1200px) 최소 세 가지는 확인하는 게 좋다. 확인기와 함께 체계적으로 테스트하자.