Thử đo heatmap website OneHousing bằng công cụ miễn phí Clarity và cái kết
Ú oà! Mình chỉ là một người…đoán sai 🥲
Không phải lúc nào UI/UX Designer bọn mình cũng có đủ thời gian thực hiện User Research hay Usability Testing, để kiểm thử thiết kế trước khi đưa vào triển khai. Khi có dự án ad-hoc, cần chạy gấp để đáp ứng các chương trình kinh doanh của Business và Marketing, tụi mình ở OneMount phải nhanh chóng thiết kế UI từ những components có sẵn, và giúp team Dev code nhanh nhất có thể. Nhưng không vì thế mà tụi mình bỏ quên việc đo lường sau khi go-live, để biết thực sự giải pháp thiết kế này có giải quyết nhu cầu của người dùng không? Từ đó hỗ trợ các anh chị PM, PO đưa ra quyết định để cải tiến trong các phase sau.
Thông thường, tụi mình vẫn sử dụng Google Analytics setup tracking, theo dấu toàn bộ hành vi của người dùng trên website để phát hiện các UX issues. Nhưng gần đây biết đến một cụ tracking miễn phí tên Clarity, team mình thử nghiệm thử luôn trên một dự án chạy gấp xem thế nào. Dưới đây là vài kết quả thú vị khi tụi mình đo heatmap, tỷ lệ scroll và xem recordings… của trang giới thiệu ưu đãi dự án Vinhomes Ocean Park 2.
Ú oà #1: Thông tin user cần đọc nhất lại nằm ở cuối trang
Khi xem heatmap, tụi mình thấy Section 5 — Căn đang bán dù đang ở vị trí thứ 5 trên 7 sections nhưng lại là khu vực user click nhiều nhất, chiếm Top 5 clicks của trang web. User có hành vi bấm liên tục vào các tag (chip) phân khu Cọ Xanh, Đảo Dừa, Chà Là, Hải Âu… và button Xem thêm để tải thêm danh sách căn đang bán. Dữ liệu này có thể giúp tụi mình phán đoán nhu cầu quan trọng nhất của người dùng khi vào trang này là: tìm kiếm “deal hời”.
Ú oà #2: Mình nghĩ thông tin này quan trọng, mà user làm ngơ
Tiếp tục quan sát, tụi mình thấy Section 3 — Giới thiệu dự án và Section 4 — Đăng ký tham quan, tải tài liệu dự án… dù được xếp ở trên nhưng không được tương tác nhiều. Giả định được đưa ra là: trong bối cảnh dự án Vinhomes Ocean Park 2 đã ra mắt được 1 năm và đây là thời điểm vàng để các nhà đầu tư bán lại kiếm lời, có thể người mua đã có sẵn thông tin về dự án trước khi vào website của OneHousing.
Tò mò về hành vi trên, tụi mình tìm Recordings để xem người dùng thực sự đọc và click những phần nào trên trang. Dưới đây là ảnh chụp 1 đoạn record ghi lại hành vi của người dùng vào website OneHousing, mở trang Ưu đãi và bấm “Xem tất cả” các căn đang bán ngay ở giây thứ 9.
👉 Đề xuất cải thiện
Khi kiểm tra tỷ lệ scroll của trang, tụi mình thấy user thường scroll tập trung ở section 1 đến 3 và ít cuộn xuống. Nếu những phân tích trên về nhu cầu của user là đúng, tụi mình có thể tiến hành cải tiến như sau để section hấp dẫn nhất — Căn đang bán tiếp cận được nhiều user hơn, giúp user dễ dàng tìm thấy “deal hời” hơn:
- Di chuyển section 5 — Căn đang bán lên vị trí số 3 để user không mất công cuộn xuống.
- Stick các tag (chip) phân khu Cọ Xanh, Đảo Dừa, Chà Là, Hải Âu… ở đầu trang khi user scroll xuống, để giúp user nhanh chóng bấm sang phân khu khác khi đang xem danh sách căn đang bán ở dưới.
Ú oà #3: User liên tục bấm vào đoạn text không bấm được
Giữ vị trí thứ 6 trên bảng xếp hạng Top Clicks là đoạn text Lãi suất cố định 7% trong 2 năm. Điều bất ngờ với cả team là: đây chỉ là text và đâu có bấm được 🤯
Vậy điều gì đã khiến user click nhiều đến vậy? User mong muốn điều gì khi click vào đây?
“Làm thế nào tôi vay được với mức lãi suất 7%? Khi thực tế trên thị trường chỉ vay được 8%, 9% thì 7% là một mức lãi suất quá tốt.”
Đây là insight của một bạn trong team đã từng phỏng vấn người mua dự án Vinhomes Ocean Park 2. Để thực sự biết có bao nhiêu user nghĩ vậy, tụi mình vẫn cần phải phỏng vấn thêm những người mua khác trong thời gian tới. Dù sao, phát hiện được sớm UX issues còn hơn không. Đây là điều mà bọn mình chưa phát hiện ra khi sử dụng dữ liệu tracking từ Google Analytics.
Công việc UI/UX hàng ngày của tụi mình ở OneMount không chỉ có User Research, Competitors Analysis, UI/UX Design, Usability Testing, Design QA, Design System… mà còn có Data Analysis. Trên đây chỉ là 1 casestudy rất nhỏ mà tụi mình thường xuyên theo dõi hàng ngày.
Nhân tiện đây mình xin chia sẻ một câu chuyện ngoài lề. Năm 2022, mình có dịp gặp ~ 25 bạn ứng viên Junior/ Senior Product Designer tại buổi phỏng vấn. Khi mình hỏi đến kinh nghiệm Data Analysis, phải hơn 20 bạn (> 80%) trả lời chưa có cơ hội được tiếp xúc các công cụ tracking phổ biến như Google Analytics, Hotjar, UXCamp, Smartlook…
Nếu chi phí đang là rào cản của các công ty thì Clarity là một công cụ miễn phí mình nghĩ có thể thử. Trải nghiệm nhanh sau 2 ngày, mình thấy có những ưu, nhược điểm như sau:
Ưu điểm:
- Miễn phí, dễ dàng setup theo hướng dẫn sau: https://learn.microsoft.com/en-us/clarity/setup-and-installation/getting-started
- Tiện lợi khi theo dõi heatmap, tỷ lệ scroll, recordings…
- Thống kê được page views, sessions, unique users, total clicks, dead clicks, rage clicks… theo countries, browsers, operting systems…
- Có thể lọc dữ liệu theo rất nhiều attributes (new user, user id, time, device, browser, source, medium, campaign…)
- Có thể chặn IP để lọc dữ liệu người dùng nội bộ trong công ty
- Mặc định che các thông tin cá nhân của người dùng (SĐT, Email…) trong các recordings
- Cập nhật dữ liệu real-time, ngay lập tức có thể xem recordings của người dùng đang online
- Có thể xem luôn toàn bộ chỉ số của Google Analytics
Nhược điểm:
- Mới chỉ sử dụng cho website
- Chỉ lưu trữ dữ liệu 30 ngày
- Thời gian người dùng ở trên website có thể không chính xác khi recordings bị giật
- Heatmap có thể không chính xác khi trang web có nhiều data động và thời gian loading lâu
- Khó xem heatmap khi trang web có nhiều modal bật đè lên
Hy vọng đánh giá nhanh trên đây của mình hữu ích với các bạn đang chưa biết phải đo lường hiệu quả thiết kế của mình thế nào, chưa có cơ hội sử dụng các công cụ tracking khi thiết kế UI/UX.
