Thư viện thuật ngữ / UI/UX

Trạng thái tương tác là gì?

Còn gọi: hover, focus, active, disabled, hover state, focus state, active state, disabled state

Trạng thái tương tác là các hình thức khác nhau của một phần tử giao diện tuỳ theo người dùng đang làm gì với nó: mặc định, di chuột qua (hover), được chọn bằng bàn phím (focus), đang bấm (active), bị vô hiệu (disabled), đang tải.

Ảnh minh hoạ Trạng thái tương tác (hover, focus, active, disabled): một nút ở 6 trạng thái xếp hàng ngang, hover, focus, active, disabled, loading
Một nút ở 6 trạng thái xếp hàng ngang, hover, focus, active, disabled, loading

Hiểu kỹ hơn

Thiết kế đủ trạng thái giúp người dùng biết phần tử có bấm được không và hệ thống đã nhận thao tác chưa. Trạng thái focus đặc biệt quan trọng với người dùng bàn phím và trình đọc màn hình; không được xoá viền focus mà không thay bằng dấu hiệu khác. Trên điện thoại không có hover, nên không giấu thông tin quan trọng sau hover. Trong Figma, các trạng thái thường làm bằng variants của component.