Khi người dùng bỏ trang trước khi bắt đầu bài test, vấn đề không nằm ở IQ của họ — mà nằm ở thiết kế.
Vai trò:
UI/UX Designer
Phạm vi:
Phân tích đối thủ, Thiết kế UI, Prototyping
Thời gian:
2025
Khách hàng:
IQ Myth là sản phẩm được xây dựng từ đầu — không có thiết kế cũ để kế thừa, không có design system sẵn có. Nhiệm vụ của tôi là tạo ra toàn bộ trải nghiệm người dùng từ trang chủ đến màn hình kết quả, với nghiên cứu đối thủ làm la bàn định hướng.
Trước khi vẽ bất kỳ màn hình nào, tôi dành thời gian phân tích MyIQ — đối thủ lớn nhất trong thị trường web IQ test. Câu hỏi không phải là "họ làm gì", mà là "họ đang để lại khoảng trống nào cho IQ Myth bước vào?"
Khoảng trống tìm được
Dù MyIQ có nút CTA "Start Test" rõ ràng ở hero section, toàn bộ phần còn lại của trang nhồi nhét đồng thời testimonial, pricing, feature list, FAQ và social proof — không có visual hierarchy, không có luồng dẫn dắt. Người dùng bị phân tán trước khi kịp bắt đầu bài test.
Câu hỏi thiết kế cốt lõi
Sản phẩm
Điểm mạnh
Điểm yếu
MyIQ (đối thủ)
CTA nổi bật ở hero, có social proof, pricing rõ
Layout rối, quá nhiều thông tin cùng lúc, không tạo được focus.
IQ Myth (Mục tiêu)
Tối giản, one-task-per-screen, dẫn dắt mượt
Cần xây từ đầu — không có gì để kế thừa
3 Insight chính rút ra:
01.
Người dùng chỉ có 1 mục tiêu
Khi vào trang IQ test, họ chỉ muốn biết IQ của mình. Mọi thông tin khác hiển thị trước khi làm bài đều là nhiễu — dù đó là pricing hay testimonial.
02.
Friction lớn nhất không ở bài test
Điểm rơi rớt nhiều nhất là bước thu thập email và chọn gói cước ngay sau khi hoàn thành. Đây là nơi cần đầu tư thiết kế nhiều nhất.
03.
Cảm giác "thông minh" phải được thiết kế
Giao diện rối rắm mâu thuẫn với mục đích sản phẩm. IQ Myth cần một UI khiến người dùng cảm thấy họ đang làm điều gì đó tinh tế, khoa học và xứng đáng.
Với một sản phẩm xây từ số không, design system không phải việc làm sau — mà là việc làm đầu tiên. Nó đảm bảo mọi quyết định thị giác sau này đều có nền tảng và nhất quán.
1 .User Flow
Luồng được thiết kế để đưa người dùng từ trang đích đến bài kiểm tra trong ít hơn 2 bước
Color System
Xanh lá neon (#B9FF06) được dùng làm điểm nhấn (accent) và hình minh họa để tạo cảm giác đột phá. Trong khi đó, Xanh lá đậm (#013613) được dùng cho các nút CTA và background để đảm bảo độ tương phản, tính tiếp cận (accessibility) và sự vững chãi.
#B9FF06
Primary / Accent
Illustrations, Highlight text
#013613
Secondary / Action
Nút CTA, Background Footer
#D8502D
Danger
Cảnh báo, pop-up FOMO
#F4F7F5
Surface
Card bg, Input bg
Typography
Bricolage Grotesque được lựa chọn bởi đường nét sắc bén, tự tin nhưng không hề khô khan — sự dung hòa hoàn hảo cho một sản phẩm mang tính khoa học nhưng vẫn cần giao tiếp gần gũi với đại chúng.
Heading 1 / Bold / 64px
Only the 1%
Heading 2 / Semi-Bold / 32px
Analyze your results
Body Text / Regular / 16px
A single font throughout the system reduces cognitive load and maintains consistency.
Thay vì giới thiệu sản phẩm, hero đặt ngay một thách thức: "Only the Smartest 1% Can Beat This Test. Can You?" Kích thích tâm lý muốn chứng minh bản thân. Thiết kế duy nhất một headline, một CTA, tối đa khoảng trắng. Không có gì cạnh tranh sự chú ý.
Màn hình bài test — Trạng thái Flow
Mỗi câu hỏi chiếm toàn bộ màn hình. Không sidebar, không navigation. Người dùng được dẫn vào trạng thái tập trung hoàn toàn thay vì bị nhắc nhở rằng họ đang trên một trang web có pricing phía dưới.
Thu thập Email — Labor Illusion & FOMO
Sau test, tôi áp dụng 2 kỹ thuật tâm lý: Labor Illusion (Animation AI đang phân tích tạo giá trị kết quả) và FOMO (Cảnh báo kết quả hết hạn). Ngay sau đó là Social Proof để chốt niềm tin trước khi nhập email.
Mobile-first & Leaderboard
Hơn 70% người dùng thực hiện bài test trên điện thoại. Tôi đã tối ưu lại Layout dọc để đảm bảo tính dễ đọc. Phần Leaderboard được thiết kế gọn gàng, tạo động lực cạnh tranh mà không gây cảm giác chật chội trên màn hình nhỏ.
Custom Illustrations — Giảm áp lực, tăng gắn kết
Thay vì dùng ảnh stock khô khan, IQ Myth sử dụng một bộ hình minh họa vẽ tay độc quyền với tone màu Xanh Neon / Trắng đen. Các bài test IQ thường mang lại cảm giác áp lực và nặng nề. Những hình minh họa vui nhộn (như biểu đồ tăng trưởng, não bộ cách điệu) giúp phá vỡ sự căng thẳng đó, làm cho trải nghiệm trở nên thân thiện và mang tính giải trí (Gamification) hơn rất nhiều.
Vấn đề: Choice Overload
Giải pháp: Hick's Law
Thay vì trình bày tất cả các gói ngang hàng nhau, tập trung highlight duy nhất Base Plan $0.99 như một entry point có rào cản tâm lý thấp nhất, kết hợp thanh toán một chạm.
Bản mới
Thiết kế mới kỳ vọng giảm tỷ lệ drop-off tại bước thanh toán nhờ giảm số lựa chọn từ 3 gói xuống 1 gói được highlight, kết hợp entry price thấp hơn 90%
Kết luận & Bài học
Menu