Học được gì từ 7 ví dụ A/B Test thực tế

Posted by

Ở lĩnh vực công nghệ với tốc độ phát triển “chóng mặt”, không có một quy luật, giả thuyết nào là hoàn toàn đúng và có thể áp dụng trong mọi trường hợp. Mọi thay đổi và giả thuyết về sản phẩm hoặc khách hàng nên được thử và kiểm chứng trước khi chính thức đi vào áp dụng. Thực hiện A/B Test chính là một trong những phương pháp giúp chúng ta thực hiện quá trình kiểm chứng ấy.

A/B Testing, hiểu một cách đơn giản, là so sánh 2 phiên bản của thứ gì đó để xem cái nào hiệu quả hơn. “Thứ gì đó” ở đây có thể là trang web, app, email, quảng cáo trên Facebook, v.v. 2 phiên bản A và B trong A/B Testing thường chỉ khác nhau ở một yếu tố duy nhất mà người test muốn cải thiện, được gọi chung là biến. 

Lý thuyết và quy trình thực hiện A/B Testing có thể dễ dàng tìm thấy ở nhiều nguồn, tuy nhiên ví dụ thực tế thì lại không nhiều. Trong bài viết hôm nay, Careerly gửi đến cho bạn 7 kết quả A/B test được thực hiện bởi những công ty công nghệ hàng đầu thế giới như Amazon, Google, Airbnb, kèm một vài phân tích kết quả ngắn. Hy vọng sau khi đọc bài viết này, team của bạn sẽ có thêm động lực tiến hành kiểm chứng thay đổi bằng A/B test nếu vẫn còn chưa thực hiện phương pháp này trước đây.

Amazon: A/B test layout của website – Full width screen vs Fixed width screen.

Thử nghiệm:

  • Biến thể A, chiều rộng của cột nội dung chính trang web sẽ được trình bày theo chiều rộng của màn hình người dùng (full width).
  • Biến thể B, chiều rộng của cột nội dung chính được cố định (fixed width) ở mức tối đa là 1500 pixels.
kết quả A/B test về chiều rộng màn hình của Amazon

Kết quả: Amazon đã chọn biến thể B. 

Phân tích: Thực ra, đây là kết quả khá giống với nhiều kết quả A/B test của các dịch vụ/nền tảng online khác. Hiện nay màn hình của người dùng đã được cải thiện nhiều về độ lớn và độ phân giải vì vậy nhiều trang web lựa chọn cách trình bày full width. Tuy nhiên, theo các kết quả AB test thực tế, việc giới hạn chiều rộng và để padding cho layout lại khiến việc theo dõi nội dung tiện lợi và dễ dàng hơn. Với phiên bản full width, nội dung dàn trải quá rộng từ trái sang phải, gây khó khăn cho việc nắm bắt thông tin của người đọc. 

Amazon: A/B test giao diện menu – Dropdown vs “Hamburger” 

Thử nghiệm:

  • Biến thể A: các category nằm trong label “Department” được trình bày theo dạng dropdown menu.
  • Biến thể B: phần menu này được chuyển đổi thành dạng “hamburger menu” phần label mang tên “department” được thay thế bằng một biểu tượng. Ngoài ra, thí nghiệm này không chỉ dừng lại ở chỗ việc thay đổi cách trình bày menu bar mà Amazon còn gắn thêm thông điệp kêu gọi sign-in ở ngay option đầu tiên sau khi người dùng nhấn vào biểu tượng hình hamburger.

Kết quả: Biến thể B với hamburger menu được chọn.

Phân tích: Trên thực tế kết quả của bài test này sẽ khác nhau tùy theo tính chất của sản phẩm/dịch vụ (đây là lí do bạn không nên sao chép các ông lớn một cách mù quáng). Với những trang web có lượng người dùng hầu hết là những người lần đầu truy cập thì menu được trình bày theo hình thức dropdown sẽ mang tính trực quan hơn. Tuy nhiên Amazon là trang web có lượng người dùng đã có kinh nghiệm sử dụng web nhiều lần, nên việc trình bày menu dưới dạng hamburger sẽ giúp rút gọn menu so với cách truyền thống, đỡ rối mắt cho người dùng. 

Netflix: A/B test nội dung nút CTA (call to action) trên landing page: 

Thử nghiệm: Đây là một trong những thí nghiệm A/B test rất phổ biến. Trong thí nghiệm này, Netflix đơn giản chỉ thay đổi nội dung trong nút CTA.

  • Biến thể A: “Watch free for 30 days” (Trải nghiệm miễn phí trong 30 ngày) 
  • Biến thể B: “Try it now” (Hãy trải nghiệm ngay).

Kết quả: Biến thể B với nội dung “Try it now” được chọn. 

Phân tích: Trong thử nghiệm này, từng đặc điểm của mỗi sản phẩm mà sẽ cho ra kết quả khác nhau. Ở trường hợp của Netflix, nội dung CTA “Watch free for 30 days” có thể khiến cho người dùng thấy được tương lai phải trả tiền cho dịch vụ sau 30 ngày dùng miễn phí, từ đó khiến họ ngần ngại click thực hiện hành động hơn. 

Google: A/B test giao diện các hạng mục của bộ lọc tìm kiếm:

Thử nghiệm: Trên thanh menu của bộ lọc kết quả tìm kiếm, Google đã thực hiện A/B test với:

  • Biến thể A: chỉ thể hiện tên các bộ lọc trên thanh menu, chỉ đặt icon trên thanh tìm kiếm chính.
  • Biến thể B: chèn thêm icon bên cạnh tên của các bộ lọc, icon trên thanh tìm kiếm chính giữ nguyên.

Kết quả: Sau một tháng chạy thử nghiệm, Google đã chọn biến thể B, thay đổi phần nhìn trên trang tìm kiếm của mình. 

Phân tích: Biến thể B đã mang lại hiệu quả trực quan hơn, giúp thay đổi thói quen của người dùng, mang lại hiệu quả hơn nhiều với biến thể A. Qua bài học từ Google, khi thiết kế sản phẩm ngoài phần text quan trọng, chúng ta cũng nên bổ sung icon khi trình bày để đạt hiệu quả tốt hơn. 

Airbnb: A/B test cách trình bày timeline hoàn tiền khi hủy phòng: 

Thử nghiệm: Airbnb thực hiện A/B test với:

  • Biến thể A: trình bày 2 dòng text về thời gian được hủy phòng miễn phí, và thời gian được hoàn tiền 50% khi hủy phòng.
  • Biến thể B: thêm phần graphic thể hiện rõ ràng timeline về phần trăm số tiền khách được refund khi hủy phòng. AirBnb hi vọng với graphic này khách hàng sẽ dễ dàng theo dõi timeline về tiền được refund.

Kết quả: Thử nghiệm này lại cho ra một kết quả rất bất ngờ. Việc timeline được trình bày rõ ràng trong biến thể B lại đem đến hiệu quả ngược và Airbnb lại quay về với cách trình bày truyền thống, chỉ có text.

Phân tích: Từ kết quả thử nghiệm này, chúng ta có thể rút ra rằng, không phải lúc nào việc cho khách hàng nhìn rõ mọi thông tin đều tốt, đặc biệt là những dạng thông tin khiến khách hàng cảm thấy bất lợi như tiền phạt họ phải chịu hoặc những giới hạn trong dịch vụ. 

Airbnb: A/B test vị trí đặt nút

Thử nghiệm:

  • Biến thể A: Airbnb đã đặt nút engagement hình trái tim (like, wish list, favorite) trực tiếp trên ảnh của phòng.
  • Biến thể B: Họ tách nút này ra phần rìa phải trên cùng, ngay bên cạnh phần biểu thị tên phòng. 
kết quả A/B test của B

Kết quả: Nút engagement nằm riêng sẽ mang lại hiệu quả hơn. 

Phân tích: Thông qua thử nghiệm này có thể thấy rằng, việc đặt tách riêng các yếu tố có mục đích khác nhau giúp người dùng dễ chú ý hơn, khuyến khích họ thực hiện hoạt động tương tác hiệu quả hơn. Ngoài ra, khi có nhiều yếu tố quan trọng cần trình bày trên giao diện, chúng ta nên sắp xếp chúng theo thứ tự quan trọng để bố trí cho phù hợp.

Booking.com: A/B test giao diện cửa sổ modal (modal window): 

Thử nghiệm: Booking.com thường thích bố trí popups, overlays và nudges nhiều hình dạng và kích thước để “nhắc nhở” người dùng của mình. Trong A/B test này:

  • Biến thể A: giao diện web truyền thống của Booking.com, bố trí menu chọn ngày giờ phía bên trái màn hình, khi người dùng điền đầy đủ các thông tin, trang web sẽ di chuyển.
  • Biến thể B: Booking.com đã chuyển một phần các thông tin cần điền vào cửa sổ modal bên phải.
kết quả A/B test của Booking.com

Kết quả: Ý đồ của Booking.com không thành công, cách trình bày như cũ vẫn mang lại hiệu quả hơn. 

Phân tích: Trong thí nghiệm A/B test của Booking.com khi thêm một cửa sổ modal trên 1 trang web như vậy có thể khiến người dùng bị rối mắt, ngoài ra việc trải dài thông tin từ trái sang phải còn làm phức tạp hóa gaze path (hành trình của mắt).

Lời kết:

Thông qua các ví dụ trên, có thể thấy rằng, một số kết quả A/B test mang lại hiệu quả đúng với mong đợi ban đầu của team nhưng cũng có một số kết quả đi ngược lại hoàn toàn, do đó không có gì đảm bảo chắc chắn những gì chúng ta suy nghĩ hoặc những “quy luật” mà chúng ta định ra đã là đúng, chỉ có người dùng/khách hàng mới mang lại đáp án chính xác nhất cho các thử nghiệm. Vì vậy khi thử nghiệm một thay đổi mới cho sản phẩm của bạn, đừng chủ quan loại bỏ đi bất cứ phương án nào chỉ vì nó “không hợp với lẽ thông thường”. 

Ví dụ trong bài được lấy từ Leaks A/B testing được chia sẻ trên GoodUI.org. Bạn có thể tìm thêm những kết quả A/B testing thực tế tương tự trên trang web này.

2 comments

Để lại bình luận