Tài liệu Kinh nghiệm Usability – thiết kế form hiệu quả pptx

Kinh nghiệm Usability –
thiết kế form hiệu quả

Form là một yếu tố chúng ta thường gặp trên môi trường
Internet, form có thể chỉ đơn giản là một ô đăng nhập, một
form đăng ký mua hàng hoặc một đơn vay vốn ngân hàng
phức tạp. Với sự cạnh tranh ngày càng gay gắt trên Internet
và do đặc tính của người dùng thường ít kiên nhẫn hơn trước
các tương tác trên website thì những người làm thương mại
điện tử càng cần phải chú ý để giúp cho khách hàng của mình
thuận tiện nhất trong quá trình mua hàng. Những kinh
nghiệm tôi trình bày dưới đây sẽ phần nào giúp các bạn thiết
kế form dễ dùng và thuận tiện hơn để phần nào đó tăng tỷ lệ
conversion của bạn.

1. Nên thiết kế để title và field càng gần nhau càng tốt.

Khi vào một form người dùng chỉ chú ý đến title(tiêu đề) và
field để trả lời, khoảng cách quá xa giữ title và field sẽ làm
cho người dùng cảm thấy khó chịu vì nó làm mắt của họ phải
dõi theo một khoảng cách dài để căn chỉnh sao cho không
lệch dòng.

Click vào đây để xem ảnh gốc.


Để đưa title và field lại gần nhau bạn có thể căn phải đối với
các title và căn trái với các field như vậy giữa các field và
title luôn giữ một khoảng cách cố định và đủ gần để người

dùng cảm thấy dễ chịu, tuy nhiên cách này có nhược điểm
khi title là một câu hỏi quá dài thì việc đọc đoạn text căn phải
sẽ gặp đôi chút khó khăn. Hoặc bạn cũng có thể dùng cách
đưa title lên trên các field, cách này được áp dụng ở nhiều
trang web nước ngoài nhưng ở Việt Nam thì không phổ biến
lắm.



2. Lựa chọn cách thể hiện các field bắt buộc cho phù hợp

Field bắt buộc là những field dữ liệu mà người dùng bắt buộc
phải nhập vào, khác với các field mà người dùng có thể nhập
hoặc không. Có nhiều cách thể hiện các field này phổ biến là:
dùng dấu sao, dùng chữ in đậm, …



Sau đây là lời khuyên của các chuyên gia khi thể hiện field
bắt buộc:
- Nên sử dụng dấu * hoặc chữ khác màu với các field bắt
buộc
- Dấu * để càng gần title càng tốt
- Không nên để dấu * ở đằng sau field
- Nếu tất cả các field đều là bắt buộc thì vẫn phải thể hiện dấu
*


Click vào đây để xem ảnh gốc.

Trên đây là ví dụ form đăng ký thành viên của 3 website:
textlink.vn, trananh.vn và lazada.vn chúng ta có thể thấy với
sự đầu tư bài bản cách thiết kế form của lazada rất hoàn hảo
làm cho người dùng dễ chịu hơn khi điền form. Hai site
textlink.vn và trananh.vn chưa chú trọng lắm đền UX nên
thiết kế của họ gặp đôi chút khó chịu cho người dùng


3. Nên phân chia các form theo các nhóm


Đối với những form quá dài thì chúng ta nên tách các field
thành các nhóm nhỏ, bởi vì tâm lý của con người khi nhìn
thấy một khối lượng công việc lớn sẽ cảm thấy nản, tuy nhiên
nếu tách khối lượng đó thành những nhóm nhỏ hơn thì họ sẽ
lại thấy bình thường. Vì vậy tách ra thành các nhóm field nhỏ
sẽ tạo cảm giác dễ chịu hơn cho người dùng.

Click vào đây để xem ảnh gốc.



4. Dùng Radio box hay combo box cho các field lựa chọn


Trong một form khi yêu cầu người dùng lựa chọn những giá
trị xác định chúng ta có 2 lựa chọn dùng Radio hay combo
box:

Click vào đây để xem ảnh gốc.

Field giới tính yêu cầu người dùng lựa chọn một trong 2 giá
trị: Nam hoặc Nữ, với 2 cách dùng như trên cách dùng Radio
box sẽ có lợi hơn vì người dùng chỉ mất 1 click đã có thể lựa
chọn, dùng combo box sẽ mất 2 click và nội dung lựa chọn
chỉ hiển thị sau khi click vào combo box, điều này làm mất
thêm 0.5 giây so với Radio box

Trong ví dụ khác khi yêu cầu người dùng lựa chọn tỉnh thành
cư trú:


Click vào đây để xem ảnh gốc.


Nếu dùng combo box người dùng sẽ click vào, nhập chữ cái
đầu tiên và lựa chọn tỉnh thành mình đang cư trú, nếu dùng
Radio box thì người dùng buộc phải tìm đến đúng tỉnh thành
của mình, việc này sẽ tương đối khó khăn và mất thời gian

Lời khuyên của các chuyên gia là khi số lượng giá trị lựa
chọn <5 thì bạn nên dùn Radio box, còn lớn hơn thì dùng
Combo box sẽ hiệu quả hơn


5. Lời kết

Có lẽ những vấn đề tôi trình bày trên đây nhiều bạn sẽ cho

rằng đó chỉ là những thứ vụn vặt. Những thứ vĩ đại nhất cũng
đều làm nên từ những chi tiết vụn vặt mà thôi, cả một chiếc ô
tô phức tạp thì cũng đều phải tạo nên từ những con ốc vít.
Nếu bạn chăm chút tỉ mỉ từng con ốc vít đó bạn sẽ tạo ra
được một chiếc xe Mercedes còn bạn coi con ốc vít chỉ là
một thứ vụn vặt không đáng quan tâm thì bạn sẽ chỉ tạo ra
được một con Matiz mà thôi. Về cơ bản thì Mercedes và
Matiz đều là những chiếc oto, đều bốn bánh và đều chạy bon
bon trên đường nhưng rõ ràng một con Mecedes thì giá trị
gấp hàng chục lần con Matiz của bạn. Hi vọng rằng với
những chia sẻ vừa rồi sẽ giúp các bạn cẩn thận hơn, khó tính
hơn với chính mình trong Design và xây dựng sản phẩm
không làm việc à uôm, dễ dãi theo kiểu Việt Nam nữa để
chúng ta có những sản phẩm đẳng cấp như những chiếc
Mecerdes .