Mỗi ngành nghề đều có một loạt những “niềm tin xác sống” — những ý tưởng từng có lý, được nhắc đi nhắc lại trong đủ cuộc họp, rồi dần trở thành chân lý bất di bất dịch. UI/UX cũng không ngoại lệ. Những quan niệm này bám dai dẳng chẳng khác gì bụi vải bám trên áo hoodie.
Ở một thời điểm nào đó, một nhận định khá hợp lý về các website báo chí của thập niên 1990 đã bị biến thành một “quy luật” bất khả xâm phạm của vũ trụ. Và giờ đây, các designer phải dành không ít thời gian để giải thích tại sao “quy tắc” mà khách hàng đọc được trên LinkedIn lại không hề phù hợp với dự án hiện tại.
Dưới đây là 10 lầm tưởng cứng đầu nhất trong thiết kế giao diện — những quan niệm tồn tại không chỉ trong các team thiết kế mà còn xuất hiện rất nhiều trong brief của khách hàng, nhận xét của stakeholder và những ý kiến đầy tự tin ngoài hành lang. Hãy xem đây như một cẩm nang “giải mã lầm tưởng” dành cho bất kỳ ai đã quá mệt mỏi với việc phải tranh luận lại cùng một vấn đề trong mỗi buổi kickoff.
Thực tế: các lựa chọn về hình ảnh thực chất là những quyết định về chức năng được khoác lên một lớp thẩm mỹ. Màu sắc có thể tạo dựng niềm tin trước cả khi người dùng đọc một từ nào. Khoảng cách tạo nên phân cấp thị giác, định hướng chính xác nơi mắt người dùng nên nhìn tiếp theo. Typography quyết định liệu nội dung có thực sự được đọc hay không trong điều kiện sử dụng thực tế — mắt mỏi, màn hình nhỏ hoặc ánh sáng không tốt.
Hãy thử hình dung quy trình đăng ký tài khoản của một ứng dụng ngân hàng. Khách hàng có thể yêu cầu một giao diện “đẹp và hiện đại”, và họ thực sự nhận được một màn hình rất đẹp với 15 trường thông tin, không có kiểm tra mật khẩu theo thời gian thực và nút “Tiếp theo” bị bàn phím che mất trên điện thoại. Kết quả là tỷ lệ chuyển đổi vẫn giảm.
UX thành công khi người dùng đạt được mục tiêu mà không gặp trở ngại. Lớp giao diện trực quan tồn tại để dẫn dắt sự chú ý, chứ không phải để che giấu một quy trình vốn đã có vấn đề bên dưới.
Sự khác biệt giữa giao diện mang tính trang trí và giao diện mang tính chức năng
Ví dụ, khi một thương hiệu thương mại điện tử lớn thiết kế lại quy trình thanh toán, giải pháp cuối cùng không bao giờ xuất hiện hoàn chỉnh ngay từ đầu. Nó hình thành sau nhiều tuần phân tích dữ liệu người dùng rời bỏ ở từng bước, phác thảo hàng chục wireframe độ trung thực thấp và thực hiện nhiều vòng kiểm thử khả năng sử dụng — trong đó phần lớn các wireframe ban đầu bị loại bỏ.
Những đột phá đến từ quá trình lặp lại và cải tiến, chứ không phải từ cảm hứng. Thiết kế sản phẩm thực tế gần với kỹ thuật hơn là mỹ thuật, cho dù website portfolio đôi khi cố khiến mọi thứ trông ngược lại.
Trên thực tế, điện thoại đại diện cho một bối cảnh sử dụng hoàn toàn khác, chứ không đơn giản là một màn hình nhỏ hơn. Người dùng desktop thường ngồi tại bàn, sử dụng chuột và có thể tập trung phần lớn sự chú ý. Người dùng mobile có thể đang đứng trên sân ga, gõ bằng một tay và liên tục bị phân tâm bởi môi trường xung quanh.
Nguyên tắc mobile-first của Luke Wroblewski đã thay đổi hoàn toàn quy trình thiết kế: bắt đầu từ màn hình nhỏ nhất và khắt khe nhất, sau đó mở rộng dần lên.
Các giới hạn đóng vai trò như một bộ lọc chứ không phải trở ngại. Nếu một tính năng không thể hoạt động tốt trên màn hình điện thoại, có lẽ ngay từ đầu nó đã không thực sự cần thiết.
Instagram ra mắt với mô hình chỉ dành cho mobile vào năm 2010 và duy trì như vậy trong 11 năm, mãi đến năm 2021 mới có trải nghiệm desktop đầy đủ. Việc bắt đầu từ màn hình nhỏ đã giúp sản phẩm tập trung hơn vào mục tiêu, thay vì đơn giản chỉ thu nhỏ mọi thứ lại.
Sự khác biệt giữa bố cục mobile và desktop
Hướng dẫn ban đầu đề cập đến độ sâu của hệ thống điều hướng, chứ không phải số lần click. Đây là một khác biệt nhỏ nhưng quan trọng, sau đó đã bị đơn giản hóa thành một con số tùy ý.
Điều thực sự khiến người dùng mất kiên nhẫn là sự không chắc chắn, chứ không phải số lần click. Một quy trình thanh toán gồm 5 bước nhưng có chỉ báo tiến trình rõ ràng có thể tạo cảm giác nhanh hơn một biểu mẫu chỉ có 2 bước nhưng khiến người dùng không biết liệu thao tác vừa thực hiện có thành công hay chưa.
Các team chạy theo “quy tắc 3 click” thường cố nhồi nhét mọi thứ vào một nơi: đưa quá nhiều quyết định lên cùng một màn hình, ẩn các trường thông tin trong những nút thu gọn hoặc ép một quy trình nhiều bước thành một trang duy nhất đầy đặc.
Số lần click giảm xuống nhưng sự bối rối vẫn còn nguyên.
Một quy trình dài hơn nhưng có các bước rõ ràng, nhịp độ hợp lý thường mang lại trải nghiệm tốt hơn một quy trình ngắn nhưng đầy những điểm khiến người dùng phải đoán. Sự rõ ràng mới là yếu tố quan trọng trong khả năng sử dụng.
Và thế là tất cả cùng thêm vào.
Designer nào đề xuất cắt bớt một tính năng rất dễ bị xem là người “khó tính”.
Đó chính là lúc feature creep xuất hiện: một sản phẩm ban đầu có một giá trị cốt lõi rõ ràng, sau đó liên tục hấp thụ “chỉ thêm một thứ quan trọng nữa” từ từng bộ phận cho đến khi giao diện trông chẳng khác gì buồng lái máy bay được thiết kế bởi cả một hội đồng.
Đến giữa những năm 2000, Microsoft Word đã giấu quá nhiều tính năng bên trong các menu lồng nhau. Nghiên cứu của chính Microsoft cho thấy người dùng đôi khi phát hiện các công cụ quen thuộc một cách tình cờ. Điều này góp phần dẫn đến thiết kế Ribbon — một hệ thống điều hướng hoàn toàn mới được xây dựng để giải quyết sự quá tải đó.
Google Docs ra mắt trong cùng thời kỳ với số lượng tính năng ít hơn rất nhiều: nhập văn bản, định dạng và chia sẻ theo thời gian thực. Tuy nhiên, nó vẫn thu hút một lượng người dùng khổng lồ vì không có quá nhiều thứ đứng giữa người dùng và công việc họ cần hoàn thành.
Thiết kế sản phẩm thường đòi hỏi sự tiết chế nhiều hơn là tham vọng.
MS Word và Google Docs: sự khác biệt trong bố cục
Nhưng thực tế không phải vậy.
Người dùng thường quét nội dung.
Nielsen Norman Group đã xác định hành vi này từ năm 1997: mắt thường đọc khá đầy đủ dòng đầu tiên, lướt nhanh dòng thứ hai rồi di chuyển xuống dọc theo phía bên trái của trang. Đây chính là mô hình F nổi tiếng.
Các nghiên cứu eye-tracking hiện đại tiếp tục xác nhận xu hướng này. Nếu thiết kế giao diện với giả định rằng người dùng sẽ đọc tuyến tính, những thông tin quan trọng có thể bị chôn giữa đoạn văn và các CTA lại xuất hiện sau ba câu mà chẳng mấy ai đọc hết.
Các công ty tài chính và bảo hiểm từng dành nhiều năm giấu phí dịch vụ trong những file PDF dày đặc thuật ngữ, về mặt lý thuyết vẫn cho người dùng “cơ hội đọc”. Nhưng thực tế gần như chẳng ai làm vậy.
Khi các cơ quan quản lý EU yêu cầu sử dụng Key Information Document dạng một trang, dễ quét và dễ tiếp cận hơn, khả năng hiểu thông tin đã được cải thiện đáng kể.
Nội dung trên giao diện nên xác nhận điều người dùng đang nghi ngờ hoặc trả lời một câu hỏi cụ thể. Những phần vượt quá nhu cầu đó rất dễ trở thành nhiễu thông tin.
Ví dụ về heatmap mô hình F
Animation thường bị xem như một lớp trang trí, chỉ được thêm vào sau khi phần “thực sự quan trọng” đã hoàn thành.
Cách nhìn này bỏ qua vai trò quan trọng nhất của motion: giao tiếp.
Một chuyển động được thiết kế tốt có thể trả lời ngay lập tức những câu hỏi vô thức của người dùng: Điều gì vừa xảy ra? Thành phần này đã đi đâu? Hệ thống đang tải hay bị đứng?
Nếu bỏ qua animation và transition, các thay đổi trong giao diện sẽ trở nên đột ngột, khiến não bộ không có đủ thời gian để hình thành một mô hình không gian về giao diện.
Hãy thử hình dung thao tác nhấn nút trái tim trên một bài đăng mạng xã hội. Biểu tượng phóng to nhẹ, tạo hiệu ứng nhịp đập rồi trở về vị trí ban đầu. Nếu bỏ chuyển động đó đi, thao tác vẫn được ghi nhận về mặt kỹ thuật, nhưng trải nghiệm sẽ có cảm giác không hoàn chỉnh. Trong một khoảnh khắc ngắn, người dùng không nhận được tín hiệu trực quan đủ rõ rằng thao tác của họ đã được thực hiện.
Motion vẫn cần được sử dụng có tiết chế. Animation chỉ để trang trí có thể tạo thêm ma sát, đặc biệt với những người nhạy cảm với chuyển động hoặc không muốn phải chờ đợi những hiệu ứng không cần thiết.
Một tùy chọn “giảm chuyển động” vì thế được xem là một tính năng accessibility quan trọng. Animation tốt phải có lý do để tồn tại, truyền đạt chính xác điều cần thiết và nhường chỗ cho những người không muốn nhìn thấy chuyển động.
“Above the fold” dùng để mô tả nửa trên của một tờ báo được nhìn thấy khi tờ báo được trưng bày trên sạp. Đây là phần mà người đi đường nhìn thấy trước khi quyết định mua báo.
Các designer web thời kỳ đầu trong thập niên 1990 đã gần như bê nguyên khái niệm này lên môi trường số, vì lo rằng người dùng sẽ không biết phải cuộn xuống dưới.
Nhưng hành vi trên môi trường số lại cho thấy một bức tranh khác — dù không đơn giản đến mức “scroll là giải quyết được mọi thứ”.
Scrolling là một thao tác tự nhiên và gần như tự động, khác với việc mở một tờ báo bị gấp. Người dùng cuộn liên tục, thường thậm chí không cần suy nghĩ.
Tuy nhiên, sự chú ý vẫn tập trung nhiều hơn ở phần đầu trang. Nghiên cứu eye-tracking của Nielsen Norman Group cho thấy người dùng dành khoảng 57% thời gian xem trang ở khu vực phía trên nếp gấp và 74% trong hai màn hình nội dung đầu tiên.
So với năm 2010, khi khoảng 80% sự chú ý tập trung phía trên nếp gấp, khoảng cách đã thu hẹp nhưng xu hướng vẫn còn. Phần đầu trang vẫn đảm nhiệm phần lớn công việc quan trọng; chỉ là nó không còn phải gánh tất cả mọi thứ.
Điều đó có nghĩa vấn đề thực sự chưa bao giờ là “người dùng có cuộn hay không”.
Mà là: “Họ có muốn cuộn tiếp hay không?”
Các trang marketing của Apple là một ví dụ điển hình. Một trang sản phẩm có thể kéo dài hàng chục màn hình nhưng mỗi phần đều tạo ra lý do để người dùng tiếp tục khám phá — mỗi lần cuộn mang đến một ý tưởng, một nhịp điệu thị giác và một chi tiết mới xuất hiện đúng lúc.
Thay vì đổ toàn bộ thông số lên một bức tường nội dung, trang web khuyến khích sự tò mò.
Độ dài có thể trở thành một công cụ kể chuyện khi mỗi phần đều đóng góp giá trị riêng. Bởi vấn đề chưa bao giờ thực sự là scrolling. Vấn đề là không cho người dùng bất kỳ lý do nào để tiếp tục.
Màn hình đầu tiên chỉ cần khiến người dùng muốn cuộn tiếp, chứ không cần phải chứa toàn bộ thông điệp ngay lập tức.
Animation dựa trên thao tác cuộn của Apple
Product designer bị xem như những “thợ sửa chữa khẩn cấp”, được kỳ vọng đảo ngược xu hướng đi xuống bằng những nút bấm nổi bật hơn và một màn hình onboarding mượt mà hơn.
Nhưng thực tế là thiết kế có thể khuếch đại giá trị, chứ không thể tự tạo ra giá trị từ con số 0.
Hãy tưởng tượng một ứng dụng giao hàng quốc tế thường xuyên tính sai phí hải quan và làm mất dữ liệu hóa đơn. Bạn có thể thuê designer UX giỏi nhất, xây dựng một giao diện tối giản tuyệt đẹp với các vùng chạm hoàn hảo và animation mượt mà.
Nhưng hệ thống logistics bên dưới vẫn tiếp tục gặp lỗi, và người dùng vẫn sẽ xóa ứng dụng.
Một bản redesign bóng bẩy trên nền một sản phẩm cốt lõi đang hỏng chỉ khiến “con tàu đang chìm” trông đẹp hơn trên đường chìm xuống.
Sai lầm nằm ở việc xem white space như phần diện tích trống còn thừa, thay vì một công cụ cấu trúc chủ động.
Bố cục quá chật buộc não phải làm việc nhiều hơn để hiểu hệ thống phân cấp — nhãn này thuộc về trường thông tin nào, nút nào quan trọng nhất, tiếp theo nên nhìn vào đâu.
Nghiên cứu về khả năng sử dụng cho thấy việc tăng line-height, độ thụt đầu dòng và khoảng cách giữa các khối nội dung có thể giúp hoàn thành biểu mẫu nhanh hơn và giảm đáng kể lỗi của người dùng.
Sự cải thiện này đến từ việc giảm tải nhận thức trong quá trình xử lý thông tin, chứ không phải đơn giản vì giao diện trông “sang” hơn.
White space là một thành phần được bố trí có chủ đích, được lựa chọn một cách có tính toán, chứ không phải phần diện tích còn lại sau khi designer không biết thêm gì vào nữa.
Không có lầm tưởng nào ban đầu hoàn toàn vô lý. Mỗi quan niệm đều từng có lý do để tồn tại trong một hoàn cảnh cụ thể, với những giới hạn nhất định, trên một thiết bị hoặc trong một thời kỳ nhất định.
“Above the fold” từng hợp lý với báo giấy.
Quy tắc 3 lần click từng có ý nghĩa khi nói về độ sâu của hệ thống điều hướng.
Desktop-first từng hợp lý trước khi smartphone xuất hiện và trở thành thiết bị phổ biến.
Vấn đề bắt đầu khi một ý tưởng từng phù hợp với thời đại tiếp tục tồn tại lâu hơn hoàn cảnh đã tạo ra nó, rồi dần bị đối xử như một quy luật vĩnh viễn.
Một khi một niềm tin không còn được kiểm chứng, nó trở thành hành vi mặc định — không bị đặt câu hỏi và có thể gây ra chi phí lớn. Nó tiếp tục định hình hàng triệu tương tác của người dùng mà không ai thực sự chủ động quyết định rằng nó nên tồn tại.
Thiết kế giao diện tốt đòi hỏi chúng ta phải liên tục kiểm tra những giả định này bằng hành vi thực tế của người dùng, dữ liệu thực tế và chính thiết bị mà họ đang cầm trên tay — thay vì dựa vào một quy tắc mà ai đó từng nhắc lại trong một cuộc họp từ năm 2011.
Ở một thời điểm nào đó, một nhận định khá hợp lý về các website báo chí của thập niên 1990 đã bị biến thành một “quy luật” bất khả xâm phạm của vũ trụ. Và giờ đây, các designer phải dành không ít thời gian để giải thích tại sao “quy tắc” mà khách hàng đọc được trên LinkedIn lại không hề phù hợp với dự án hiện tại.
Dưới đây là 10 lầm tưởng cứng đầu nhất trong thiết kế giao diện — những quan niệm tồn tại không chỉ trong các team thiết kế mà còn xuất hiện rất nhiều trong brief của khách hàng, nhận xét của stakeholder và những ý kiến đầy tự tin ngoài hành lang. Hãy xem đây như một cẩm nang “giải mã lầm tưởng” dành cho bất kỳ ai đã quá mệt mỏi với việc phải tranh luận lại cùng một vấn đề trong mỗi buổi kickoff.
1. Thiết kế chỉ là trang trí
Giả định phổ biến: designer chọn một bảng màu hợp xu hướng, ghép một cặp font đẹp mắt, thêm chút gradient rồi hoàn thành. Cứ thế đưa sản phẩm đi.Thực tế: các lựa chọn về hình ảnh thực chất là những quyết định về chức năng được khoác lên một lớp thẩm mỹ. Màu sắc có thể tạo dựng niềm tin trước cả khi người dùng đọc một từ nào. Khoảng cách tạo nên phân cấp thị giác, định hướng chính xác nơi mắt người dùng nên nhìn tiếp theo. Typography quyết định liệu nội dung có thực sự được đọc hay không trong điều kiện sử dụng thực tế — mắt mỏi, màn hình nhỏ hoặc ánh sáng không tốt.
Hãy thử hình dung quy trình đăng ký tài khoản của một ứng dụng ngân hàng. Khách hàng có thể yêu cầu một giao diện “đẹp và hiện đại”, và họ thực sự nhận được một màn hình rất đẹp với 15 trường thông tin, không có kiểm tra mật khẩu theo thời gian thực và nút “Tiếp theo” bị bàn phím che mất trên điện thoại. Kết quả là tỷ lệ chuyển đổi vẫn giảm.
UX thành công khi người dùng đạt được mục tiêu mà không gặp trở ngại. Lớp giao diện trực quan tồn tại để dẫn dắt sự chú ý, chứ không phải để che giấu một quy trình vốn đã có vấn đề bên dưới.
Sự khác biệt giữa giao diện mang tính trang trí và giao diện mang tính chức năng
2. Thiết kế dựa vào cảm hứng bất chợt
Lầm tưởng này cho rằng designer chỉ cần ngồi chờ cảm hứng xuất hiện, rồi bất chợt nảy ra một ý tưởng tuyệt vời và hoàn thiện concept chỉ trong một lần. Giống hệt những cảnh dựng nhanh trong phim.Ví dụ, khi một thương hiệu thương mại điện tử lớn thiết kế lại quy trình thanh toán, giải pháp cuối cùng không bao giờ xuất hiện hoàn chỉnh ngay từ đầu. Nó hình thành sau nhiều tuần phân tích dữ liệu người dùng rời bỏ ở từng bước, phác thảo hàng chục wireframe độ trung thực thấp và thực hiện nhiều vòng kiểm thử khả năng sử dụng — trong đó phần lớn các wireframe ban đầu bị loại bỏ.
Những đột phá đến từ quá trình lặp lại và cải tiến, chứ không phải từ cảm hứng. Thiết kế sản phẩm thực tế gần với kỹ thuật hơn là mỹ thuật, cho dù website portfolio đôi khi cố khiến mọi thứ trông ngược lại.
3. Mobile chỉ là phiên bản desktop thu nhỏ
Trong lịch sử, desktop xuất hiện trước nên mobile thường bị xem như một phiên bản tiếp theo được thu nhỏ lại — giữ nguyên nội dung, chỉ thay bằng một khung hiển thị nhỏ hơn. Cách suy nghĩ này rất tiện lợi. Nhưng nó không đúng.Trên thực tế, điện thoại đại diện cho một bối cảnh sử dụng hoàn toàn khác, chứ không đơn giản là một màn hình nhỏ hơn. Người dùng desktop thường ngồi tại bàn, sử dụng chuột và có thể tập trung phần lớn sự chú ý. Người dùng mobile có thể đang đứng trên sân ga, gõ bằng một tay và liên tục bị phân tâm bởi môi trường xung quanh.
Nguyên tắc mobile-first của Luke Wroblewski đã thay đổi hoàn toàn quy trình thiết kế: bắt đầu từ màn hình nhỏ nhất và khắt khe nhất, sau đó mở rộng dần lên.
Các giới hạn đóng vai trò như một bộ lọc chứ không phải trở ngại. Nếu một tính năng không thể hoạt động tốt trên màn hình điện thoại, có lẽ ngay từ đầu nó đã không thực sự cần thiết.
Instagram ra mắt với mô hình chỉ dành cho mobile vào năm 2010 và duy trì như vậy trong 11 năm, mãi đến năm 2021 mới có trải nghiệm desktop đầy đủ. Việc bắt đầu từ màn hình nhỏ đã giúp sản phẩm tập trung hơn vào mục tiêu, thay vì đơn giản chỉ thu nhỏ mọi thứ lại.
Sự khác biệt giữa bố cục mobile và desktop
4. Quy tắc 3 lần click
Trong các cuộc họp với khách hàng, quy tắc này thường được nhắc đến với sự chắc chắn gần như tuyệt đối: nếu người dùng không thể tìm thấy thứ họ muốn trong vòng 3 lần click, họ sẽ rời khỏi website. Nó được đối xử như một định luật khoa học về hành vi người dùng. Nhưng thực tế, đây là một cách diễn giải sai từ những hướng dẫn có từ thập niên 1990.Hướng dẫn ban đầu đề cập đến độ sâu của hệ thống điều hướng, chứ không phải số lần click. Đây là một khác biệt nhỏ nhưng quan trọng, sau đó đã bị đơn giản hóa thành một con số tùy ý.
Điều thực sự khiến người dùng mất kiên nhẫn là sự không chắc chắn, chứ không phải số lần click. Một quy trình thanh toán gồm 5 bước nhưng có chỉ báo tiến trình rõ ràng có thể tạo cảm giác nhanh hơn một biểu mẫu chỉ có 2 bước nhưng khiến người dùng không biết liệu thao tác vừa thực hiện có thành công hay chưa.
Các team chạy theo “quy tắc 3 click” thường cố nhồi nhét mọi thứ vào một nơi: đưa quá nhiều quyết định lên cùng một màn hình, ẩn các trường thông tin trong những nút thu gọn hoặc ép một quy trình nhiều bước thành một trang duy nhất đầy đặc.
Số lần click giảm xuống nhưng sự bối rối vẫn còn nguyên.
Một quy trình dài hơn nhưng có các bước rõ ràng, nhịp độ hợp lý thường mang lại trải nghiệm tốt hơn một quy trình ngắn nhưng đầy những điểm khiến người dùng phải đoán. Sự rõ ràng mới là yếu tố quan trọng trong khả năng sử dụng.
5. Càng nhiều tính năng, sản phẩm càng tốt
Lầm tưởng này tồn tại bởi gần như mọi stakeholder đều có lợi khi tin vào nó. Khách hàng muốn thấy giá trị rõ ràng tương xứng với ngân sách. Quản lý muốn có nhiều thứ để trình diễn. Developer thích xây dựng những logic phức tạp. Marketer muốn một danh sách tính năng dài hơn.Và thế là tất cả cùng thêm vào.
Designer nào đề xuất cắt bớt một tính năng rất dễ bị xem là người “khó tính”.
Đó chính là lúc feature creep xuất hiện: một sản phẩm ban đầu có một giá trị cốt lõi rõ ràng, sau đó liên tục hấp thụ “chỉ thêm một thứ quan trọng nữa” từ từng bộ phận cho đến khi giao diện trông chẳng khác gì buồng lái máy bay được thiết kế bởi cả một hội đồng.
Đến giữa những năm 2000, Microsoft Word đã giấu quá nhiều tính năng bên trong các menu lồng nhau. Nghiên cứu của chính Microsoft cho thấy người dùng đôi khi phát hiện các công cụ quen thuộc một cách tình cờ. Điều này góp phần dẫn đến thiết kế Ribbon — một hệ thống điều hướng hoàn toàn mới được xây dựng để giải quyết sự quá tải đó.
Google Docs ra mắt trong cùng thời kỳ với số lượng tính năng ít hơn rất nhiều: nhập văn bản, định dạng và chia sẻ theo thời gian thực. Tuy nhiên, nó vẫn thu hút một lượng người dùng khổng lồ vì không có quá nhiều thứ đứng giữa người dùng và công việc họ cần hoàn thành.
Thiết kế sản phẩm thường đòi hỏi sự tiết chế nhiều hơn là tham vọng.
MS Word và Google Docs: sự khác biệt trong bố cục
6. Người dùng sẽ đọc toàn bộ nội dung
Copywriter chăm chút từng headline, đội pháp lý kiểm tra điều khoản dịch vụ, designer sắp xếp từng đoạn văn — tất cả đều có thể đang dựa trên một giả định khá dễ chịu rằng người dùng sẽ đọc từ trái sang phải, từ trên xuống dưới, từng chữ một.Nhưng thực tế không phải vậy.
Người dùng thường quét nội dung.
Nielsen Norman Group đã xác định hành vi này từ năm 1997: mắt thường đọc khá đầy đủ dòng đầu tiên, lướt nhanh dòng thứ hai rồi di chuyển xuống dọc theo phía bên trái của trang. Đây chính là mô hình F nổi tiếng.
Các nghiên cứu eye-tracking hiện đại tiếp tục xác nhận xu hướng này. Nếu thiết kế giao diện với giả định rằng người dùng sẽ đọc tuyến tính, những thông tin quan trọng có thể bị chôn giữa đoạn văn và các CTA lại xuất hiện sau ba câu mà chẳng mấy ai đọc hết.
Các công ty tài chính và bảo hiểm từng dành nhiều năm giấu phí dịch vụ trong những file PDF dày đặc thuật ngữ, về mặt lý thuyết vẫn cho người dùng “cơ hội đọc”. Nhưng thực tế gần như chẳng ai làm vậy.
Khi các cơ quan quản lý EU yêu cầu sử dụng Key Information Document dạng một trang, dễ quét và dễ tiếp cận hơn, khả năng hiểu thông tin đã được cải thiện đáng kể.
Nội dung trên giao diện nên xác nhận điều người dùng đang nghi ngờ hoặc trả lời một câu hỏi cụ thể. Những phần vượt quá nhu cầu đó rất dễ trở thành nhiễu thông tin.
Ví dụ về heatmap mô hình F
7. Animation chỉ là phần “có thì tốt”
Khi hỏi khách hàng về motion design, câu trả lời thường là: “Nếu còn thời gian thì làm.”Animation thường bị xem như một lớp trang trí, chỉ được thêm vào sau khi phần “thực sự quan trọng” đã hoàn thành.
Cách nhìn này bỏ qua vai trò quan trọng nhất của motion: giao tiếp.
Một chuyển động được thiết kế tốt có thể trả lời ngay lập tức những câu hỏi vô thức của người dùng: Điều gì vừa xảy ra? Thành phần này đã đi đâu? Hệ thống đang tải hay bị đứng?
Nếu bỏ qua animation và transition, các thay đổi trong giao diện sẽ trở nên đột ngột, khiến não bộ không có đủ thời gian để hình thành một mô hình không gian về giao diện.
Hãy thử hình dung thao tác nhấn nút trái tim trên một bài đăng mạng xã hội. Biểu tượng phóng to nhẹ, tạo hiệu ứng nhịp đập rồi trở về vị trí ban đầu. Nếu bỏ chuyển động đó đi, thao tác vẫn được ghi nhận về mặt kỹ thuật, nhưng trải nghiệm sẽ có cảm giác không hoàn chỉnh. Trong một khoảnh khắc ngắn, người dùng không nhận được tín hiệu trực quan đủ rõ rằng thao tác của họ đã được thực hiện.
Motion vẫn cần được sử dụng có tiết chế. Animation chỉ để trang trí có thể tạo thêm ma sát, đặc biệt với những người nhạy cảm với chuyển động hoặc không muốn phải chờ đợi những hiệu ứng không cần thiết.
Một tùy chọn “giảm chuyển động” vì thế được xem là một tính năng accessibility quan trọng. Animation tốt phải có lý do để tồn tại, truyền đạt chính xác điều cần thiết và nhường chỗ cho những người không muốn nhìn thấy chuyển động.
8. Scrolling là xấu — hãy nhồi tất cả nội dung vào phía trên màn hình
Đây thực chất là một di sản của báo in.“Above the fold” dùng để mô tả nửa trên của một tờ báo được nhìn thấy khi tờ báo được trưng bày trên sạp. Đây là phần mà người đi đường nhìn thấy trước khi quyết định mua báo.
Các designer web thời kỳ đầu trong thập niên 1990 đã gần như bê nguyên khái niệm này lên môi trường số, vì lo rằng người dùng sẽ không biết phải cuộn xuống dưới.
Nhưng hành vi trên môi trường số lại cho thấy một bức tranh khác — dù không đơn giản đến mức “scroll là giải quyết được mọi thứ”.
Scrolling là một thao tác tự nhiên và gần như tự động, khác với việc mở một tờ báo bị gấp. Người dùng cuộn liên tục, thường thậm chí không cần suy nghĩ.
Tuy nhiên, sự chú ý vẫn tập trung nhiều hơn ở phần đầu trang. Nghiên cứu eye-tracking của Nielsen Norman Group cho thấy người dùng dành khoảng 57% thời gian xem trang ở khu vực phía trên nếp gấp và 74% trong hai màn hình nội dung đầu tiên.
So với năm 2010, khi khoảng 80% sự chú ý tập trung phía trên nếp gấp, khoảng cách đã thu hẹp nhưng xu hướng vẫn còn. Phần đầu trang vẫn đảm nhiệm phần lớn công việc quan trọng; chỉ là nó không còn phải gánh tất cả mọi thứ.
Điều đó có nghĩa vấn đề thực sự chưa bao giờ là “người dùng có cuộn hay không”.
Mà là: “Họ có muốn cuộn tiếp hay không?”
Các trang marketing của Apple là một ví dụ điển hình. Một trang sản phẩm có thể kéo dài hàng chục màn hình nhưng mỗi phần đều tạo ra lý do để người dùng tiếp tục khám phá — mỗi lần cuộn mang đến một ý tưởng, một nhịp điệu thị giác và một chi tiết mới xuất hiện đúng lúc.
Thay vì đổ toàn bộ thông số lên một bức tường nội dung, trang web khuyến khích sự tò mò.
Độ dài có thể trở thành một công cụ kể chuyện khi mỗi phần đều đóng góp giá trị riêng. Bởi vấn đề chưa bao giờ thực sự là scrolling. Vấn đề là không cho người dùng bất kỳ lý do nào để tiếp tục.
Màn hình đầu tiên chỉ cần khiến người dùng muốn cuộn tiếp, chứ không cần phải chứa toàn bộ thông điệp ngay lập tức.
Animation dựa trên thao tác cuộn của Apple
9. Thiết kế lại có thể cứu một sản phẩm đang gặp vấn đề
Các đội ngũ điều hành rất dễ tin vào kịch bản này: tỷ lệ giữ chân người dùng giảm, doanh thu không đạt mục tiêu, vậy hãy thiết kế lại giao diện để giải quyết vấn đề.Product designer bị xem như những “thợ sửa chữa khẩn cấp”, được kỳ vọng đảo ngược xu hướng đi xuống bằng những nút bấm nổi bật hơn và một màn hình onboarding mượt mà hơn.
Nhưng thực tế là thiết kế có thể khuếch đại giá trị, chứ không thể tự tạo ra giá trị từ con số 0.
Hãy tưởng tượng một ứng dụng giao hàng quốc tế thường xuyên tính sai phí hải quan và làm mất dữ liệu hóa đơn. Bạn có thể thuê designer UX giỏi nhất, xây dựng một giao diện tối giản tuyệt đẹp với các vùng chạm hoàn hảo và animation mượt mà.
Nhưng hệ thống logistics bên dưới vẫn tiếp tục gặp lỗi, và người dùng vẫn sẽ xóa ứng dụng.
Một bản redesign bóng bẩy trên nền một sản phẩm cốt lõi đang hỏng chỉ khiến “con tàu đang chìm” trông đẹp hơn trên đường chìm xuống.
10. White space là một thứ xa xỉ
Giả định ngầm ở đây là: white space rộng rãi chỉ dành cho những thương hiệu cao cấp như Apple — những công ty đủ “giàu” để cho giao diện có không gian thở, trong khi những thương hiệu khác phải tận dụng từng pixel và nhồi nội dung sát mép để tối đa hóa hiệu quả.Sai lầm nằm ở việc xem white space như phần diện tích trống còn thừa, thay vì một công cụ cấu trúc chủ động.
Bố cục quá chật buộc não phải làm việc nhiều hơn để hiểu hệ thống phân cấp — nhãn này thuộc về trường thông tin nào, nút nào quan trọng nhất, tiếp theo nên nhìn vào đâu.
Nghiên cứu về khả năng sử dụng cho thấy việc tăng line-height, độ thụt đầu dòng và khoảng cách giữa các khối nội dung có thể giúp hoàn thành biểu mẫu nhanh hơn và giảm đáng kể lỗi của người dùng.
Sự cải thiện này đến từ việc giảm tải nhận thức trong quá trình xử lý thông tin, chứ không phải đơn giản vì giao diện trông “sang” hơn.
White space là một thành phần được bố trí có chủ đích, được lựa chọn một cách có tính toán, chứ không phải phần diện tích còn lại sau khi designer không biết thêm gì vào nữa.
Mô hình nằm phía sau những mô hình
Khi đặt cả 10 lầm tưởng này cạnh nhau, chúng ta có thể nhận ra một điểm chung.Không có lầm tưởng nào ban đầu hoàn toàn vô lý. Mỗi quan niệm đều từng có lý do để tồn tại trong một hoàn cảnh cụ thể, với những giới hạn nhất định, trên một thiết bị hoặc trong một thời kỳ nhất định.
“Above the fold” từng hợp lý với báo giấy.
Quy tắc 3 lần click từng có ý nghĩa khi nói về độ sâu của hệ thống điều hướng.
Desktop-first từng hợp lý trước khi smartphone xuất hiện và trở thành thiết bị phổ biến.
Vấn đề bắt đầu khi một ý tưởng từng phù hợp với thời đại tiếp tục tồn tại lâu hơn hoàn cảnh đã tạo ra nó, rồi dần bị đối xử như một quy luật vĩnh viễn.
Một khi một niềm tin không còn được kiểm chứng, nó trở thành hành vi mặc định — không bị đặt câu hỏi và có thể gây ra chi phí lớn. Nó tiếp tục định hình hàng triệu tương tác của người dùng mà không ai thực sự chủ động quyết định rằng nó nên tồn tại.
Thiết kế giao diện tốt đòi hỏi chúng ta phải liên tục kiểm tra những giả định này bằng hành vi thực tế của người dùng, dữ liệu thực tế và chính thiết bị mà họ đang cầm trên tay — thay vì dựa vào một quy tắc mà ai đó từng nhắc lại trong một cuộc họp từ năm 2011.
