Fitt’s Law

Thời gian để chạm đến một điểm mục tiêu phụ thuộc vào khoảng cách và độ lớn của điểm đó.

- Các điểm cảm ứng nên đủ lớn để người dùng có thể chọn chúng một cách chính xác.

- Các điểm cảm ứng nên có khoảng cách đủ rộng giữa chúng.

- Các điểm cảm ứng nên được đặt trong các khu vực xác định trên màn hình giao diện cho phép người dùng dễ dàng xác định và chọn chúng.

Tính khả dụng là một khía cạnh quan trọng trong một thiết kế tốt. Tính khả dụng là khả năng dễ dàng sử dụng và có thể điều hướng người dùng giúp họ có thể đến được nơi cần đến nhanh hơn. Tương tác của người dùng nên dễ dàng, trực quan, tốn ít công sức nhất có thể. Thời gian người dùng di chuyển đến một điểm và tương tác với điểm đó là một thước đo quan trọng. Điều quan trọng là các nhà thiết kế phải xác định đúng kích cỡ của đối tượng và đặt chúng ở đúng nơi để đảm bảo chúng có thể dễ dàng lựa chọn và đáp ứng được mong đợi của người dùng - họ có thể click chọn chính xác đối tượng dù là họ đang dùng con trỏ chuột hay ngón tay hay là phương thức nhập gì đi nữa.

Để giải quyết vấn đề này, chúng ta có thể áp dụng định luật Fitts, định luật này nói rằng thời gian để người dùng tương tác với một vật thể có liên quan đến kích thước và khoảng cách tới nó. Nói cách khác, khi kích thước của đối tượng tăng lên thì thời gian chọn đối tượng đó sẽ giảm xuống. Tương tự, thời gian chọn đối tượng sẽ giảm đi khi khoảng cách giữa người dùng và đối tượng giảm. Điều ngược lại cũng đúng: một vật thể càng nhỏ và càng xa thì càng mất nhiều thời gian để click chọn chính xác. Chúng ta sẽ cùng tìm hiểu luật này và các ứng dụng trong bài viết này.

Định luật Fitts ra đời vào năm 1954, khi nhà tâm lý học người Mỹ Paul Fitts dự đoán rằng thời gian cần thiết để di chuyển nhanh đến một mục tiêu tiếp cận là một hàm tỷ lệ giữa khoảng cách đến mục tiêu và kích thước của mục tiêu. Ngày nay, nó được coi là một trong những mô hình thành công và có ảnh hưởng nhất về chuyển động của con người. Nó được sử dụng rộng rãi trong công thái học và tương tác giữa con người với máy tính để mô hình hóa hành động trỏ tới một đối tượng nào đó, dù là trong thực tế hay môi trường ảo.

Fitts còn đề xuất một chỉ số để đo mức độ khó khăn khi chọn một đối tượng, trong đó khoảng cách đến tâm của đối tượng (D) giống như tín hiệu và chiều rộng của đối tượng (W) giống như nhiễu:

Định luật Fitt là một mô hình nghiên cứu chuyển động của con người trong thế giới vật lý trước khi giao diện đồ họa người dùng được phát minh, nhưng nó vẫn có thể được áp dụng cho chuyển động trong các giao diện số. Có ba vấn đề có thể suy ra từ định luật Fitt. Thứ nhất, các mục tiêu tiếp cận nên đủ lớn để người dùng có thể dễ dàng phân biệt và chọn chính xác chúng. Thứ hai, giữa hai mục tiêu tiếp cận nên có khoảng không gian trống giữa chúng. Và cuối cùng, các mục tiêu nên được đặt ở những vùng có thể dễ dàng để tiếp cận. Chúng ta dễ dàng nhận thấy rằng, kích thước của các mục tiêu tiếp cận rất quan trọng: khi kích thước quá nhỏ, người dùng sẽ tốn thời gian hơn để tương tác với chúng. Kích thước tiêu chuẩn sẽ khác nhau cho từng loại giao diện, nhưng nhìn chung thì việc xác định kích thước là vô cùng quan trọng.

Điều đáng lưu ý ở đây là những khuyến nghị ở bảng trên chỉ là kích thước tối thiểu. Các nhà thiết kế nên tăng kích thước lên càng nhiều càng tốt để giảm sự khó khăn khi tương tác với đối tượng. Một kích thước vừa đủ không chỉ giúp người dùng dễ dàng click chọn mà còn tạo một ấn tượng cho người dùng rất giao diện này rất dễ sử dụng. Kích thước của đối tượng quá nhỏ sẽ tạo ấn tượng rằng giao diện này không có tính khả dụng cao dù người dùng vẫn có thể tránh được lỗi khi chọn đối tượng.

Một điều có thể ảnh hưởng đến tính khả dụng là khoảng cách giữa các đối tượng. Khi khoảng cách giữa hai vật thể quá nhỏ, khả năng chọn sai đối tượng là rất cao. Phòng thí nghiệm Touch Lab của MIT đã tiến hành một nghiên cứu chỉ ra rằng bề mặt ngón tay trung bình của người lớn là 10-14 mm và đầu ngón tay trung bình là 8-10 mm. Việc người dùng đôi lúc sẽ chạm ra ngoài đối tượng là không thể tránh khỏi - và nếu các đối tượng xung quanh mục tiêu tiếp cận ở quá gần, họ sẽ càng dễ chọn nhầm, khiến họ rất khó chịu và có cảm giác rằng giao diện này khó sử dụng. Để giảm khả năng chọn sai đối tượng ở tình huống trên, hướng dẫn của Google về Material Design đã khuyến nghị rằng “các mục tiêu cảm ứng nên được cách nhau ít nhất 8 dp [density-independent pixels] để đảm bảo mật độ các đối tượng cân đối và tính khả dụng cao.”

Bên cạnh kích thước và khoảng cách, vị trí của một đối tượng cũng ảnh hưởng đến việc nó có thể dễ dàng tương tác không. Đặt các đối tượng ở những vùng khó tiếp cận hơn sẽ khiến việc click chọn gây khó khăn cho người dùng. Vùng khó tiếp cận của từng giao diện sẽ khác nhau tùy thuộc vào người dùng, thiết bị họ sử dụng, v.v. Đối với các điện thoại thông minh, chúng có nhiều kiểu dáng và người dùng cầm theo nhiều cách khác nhau tùy vào tác vụ và cách họ cầm điện thoại một tay hay hai tay. Có những vùng trên điện thoại có thể rất khó để chạm vào khi cầm điện thoại một tay và sử dụng ngón cái để chọn các đối tượng, trong khi có những vùng lại rất dễ dàng dù người dùng chỉ cầm điện thoại bằng một tay. Ngay cả khi sử dụng một tay, độ chính xác không tăng theo cấp số nhân từ phía dưới bên phải đến phía trên bên trái của màn hình; theo nghiên cứu của Steven Hoober, mọi người thường sẽ nhìn và chạm vào vùng trung tâm của điện thoại, đó là nơi có độ chính xác cao nhất (Hình bên dưới). Người dùng có xu hướng tập trung vào màn hình của điện thoại, thay vì lướt mắt từ phía trên bên trái đến phía dưới bên phải như trên các màn hình máy tính.

Chúng ta sẽ bắt đầu bằng việc xem xét một ví dụ phổ biến của Định luật Fitts: form text label - nhãn của một khung nhập văn bản (mọi người coi hình dưới để hiểu hơn nha). Bằng cách kết hợp một nhãn - label với một khung nhập - input, người thiết kế và các lập trình viên đảm bảo rằng việc click hay chạm vào nhãn cũng sẽ có cùng chức năng khi chọn khung nhập. Tính năng cơ bản này sẽ làm tăng vùng có thể tương tác với khung nhập - form input, giúp người dùng dễ dàng chọn với ít lỗi hơn. Hiệu quả của việc này là đem lại cho người dùng trên phiên bản máy tính và điện thoại trải nghiệm tốt hơn.

Vẫn tiếp tục với form, một ví dụ phổ biến khác của Định luật Fitt là nơi đặt các nút gửi đơn (submission button). Những nút này thường được đặt ở gần khung nhập cuối cùng, bởi vì thường thì khi điền một biểu mẫu, người dùng sau khi điền vào input cuối cùng sẽ muốn nhấn nút gửi đi. Việc đặt vị trí như trên sẽ đảm bảo rằng hai đối tượng trên sẽ có mối liên hệ trực quan với nhau cũng như đảm bảo khoảng cách người dùng phải di chuyển từ input cuối đến nút gửi là nhỏ nhất.

Khoảng cách giữa các đối tượng cần tương tác cũng rất quan trọng. Chẳng hạn như yêu cầu kết nối của ứng dụng LinkedIn hệ điều hành iOS (hình dưới), trong đó các nút bấm “Chấp nhận” hay “Từ chối” được đặt ở phía bên phải màn hình. Hai nút này được đặt rất gần nhau nên người dùng cần phải tập trung để chọn nút bấm mình muốn để không vô tình chọn sai. Thực tế thì, mỗi lần tôi tương tác với màn hình này, tôi đều chuyển sang cầm điện thoại hai tay để chắc chắn mình không bấm nhầm.

Các điện thoại thông minh, laptop và máy tính để bàn không phải là những giao diện duy nhất chúng ta tương tác hàng ngày. Hãy lấy ví dụ về các hệ thống giải trí thông tin, mà có thể được tìm thấy trong các xe ô tô mà nhiều người sử dụng hàng ngày. Tesla Model 3 là một ví dụ, với một màn hình 15 inch được gắn trực tiếp trên bảng điều khiển. Hầu hết các nút bấm điều khiển hệ thống trên xe được đặt trên màn hình này và không cung cấp phản hồi cảm giác khi người dùng tương tác. Điều này đòi hỏi người lái phải chuyển sự chú ý của mình đang nhìn đường khi lái xe sang màn hình để truy cập các điều khiển này, vì vậy Định luật Fitts là vô cùng quan trọng.

Tesla Model 3 đã áp dụng định luật Fitt khi đã thêm các khoảng cách giữa các đối tượng trên thanh điều hướng (hình dưới). Điều này sẽ giảm thiểu khả năng bấm nhầm vào các nút hai bên.

Trước đó tôi đã đề cập đến các vùng có thể dễ dàng chạm đến khi sử dụng điện thoại với ngón tay cái cũng như vị trí của đối tượng khi ở vùng khó chạm sẽ khiến người dùng khó tương tác như thế nào. Với sự xuất hiện của iPhone 6 và iPhone 6 Plus lớn hơn, Apple đã giới thiệu một tính năng nhằm giảm thiểu khó khăn khi sử dụng một tay. Tính năng này, được gọi là Reachability, cho phép người dùng nhanh chóng đưa các mục ở phía trên màn hình xuống phía dưới màn hình thông qua một cử chỉ đơn giản (xem hình dưới). Nó giúp người dùng dễ dàng chạm vào các vùng khó tiếp cận dù họ chỉ đang cầm điện thoại với một tay.

Trách nhiệm của một nhà thiết kế là đảm bảo các giao diện sẽ nâng cao trải nghiệm người dùng và không làm xao lãng, làm giảm năng suất của họ. Giao diện mobile đặc biệt dễ bị ảnh hưởng bởi luật Fitt do không gian màn hình có giới hạn. Các đối tượng tương tác nên đủ lớn để người dùng có thể vừa phân biệt vừa chọn chúng một cách chính xác, nên có khoảng cách đủ lớn giữa các đối tượng để tránh vô tình chọn nhầm đối tượng khác và đặt chúng ở những vùng giao diện dễ chọn.