10 quy tắc vàng trong thiết kế giao diện người dùng

10 quy tắc vàng trong thiết kế giao diện người dùng

Dựa trên cuốn sách “Designing the User Interface” của Ben Shneiderman và cuốn “Ten Usability Heuristics” của Jakob Nielsen, sau đây là 10 quy tắc căn bản và quan trọng nhất trong thiết kế giao diện người dùng.

Chúng được gọi là “heuristics” bởi vì tính chất của chúng không phải quy tắc chỉ dẫn cụ thể mà thay vào đó là những quy tắc có thể áp dụng linh hoạt trong từng trường hợp khác nhau.

  1. Theo đuổi sự đồng bộ trong thiết kế:

Một thiết kế giao diện hiệu quả sẽ không khiến người dùng phải đặt ra các câu hỏi rằng liệu những từ ngữ, hoàn cảnh, hay hành động khác nhau có mang cùng một ý nghĩa hay không? Do vậy, để tránh gây bối rối cho người dùng, hãy sử dụng từ ngữ, ký hiệu hành động một cách thống nhất.

Nói cách khác, chúng ta nên sử dụng đồng bộ tất cả các yếu tố hiển thị. Ví dụ, ký hiệu cụ thể của nút bấm sẽ luôn thực hiện một hành động duy nhất hay thanh điều hướng cũng nên hiển thị có logic, hệ thống.

Khi áp dụng quy tắc này bạn nên cân nhắc đến những yếu tố sau:

  • Workflow/Quá trình
  • Chức năng
  • Hình dạng
  • Thuật ngữ
  1. Hiển thị trạng thái của hệ thống hoặc cung cấp thông tin phản hồi:

Hệ thống cần thông báo cho người dùng biết về những gì đang diễn ra theo một cách thích hợp và đúng thời điểm. Hãy nói cho họ biết chuyện gì đang xảy ra trước khi họ bắt đầu đưa ra phán đoán của mình.

Người dùng luôn muốn được kiểm soát tình hình, họ tin rằng hệ thống sẽ phản hồi như mong đợi. Điều đó cũng có nghĩa rằng họ không thích sự “bất ngờ”. Đối với những hành động nhỏ và thường xuyên, phản hồi của hệ thống có thể linh hoạt được đôi chút nhưng đối với những hành động chính và quan trọng, phản hồi nên truyền đạt một cách chính xác và hiệu quả những thông tin đến người dùng

Khi thiết kế nội dung phản hồi, bạn nên chú ý đến các vấn đề sau:

  • Phản hồi cần có sự liên quan
  • Phù hợp với độ quan trọng và cấp bách của nó
  • Dễ dàng hiểu được và có ý nghĩa với người dùng
  • Đặt trong bối cảnh thích hợp (Yếu tố thời gian và địa điểm)
  1. Kết hợp hệ thống với hiển thị thực tế:

Như đã nói, người dùng càng ít phải phán đoán càng tốt. Hệ thống nên hiển thị ngôn ngữ của người dùng (cụm từ, concept quen thuộc với người dùng) để giao tiếp với họ hơn là sử dụng những thuật ngữ đặc biệt của hệ thống.

Chuỗi các hành động liên tiếp nên được sắp xếp vào cùng một nhóm từ giai đoạn bắt đầu cho đến giai đoạn giữa và giai đoạn kết thúc. Khi một quá trình kết thúc, hãy thông báo cho người dùng về điều đó. Hãy cho họ biết rằng họ đã hoàn thành tất cả những điều cần thiết.

Một số lưu ý khi thiết kế:

  • Chuỗi các hành động
  • Thông báo hoàn thành một hành động
  • Thiết kế nội dung chỉ dẫn hành động tiếp theo một cách hiệu quả
  1. Cho phép người dùng đảo ngược hành động:

Shneiderman đã miêu tả như sau: “Chức năng này giúp người dùng xóa bỏ lo ngại khi họ biết rằng những lỗi đó có thể ‘ctrl-z’ ngay lập tức, nhờ vậy khuyến khích họ khám phá những tính năng khác mà họ chưa từng sử dụng”.

Trên nền tảng ứng dụng, điều này có thể được hiểu giống như chức năng ‘undo’ và ‘redo’. Việc thêm vào tính năng “emergency exit” cũng có thể giúp người dùng thoát ra khỏi tình trạng không may mà không phải nhận bất kỳ một thông báo mở rộng nào.

Đảo ngược hành động:

  • Không can thiệp đến quá trình làm việc
  • Nhiều không gian trống hơn cho người dùng
  • Sử dụng duy nhất một thao tác Undo và lịch sử hành động
  1. Ngăn ngừa những lỗi có thể xảy ra:

Không một ai thích gặp phải lỗi trong quá trình sử dụng, tệ hơn nữa là khi chúng ta có cảm giác rằng mình đã làm sai điều gì đó. Do vậy, hệ thống cần loại bỏ những lỗi dễ xảy ra cho người dùng, hoặc kiểm tra và thông báo giúp họ trước khi họ xác nhận hành động tiếp theo.

Hãy thiết kế một hệ thống hiệu quả nhất có thể để không một người dùng nào gặp phải những lỗi nghiêm trọng. Nếu một lỗi xuất hiện, hệ thống phải có chức năng phát hiện và đưa ra giải pháp đơn giản, dễ hiểu giúp người dùng xử lý lỗi đó.

Một số điều cần nhớ:

  • Ngăn ngừa lỗi sẽ hiệu quả hơn việc xử lý lỗi sau khi nó đã xảy ra
  • Tính năng tự động phát hiện lỗi
  • Thông báo rõ ràng, chính xác về lỗi gặp phải
  • Gợi ý về giải pháp cho vấn đề
  1. Giảm tải bộ nhớ ngắn hạn:

Như Nielsen đề cập, nhận biết một thứ gì đó sẽ dễ dàng hơn việc ghi nhớ nó. Hạn chế việc ghi nhớ của người dùng bằng cách thiết kế vật thể, hành động, các sự lựa chọn khả dĩ. Những chỉ dẫn cũng nên được hiển thị một cách rõ ràng.

Sử dụng biểu tượng và các yếu tố thị giác khác như màu nền và việc sắp đặt thống nhất các lựa chọn/tính năng để giúp người dùng cũ nhanh chóng tìm được chức năng cần thiết.

Để giảm thiểu việc ghi nhớ cần lưu ý:

  • Ứng dụng nên có một cấu trúc rõ ràng
  • Nhận biết điều gì đó sẽ dễ dàng hơn việc nhớ ra nó
  • Sự trợ giúp tiềm ẩn
  • Những hỗ trợ thị giác
  1. Cho phép người dùng sử dụng phím tắt để thực hiện các thao tác thường xuyên:

Cho phép người dùng chi phối và cá nhân hóa những thao tác thường xuyên trên ứng dụng/sản phẩm.

Những từ viết tắt, phím chức năng, lệnh ẩn hay những tài nguyên mở rộng sẽ đặc biệt hữu ích cho nhóm người dùng chuyên gia.

Từ khóa liên quan:

  • Bộ phím tắt
  • Những tính năng ‘Power User’
  • Cơ chế tự động thao tác
  1. Thiết kế tối giản:

 Tối giản hóa không có nghĩa là hạn chế. Tất cả thông tin đều phải mang những ý nghĩa nhất định.

Tối giản hóa giao diện bằng cách loại bỏ những yếu tố/nội dung không cần thiết hoặc không có vai trò giúp đỡ người dùng.

  1. Giúp người dùng nhận biết, chẩn đoán và khôi phục các lỗi:

Những thông báo lỗi nên được thể hiện bằng ngôn ngữ đơn giản, dễ hiểu (không nên sử dụng các thuật ngữ của hệ thống để thông báo cho người dùng), biểu thị chính xác lỗi mà người dùng gặp phải và đưa ra gợi ý từng bước một để người dùng xử lý vấn đề.

Nói cho người dùng biết chính xác điều gì sẽ xảy ra cả trước và sau khi họ thực hiện một hành động.

  1. Tài liệu trợ giúp:

 Mặc dù sẽ tốt hơn nếu giao diện được người dùng sử dụng một cách dễ dàng mà không cần đến tài liệu hướng dẫn, đây vẫn là một điều cần thiết để cung cấp cho người dùng sự giúp đỡ bất cứ khi nào họ cảm thấy bối rối. Các tài liệu hướng dẫn nên được thiết kế tối ưu cho việc tiếp cận, tra cứu, tập trung vào những thao tác của người dùng với danh sách các bước cụ thể và đương nhiên, chúng không nên quá dài.


Leave a Reply

CÔNG TY TNHH MTV TIN HỌC VÀ DỊCH VỤ VIỆT SEO

* Hồ Chí Minh
Tầng 7, Số 60 Nguyễn Văn Thủ, Phường Đakao, Quận 1, TP.HCM (Vui lòng hẹn trước)
Tel: 0917 212 969 (Mr.Thắng) - 0908 744 256 (Mr. Thanh)

* Bình Dương
Số 299/11 Đại Lộ Bình Dương, Tân Định, Bến Cát, Bình Dương
Tel: (02743) 511 072 - 0917 212 969 (Mr.Thắng) - 0908 744 256 (Mr. Thanh)

* Email: vietseo @vietseo.com; congtyvietseo @gmail.com
* Zalo, viber: 0917 212 969
* Skype ID: vietseo