Trong quá trình thiết kế, một số lỗi trong sản phẩm của bạn sẽ không được chú ý. Những điều nhỏ nhặt (hoặc đôi khi lớn) này có thể làm hại rất nhiều đến trải nghiệm người dùng khi sử dụng phần mềm của họ. Chúng tôi đã soạn một danh sách các điểm mà bạn có thể kiểm tra trước khi thiết kế được phê duyệt.
Lưu ý rằng không phải tất cả các điểm này áp dụng cho tất cả các sản phẩm, nhưng nói chung chúng có liên quan nhất.
Hộp công cụ thiết kế UX Tải xuống không giới hạn: hơn 11.000.000 mẫu Wireframe và UX, bộ giao diện người dùng, tài sản thiết kế và hơn thế nữa.
Tải ngay
sự tương tác
01 – Hành động lặp đi lặp lại hoặc hoạt động thường xuyên cảm thấy căng thẳng
Bởi vì nó quan trọng: Lặp đi lặp lại các biện pháp cho cùng một kết quả (ví dụ, điền vào các hình thức khác nhau với cùng một thông tin) là một nhiệm vụ vất vả không giúp người dùng đạt được mục tiêu của mình nhanh hơn hoặc tốt hơn. Cũng có khả năng người dùng đang cố gắng tìm cách tránh nó – ví dụ, tìm kiếm các đối thủ cạnh tranh có thể giúp họ làm điều đó nhanh hơn / tốt hơn.
Cách kiểm tra: Bạn nên bắt đầu bằng cách phân tích tất cả các dòng sản phẩm và quan sát hành vi của người dùng. Bạn muốn chắc chắn rằng nếu có những hành động lặp đi lặp lại, có một cách để tạo điều kiện cho họ: ví dụ: một cách khác để sử dụng thông tin được chỉ định trước đó.
02 – Người dùng có thể dễ dàng phục hồi sau khi xảy ra lỗi
Bởi vì nó quan trọng: Thông thường, người dùng thực hiện các hành động hoặc hành động không mong muốn không mang lại kết quả mong muốn và để họ quay lại và thử lại có nghĩa là họ sẽ không trở nên thất vọng và sẽ dễ dàng phục hồi và tiếp tục tiến về phía trước.
Cách kiểm tra: Đầu tiên, hãy kiểm tra xem bạn sistema điều hướng cho phép trở lại và hành động có thể được hoàn tác. Khi bạn chạy kiểm tra khả năng sử dụng, bạn tạo các tình huống trong đó người dùng có thể thực hiện hành động sai và xem bạn có thể dễ dàng phục hồi hay không.
03 – Người dùng nhận được hỗ trợ đầy đủ tùy thuộc vào mức độ kinh nghiệm của họ
Bởi vì nó quan trọng: Điều quan trọng là đảm bảo rằng những người mới bắt đầu sản phẩm của bạn có trải nghiệm học tập suôn sẻ. Tuy nhiên, một khi bạn đã quen thuộc với sản phẩm, nó sẽ dẫn đến các công cụ giúp bạn di chuyển qua các luồng nhanh hơn. Cả hai kịch bản đều cải thiện khả năng sử dụng và giữ lại chúng. Ví dụ: các phím tắt cho chuyên gia, mẹo công cụ cho người mới bắt đầu, v.v.
Cách kiểm tra: Đầu tiên, hãy kiểm tra xem bạn có công cụ cho cả hai đối tượng không. Sau đó chạy thử nghiệm khả năng sử dụng với người mới bắt đầu và các chuyên gia để xem liệu các công cụ này đang được sử dụng đúng cách.
04 – Truy cập trợ giúp không cản trở tiến trình của người dùng
Bởi vì nó quan trọng: Người dùng yêu cầu trợ giúp khi họ bị mắc kẹt trong một phần cụ thể của sản phẩm. Điều quan trọng là sự giúp đỡ, trực tuyến hoặc ngoại tuyến, hơn nữa và cho phép người dùng tiếp tục công việc ở nơi họ rời đi.
Cách kiểm tra: Tạo các kịch bản thử nghiệm nơi người dùng sẽ yêu cầu trợ giúp và xem liệu quy trình và tiến độ công việc của họ có bị gián đoạn không.
Thiết kế trực quan
05 – Không quá ba màu chính
Bởi vì nó quan trọng: Đây không phải là quy tắc đã được thiết lập và trong một số trường hợp có thể sử dụng nhiều hơn ba màu chính. Tuy nhiên, hãy nhớ rằng đã khó kết hợp ba màu, vì vậy trong hầu hết các trường hợp nên tránh nhiều hơn.
Cách kiểm tra: Đảm bảo rằng bảng màu bạn đã sử dụng khi thiết kế sản phẩm có không quá ba màu chính.
06 – Chỉ màu không được sử dụng để truyền đạt thứ bậc, nội dung hoặc chức năng
Bởi vì nó quan trọng: Có một sản phẩm có sẵn không phải là một lợi thế, nó rất quan trọng. Đối với những người khiếm thị như mù màu, chỉ dựa vào màu sắc để truyền đạt thứ bậc, nội dung hoặc chức năng, họ có nghĩa là họ sẽ không thể sử dụng sản phẩm của bạn và sẽ là một nhân khẩu học bị loại trừ.
Cách kiểm tra: colorfilter.wickline.org cho phép bạn đặt một bộ lọc màu ở đầu trang web của bạn và kiểm tra nó cho các loại mù màu khác nhau. Bạn cũng có thể chụp sản phẩm của mình và chuyển đổi nó thành thang độ xám trong trình chỉnh sửa hình ảnh và xem liệu bạn có thể dễ dàng phân biệt màu sắc hay không.
07 – Hệ thống phân cấp trực quan dẫn người dùng đến hành động mong muốn
Bởi vì nó quan trọng: Người dùng dựa vào hệ thống phân cấp và manh mối để biết phải làm gì và đi đâu; Điều quan trọng là phải hiểu điều này và hướng dẫn họ sử dụng đúng thứ bậc đó.
Cách kiểm tra: Hiểu cách các luồng hoạt động trong sản phẩm của bạn và liệu các hành động chính của bạn có được kích thích bởi hệ thống phân cấp thị giác hay không.
08 – Các yếu tố quan trọng nhất trong hệ thống phân cấp thị giác
Bởi vì nó quan trọng: Hệ thống phân cấp trực quan cho phép người dùng quét nhanh thông tin bằng cách ưu tiên nội dung dựa trên nhu cầu tức thời của họ. Các đối tượng gần đầu phân cấp thị giác phải là quan trọng nhất đối với công ty và phù hợp nhất với người dùng.
Cách kiểm tra: Chụp màn hình sản phẩm kỹ thuật số của bạn và sau đó làm mờ Gauss ảnh chụp màn hình trong bán kính khoảng 5px. Nếu bạn nhìn vào kết quả, bạn sẽ ngay lập tức hình dung ra thứ bậc và chú ý những yếu tố nào được làm nổi bật. Có phải họ là quan trọng nhất cho công ty và người dùng?
09 – Hành động chính khác với hành động phụ
Bởi vì nó quan trọng: Có các hành động chính và phụ khác nhau có nghĩa là người dùng sẽ không bị nhầm lẫn khi tương tác với sản phẩm của bạn và sẽ ít có khả năng mắc lỗi. Ví dụ: "Gửi" và "Hủy" phải khác nhau rõ ràng.
Cách kiểm tra: Khi thực hiện các bài kiểm tra khả năng sử dụng, hãy tìm kiếm các lỗi phổ biến không phải là kết quả của ý định của người dùng, mà từ các hành động chính và phụ khác biệt kém. Khi xem xét thiết kế, bạn cũng phải đảm bảo rằng màu sắc, kích thước, vị trí và các yếu tố khác tách biệt các tài liệu.
10 – Các yếu tố tương tác không được trừu tượng hóa
Bởi vì nó quan trọng: Khi sử dụng một sản phẩm mới, người dùng đi kèm với một loạt các kỳ vọng được tạo ra bởi trải nghiệm trước đây của họ với các sản phẩm kỹ thuật số khác, chẳng hạn như cách các nút sẽ trông như thế nào và chúng nên hoạt động như thế nào. Đáp ứng những mong đợi này có nghĩa là bạn không tạo ra ma sát không cần thiết.
Cách kiểm tra: Đầu tiên, hãy kiểm tra sản phẩm cho các khu vực không sử dụng thiết kế chung. Ví dụ: các liên kết không giống như các liên kết.
11 – Việc nộp mẫu đơn được xác nhận theo cách trực quan khác
Bởi vì nó quan trọng: Điều quan trọng là cung cấp cho người dùng xác nhận xem một hành động có thành công hay không. Ví dụ: sau khi gửi biểu mẫu, một thông báo xác nhận rõ ràng dưới dạng biểu ngữ màu có nghĩa là người dùng có thể chuyển sang tác vụ tiếp theo.
Cách kiểm tra: Kiểm tra tất cả các khu vực của sản phẩm của bạn, nơi người dùng cung cấp thông tin. Khi mục nhập của người dùng hoàn tất, bạn kích hoạt xác nhận xem hành động đó có thành công hay không. Hãy chắc chắn rằng thông tin phản hồi là rõ ràng về trạng thái cuối cùng.
12 – Thông điệp cảnh báo phù hợp
Nó là gì Thông điệp cảnh báo có cùng kiểu dáng và xuất hiện ở cùng một nơi theo cùng một cách.
Bởi vì nó quan trọng: Có thông điệp cảnh báo nhất quán có nghĩa là người dùng luôn hiểu những gì đáng được quan tâm ngay lập tức. Việc không tuân thủ các cảnh báo sẽ gây thêm căng thẳng về tinh thần cho mỗi cảnh báo mới.
Cách kiểm tra: Đảm bảo các thông điệp cảnh báo có cùng kiểu dáng và vị trí của chúng giống hoặc giống hệt nhau.
13 – Thông điệp cảnh báo khác nhau về mặt thị giác
Bởi vì nó quan trọng: Bằng cách đảm bảo rằng các thông báo cảnh báo rõ ràng khác với các yếu tố khác trên màn hình, người dùng có thể gắn nhãn cho chúng và / hoặc hành động tương ứng.
Cách kiểm tra: Sau khi kiểm tra sự khác biệt về hình ảnh, hãy xem cách người dùng phản hồi các thông báo cảnh báo trong các bài kiểm tra khả năng sử dụng.
Kiến trúc thông tin
14 – Điều hướng là phù hợp
Bởi vì nó quan trọng: Cách người dùng nhắm mục tiêu và sau đó điều hướng sản phẩm của bạn trực tiếp ảnh hưởng đến việc họ có thể hoàn thành mục tiêu của mình bất kể trang web hiện tại của họ hay không.
Cách kiểm tra: Kiểm tra thông tin tài liệu cho kiến trúc thông tin của bạn và đảm bảo rằng điều hướng có sẵn trên mỗi trang và nó không thay đổi hoặc biến mất. Trước khi đi sâu vào thiết kế trực quan, hãy thử đặt hàng thẻ hoặc kiểm tra cây để đảm bảo đường dẫn kiến trúc thông tin của bạn trực quan nhất có thể.
15 – Phòng cho sự tăng trưởng
Bởi vì nó quan trọng: Bạn không thể làm lại sistema điều hướng và thông tin sản phẩm khi các tính năng mới hoặc nội dung xuất hiện. Menu điều hướng và bố cục tổng thể nên hỗ trợ nhiều danh mục / chủ đề hơn mà không bị gián đoạn. Thiết kế có chỗ cho sự tăng trưởng có nghĩa là những nỗ lực thiết kế và phát triển lớn có thể dễ dàng được thu nhỏ thông qua giao diện.
Cách kiểm tra: Hỏi bất cứ ai quan tâm về cách nội dung có thể phát triển theo thời gian trong sản phẩm. Nó sẽ hỗ trợ nội dung tĩnh hơn? Kiến trúc sẽ cần hỗ trợ video?
Kiểu chữ
16 – Tối đa hai họ thuộc các loại khác nhau được sử dụng
Bởi vì nó quan trọng: Đây không phải là một quy tắc cố định: đôi khi có thể đạt được nhiều hơn hai. Nhưng nói chung, không dễ để kết hợp nhiều hơn hai. Vì khả năng sử dụng và lý do trực quan, hãy đơn giản hóa hệ thống phân cấp chính tả của bạn bằng cách bám sát hai và cải thiện sự hiểu biết.
Cách kiểm tra: Chỉ cần đảm bảo rằng thiết kế của bạn không trộn lẫn nhiều hơn hai họ cùng loại. Bạn cũng nên đảm bảo rằng các gia đình bạn chọn khớp chính xác (đọc thêm tại đây).
17 – Phông chữ được sử dụng cho nội dung văn bản có kích thước tối thiểu 12 pixel
Bởi vì nó quan trọng: Một lần nữa, đây không phải là một quy tắc khó: về lý thuyết, bạn có thể sử dụng các kích thước nhỏ hơn cho các mục đích rất cụ thể, nhưng nói chung, khả năng đọc được giảm đáng kể cho các kích thước dưới 12 pixel.
Cách kiểm tra: Kiểm tra tất cả nội dung và đảm bảo các phông chữ được sử dụng cho chúng có kích thước tối thiểu 12 pixel.
18 – Sách viết hoa cho nhãn, tiêu đề hoặc từ viết tắt
Bởi vì nó quan trọng: Hạn chế việc sử dụng chữ in hoa được biết là giúp dễ hiểu hơn: nó ít nặng hơn và dễ tiêu hóa hơn đối với người dùng. Nó nên được sử dụng đặc biệt để nhấn mạnh hoặc các trường hợp rất hạn chế – ví dụ, các từ viết tắt.
Cách kiểm tra: Kiểm tra cẩn thận nội dung và đảm bảo chữ in hoa được giới hạn trong các tiêu đề, nhãn hoặc chữ viết tắt.
19 – Các kiểu hoặc phông chữ khác nhau được sử dụng để phân tách nội dung của các điều khiển
Bởi vì nó quan trọng: Cần có các chỉ số rõ ràng về nội dung là gì và các điều khiển là gì, nghĩa là, những gì người dùng có thể tương tác. Các chỉ số này có thể là kích thước, màu sắc, định vị, phông chữ, vv Nguồn rất quan trọng: việc sử dụng các kiểu hoặc gia đình khác nhau có nghĩa là người dùng không bị nhầm lẫn và dễ dàng xác định những gì họ có thể tương tác.
Cách kiểm tra: Xác định tất cả các điều khiển trên sản phẩm của bạn và đảm bảo chúng nổi bật so với nội dung. Khi chạy kiểm tra khả năng sử dụng, hãy chú ý xem người dùng có gặp khó khăn khi tương tác với các điều khiển hay không.
20 – Kích thước / trọng lượng phông chữ khác nhau giữa các loại nội dung
Bởi vì nó quan trọng: Nó ảnh hưởng lớn đến khả năng đọc và hiểu. Phân biệt rõ ràng giữa các tiêu đề, phụ đề và đoạn văn làm giảm căng thẳng tinh thần bằng cách tiêu hóa nội dung đó. Nó cũng có lợi ích thị giác: nó trông và cảm thấy tốt hơn.
Cách kiểm tra: Khi xem xét nội dung sản phẩm của bạn, hãy đảm bảo rằng các tiêu đề, phụ đề và đoạn văn sử dụng các kích thước và trọng lượng phông chữ khác nhau.
Giao diện người dùng
21 – Sự gần gũi và thích nghi
Bởi vì nó quan trọng: Người dùng có xu hướng nhóm, theo chức năng hoặc theo ngữ cảnh, các yếu tố gần nhau. Một thanh điều hướng là một ví dụ tốt về điều này. Theo mô hình này và các yếu tố nhóm được kết nối có nghĩa là người dùng ngay lập tức hiểu giao diện của mình.
Cách kiểm tra: Tìm kiếm các mục có chức năng tương tự và kiểm tra xem (nếu có thể) chúng được nhóm lại với nhau.
22 – Chỉ báo tiến độ cho quy trình làm việc nhiều giai đoạn
Bởi vì nó quan trọng: Đặc biệt đối với các luồng đa tầng, người dùng có thể dễ dàng cảm thấy choáng ngợp hoặc tự hỏi bao lâu nó đã được hoàn thành. Một thanh tiến trình giúp bạn tìm thấy chính mình, nhưng quan trọng hơn, nó tạo ra cảm giác hoàn thành và giảm tỷ lệ rơi.
Cách kiểm tra: Kiểm tra tất cả các dòng chảy trong sản phẩm của bạn, nơi có các bước khác nhau để đạt được điều gì đó, và sau đó đảm bảo rằng tiến trình được chỉ báo bằng một chỉ báo.
23 – Các yếu tố tiền cảnh (như nội dung và điều khiển) có thể dễ dàng phân biệt với nền
Bởi vì nó quan trọng: Quan trọng đối với người khiếm thị. Nó cũng cải thiện đường cong học tập và sự hiểu biết của người dùng. Sự khác biệt rõ ràng giúp điều hướng dễ dàng hơn, chú ý nhiều hơn đến các nút và tăng khả năng sử dụng tổng thể.
Cách kiểm tra: Chụp màn hình sản phẩm của bạn và Gaussian làm mờ ảnh chụp màn hình trong bán kính xấp xỉ 3 đến 5 điểm ảnh. Nếu bạn nhìn vào kết quả, bạn có thể dễ dàng biết được cái gì ở phía trước và cái gì ở hậu cảnh?
Chúc mừng bạn đã xem lại danh sách!
… Nhưng đây không phải là kết thúc.
Sản phẩm của bạn bây giờ mạnh mẽ hơn và có thể đã được cải thiện trong một số lĩnh vực, ví dụ như có thể dễ truy cập hơn, nhưng luôn nhớ kiểm tra, thu thập phản hồi của người dùng và tiếp tục lặp lại.
