매출 증대를 위해 어떤 색상을 사용해야 할까요?

게시 됨: 2021-05-13

다시 한 번, A/B 테스트는 우리의 취향과 색상 선호도가 방문자의 취향과 항상 일치하지 않는다는 것을 보여주었습니다. 또는 웹사이트에 표시하는 색상이 매력적일 수 있지만 반드시 가장 많이 판매되는 색상은 아닙니다. 사실, 각 색상이 어떻게 다른 감정적 반응을 유발하는지, 그리고 이것이 청중을 어떻게 다르게 설득할 수 있는지를 연구하는 색상 심리학에 대한 많은 기사를 찾을 수 있습니다.

색상이 전달하는 감성과 로고에 사용하는 브랜드 안내
색상이 전달하는 감정과 색상을 로고에 사용하는 브랜드에 대한 안내(출처: 로고 컴퍼니).

이번 달에는 최근 Nelio Content 제품 계획과 가격 페이지 디자인을 변경하면서 더 많은 판매를 얻기 위해 각 계획에 어떤 색상을 표시해야 하는지 분석할 수 있는 절호의 기회라고 생각했습니다.

원래 페이지 디자인에서 파란색을 좋아하는 우리는 Nelio Content 계획 페이지의 다음 디자인을 제안했습니다.

A/B 테스트를 만들기 전 Nelio Content의 계획 및 가격 페이지 스크린샷
A/B 테스트를 만들기 전 Nelio Content 플랜 및 가격 책정 페이지의 스크린샷.

멋지죠? 그러나 매달 테스트를 실행한 경험에 대해 읽어 본 적이 있다면 비즈니스 결정을 내릴 때 취향에만 집중하지 말고 대신 실제 데이터를 얻어야 합니다. 수익에 가장 큰 영향을 미치는 것.

따라서 이번 달 Nelio A/B Testing을 사용한 테스트에서는 가격 책정 페이지의 어떤 색 구성표가 더 많은 수입을 창출하는지 분석합니다.

파란색 변형으로 표시된 Nelio Content 계획의 스크린샷
A/B 테스트의 원본 버전: 파란색 변형으로 표시된 Nelio 콘텐츠 계획.

가격 책정 페이지 테스트 만들기

웹사이트의 모든 요소에 대한 A/B 테스트를 생성하기 전에 항상 웹사이트에서 작동하는 부분, 마찰과 문제가 더 많은 부분에 대한 분석을 수행하고 개선할 수 있는 부분에 대한 가설을 생성하는 것이 좋습니다. 생성한 가설 목록에서 목표에 가장 큰 영향을 미칠 것의 우선 순위를 지정하십시오. 즉, 방문 페이지와 가격 페이지는 블로그 게시물보다 매출 증대에 훨씬 더 큰 영향을 미칠 것입니다.

이 경우 이 테스트를 만든 주된 동기는 다음과 같습니다. Nelio Content 플랜을 변경하고 전체 가격 페이지를 다시 디자인했기 때문에 새로운 디자인이 가능한 최고의 색 구성표를 사용하도록 하는 기회를 잡았습니다.

우리는 원래 버전 외에 다음과 같은 색상 조합으로 두 가지 다른 변형을 만들기로 결정했습니다.

A/B 테스트의 첫 번째 변형에 표시된 Nelio Content 계획의 스크린샷
A/B 테스트의 첫 번째 변형에 표시된 Nelio Content 계획의 스크린샷.

첫 번째 변형에서는 올해 매우 유행하는 파스텔 색상을 선택하여 계획을 보여주기로 결정했습니다.

A/B 테스트의 두 번째 변형에 대한 Nelio Content의 계획 스크린샷
A/B 테스트의 두 번째 변형에 표시된 Nelio Content 계획의 스크린샷.

그리고 위의 이미지에서 볼 수 있는 것처럼 두 번째 변형을 만들었습니다. 여기서 우리는 자홍색으로 강조 표시하기를 원했고 Standard 계획과 가장 어두운 파란색 배경과 녹색 버튼으로 표시하기 위해 다른 두 계획을 만들었습니다.

일반적으로 우리는 다른 색을 선택하거나 다른 색 구성표를 만들 수도 있었지만 많은 대안을 만드는 것의 문제는 통계적으로 유의미한 결과를 얻으려면 더 많이 방문해야 한다는 것입니다.

A/B 테스트 만들기

A/B 테스트를 생성하기 위해 항상 그렇듯이 자체 플러그인인 Nelio A/B Testing을 사용합니다. 공식 WordPress 플러그인 디렉토리에서 다운로드하여 웹사이트에 설치하면 이와 같은 테스트를 만들 수 있습니다. 웹사이트에서 테스트를 생성하기 위해 어떤 A/B 테스트 플러그인을 사용할지 여전히 의심스럽다면 WordPress용 A/B 테스트 플러그인 비교를 읽어보는 것이 좋습니다.

Nelio A/B Testing은 모든 WordPress 요소에 대한 A/B 테스트를 생성할 수 있도록 하므로 매우 다재다능합니다. 이 경우 페이지의 A/B 테스트를 만듭니다. 이 유형의 테스트를 통해 원본 페이지를 새로운 대체 페이지로 복제하여 새로운 변형을 생성할 수 있습니다. 테스트에서는 위에서 설명한 대로 각 계획의 배경색을 간단히 변경했습니다. 사용하는 페이지 템플릿의 일부를 변경하려는 경우 대체 템플릿을 만들고 페이지 템플릿의 A/B 테스트를 대신 실행하여 변경할 수 있습니다.

다음 스크린샷에서 테스트의 정의를 볼 수 있습니다.

Nelio Content 계획의 A/B 테스트 정의 스크린샷
Nelio Content 계획 페이지의 A/B 테스트 정의 스크린샷.

다음으로 A/B 테스트를 생성할 때 테스트에서 측정하려는 목표를 설정하여 가장 효과적인 것을 결정해야 합니다. 이 경우 테스트 내에서 측정할 4가지 목표를 정의했습니다.

  • 모든 계획의 버튼 클릭
  • 기본 계획 버튼 클릭
  • 표준 계획 버튼 클릭
  • 플러스 플랜의 버튼 클릭

이 모든 것이 생성되면 테스트를 시작하고 결과가 나올 때까지 기다리기만 하면 됩니다. Nelio A/B Testing은 트래픽을 세 개의 무작위 그룹으로 나누어 각각 정의된 변형 중 하나만 볼 수 있도록 하고 각 변형과 목표가 얻는 전환을 추적합니다.

A/B 테스트 결과 분석

이 테스트를 1개월 9일 동안 실행한 후 거의 100% 신뢰도로 통계적으로 유의한 결과를 얻었습니다. 각각의 목표에 대해 자세히 분석하고 테스트에서 도출할 수 있었던 결론을 살펴보겠습니다.

첫 번째 목표는 가격표 계획 버튼에 대한 클릭을 측정하는 것이었습니다(표는 페이지에 두 번 표시됨).

수행한 A/B 테스트의 첫 번째 목표의 결과 분석
수행한 A/B 테스트의 첫 번째 목표의 결과 분석.

이 경우 결과는 두 번째 변형인 대안 C가 원본 버전보다 거의 130%(정확하게는 129.6%) 더 많은 클릭을 얻은 것으로 나타났습니다. 대조적으로, 파스텔 색상으로 계획을 보여주는 변형은 25.5% 더 나쁩니다. 테스트의 이 목적만 있었다면 대안 C는 압도적인 결과를 얻었을 것입니다.

두 번째 목표는 받은 기본 계획 버튼의 클릭수에 중점을 두었습니다. 결과가 어떻게 다른지 봅시다.

수행한 A/B 테스트의 두 번째 목표 결과 분석 스크린샷
수행한 A/B 테스트의 두 번째 목적의 결과 분석.

기본 계획에 대한 클릭에만 초점을 맞춘 경우 세 번째 변형과 원본 버전의 차이는 여전히 상당하지만 73.7%의 개선은 모든 클릭을 분석하는 것만큼 크지 않습니다. 그리고 파스텔 컬러 변형의 경우에도 기존의 경우와 마찬가지로 원본보다 나빠지지만 그 차이는 12.3%이다. 곰곰이 생각해보면 변종들이 특히 기본 계획을 강조하는 데 초점을 맞추지 않기 때문에 어느 정도 이해가 될 것입니다.

이제 Standard 플랜의 클릭을 측정하려는 결과를 살펴보겠습니다.

수행한 A/B 테스트의 세 번째 목표 결과 분석 스크린샷
수행한 A/B 테스트의 세 번째 목표의 결과 분석.

이 경우 계획에서 더욱 눈에 띄는 색상으로 정확히 눈에 띄는 세 번째 변형의 개선 사항은 원본 버전보다 228.1% 더 많은 클릭을 달성합니다. 따라서 계획을 강조 표시하는 것이 어떤 영향을 미치는지 의심이 든다면 이 테스트에서 사람들이 가장 눈길을 끄는 요소에 끌린다는 것이 분명합니다.

마지막으로 최신 계획에서 어떤 일이 발생하는지 봅시다.

수행한 A/B 테스트의 네 번째 목표 결과 분석 스크린샷
수행한 A/B 테스트의 네 번째 목적의 결과 분석.

이 경우 원본에 비해 대안 C의 개선은 95.7%의 신뢰도로 거의 3%입니다. 그리고 어쨌든 모든 대안에서 Plus 계획의 전환은 거의 없습니다. 실제로 대부분의 고객은 처음에는 더 낮은 요금제를 선택한 다음 나중에 다른 요금제로 전환하는 것을 선호합니다.

결론

A/B 테스트에서 얻은 결과를 고려하면 표준 계획이 자홍색으로 눈에 띄는 버전이 다른 변형보다 훨씬 잘 작동한다는 결론에 도달했습니다. 따라서 당사 웹사이트에 최종 버전으로 적용하는 것이 가장 좋습니다.

A/B 테스트의 성공적인 변형을 적용하는 스크린샷
A/B 테스트의 승리한 변형을 최종으로 적용하는 스크린샷.

보시다시피, 단 한 번의 클릭으로 Nelio Content 가격 페이지의 최종 버전이 테스트에서 우승한 버전이 됩니다. 물론 처음에는 파란색 계열이 좋은 선택이라고 생각했을 수도 있지만 선호도와 취향이 매출 증대에 거의 도움이 되지 않습니다. A/B 테스트는 실제 데이터를 사용하여 실제로 작동하는 것이 무엇인지 증명하는 테스트입니다. 웹사이트에서 전환율을 높이기 위해 A/B 테스트를 생성하기 위해 무엇을 기다리고 계십니까?

Unsplash에서 Baher Kairy의 추천 이미지.