Tiếp tục nối tiếp series cải thiện UI – cải thiện trải nghiệm người dùng. Mình sẽ chia sẻ các thủ thuật giúp cải thiện kĩ năng UI của bạn, cũng như cải thiện trải nghiệm người dùng trên chính các website của các bạn tạo ra.
Nếu như các bạn chưa xem Cải thiện UI – cải thiện trải nghiệm người dùng (Phần 1) thì hãy xem nhé, hi vọng nó sẽ giúp ích cho bạn
Giờ thì bắt đầu thôi !!!
1. Đừng ẩn các thông báo nhỏ bằng icon
Sử dụng icon để hiển thị thông báo cho người dùng nhập form sao cho hợp lý. Giải pháp này giúp cho UI gọn gàng hơn và khoảng cách giữa các input không quá xa.
Nhưng khoảng cách giữa các input thường không phải là vấn đề lớn.
Chúng ta có thể hiển thị chữ (có font-size nhỏ hơn font-size input) thông báo ở ngay dưới form. Đây là một giải pháp mà tôi đánh giá rất cao, giúp người dùng điền form nhanh, chính xác hơn.
2. Đừng để cho label quá xa với input
Nếu để quá xa, mắt người dùng thường có xu hướng di chuyển theo dạng “zic zac”.
Điều này đôi lúc sẽ khiến cho người dùng mỏi mắt và dễ điền nhầm vào ô input nào đó.
3. Hiển thị các điều kiện khi tạo password một cách cụ thể
Hẳn các bạn đã từng nhìn hoặc đã từng làm input password không có điều kiện nào, hoặc điều kiện được liệt kê ra như “Mật khẩu từ 6 đến 36 ký tự, có một chữ hoa, 1 ký tự đặc biệt,…”.
Trông có vẻ bình thường nhỉ, nhưng tin tôi đi, có bao nhiêu người phải nhập lại password khác để có thể thỏa điều kiện. Thay vào đó mình có thể liệt kê các điều kiện để người dùng có thể nắm bắt các rule, cũng như tạo password thật nhanh chóng.
Đồng ý là nó sẽ chiếm một khoảng kha khá diện tích, nhưng theo tôi nó không là vấn đề. Tôi đoán người dùng sẽ rất thích form của bạn đấy.
4. Yêu cầu quá nhiều trường trong lần đăng ký đầu tiên
Hãy chọn những trường thật sự bạn cần người dùng nhập. Những trường khác bạn có thể cho người dùng cập nhật sau ở thông tin tài khoản, hay thông tin người dùng.
Điều này sẽ tiết kiệm được kha khá thời gian nhập form đấy. Đừng để người dùng có cảm giác nản lòng khi điền form của bạn.
5. Đặt độ rộng của input sao cho hợp lý
Đừng mặc định để độ rộng của input luôn luôn 100%. Độ rộng của input có thể quyết định được nội dung mà bạn mong chờ từ người dùng.
Ví dụ như Zip Code hay Phone Number ở hình dưới không bao giờ đến 30, 50 ký tự cả. Nên không nhất thiết phải đặt độ rộng là 100%.
6. Đừng sử dụng placeholder thay thế label
Nếu sử dụng placeholder thì khi người dùng điền vào form, đôi lúc họ quên mất cái ô input đang điền này là gì. Thế là họ phải xóa nội dung đã điền để xem, rất mất công đúng không.
Thế chả nhẽ không dùng placeholder mãi ? Không. Bạn có thể sử dụng placeholder hiển thị mẫu nhập input, hoặc ghi các rule ngắn cho ô input ấy, …
Ở trường hợp đặc biệt, khi mà bạn chỉ có 2 cái input (ví dụ như đăng nhập), thì bạn cũng có thể sử dụng placeholder để thay thế label.
Nhưng theo tôi, bạn nên tạo thói quen sử dụng label để cho đỡ bị phân tâm. Thói quen rất tốt, tại sao không luyện tập chứ.
7. Hãy focus vào input đầu tiên khi lần đầu mở form
Một thứ rất nhỏ thôi nhưng lại làm tăng trải nghiệm người dùng đáng kể. Không phải nói nhiều, đây là điều người dùng cần nhất khi bắt đầu điền bất kỳ form nào.
8. Auto Scroll và Focus đến cái form có lỗi đầu tiên
Khi form quá dài thì lúc người dùng scroll xuống để submit form và một vài input ở trên cùng đang điền sai nhưng người dùng không nhìn thấy chúng.
Nên lúc đó hãy scroll lên tới cái input đang điền sai đầu tiên và hãy focus nó. Điều này làm tăng tính trải nghiệm đáng kể đấy.
