Nút trong mô hình thường hiển thị một trạng thái: mặc định. Trong sản phẩm thực, nút tương tự được di chuột, tập trung bằng bàn phím, được nhấn, tắt khi biểu mẫu chưa hoàn tất và tải trong khi yêu cầu được gửi. Mỗi trạng thái đó là một trạng thái giao diện người dùng và mỗi trạng thái đó đều cần một thiết kế.
Nó giúp tách hai nhóm. Các trạng thái tương tác đến từ người dùng: di chuột, lấy nét, nhấn và tắt. Các trạng thái dữ liệu đến từ hệ thống: đang tải, trống, dữ liệu một phần, lỗi và thành công. Ví dụ: một màn hình danh sách cần thiết kế khi nó đang tải, khi nó không có mục nào, khi nó có một mục, khi nó có hàng trăm mục và khi yêu cầu không thành công.
Các trạng thái tập trung đáng được quan tâm đặc biệt. Những người sử dụng bàn phím hoặc thiết bị chuyển mạch sẽ dựa vào chỉ báo tiêu điểm hiển thị để biết họ đang ở đâu. Xóa phác thảo tiêu điểm của trình duyệt mà không thay thế là một trong những lỗi trợ năng phổ biến nhất.
Sự thay đổi giữa các trạng thái cũng là một phần của thiết kế. Một quá trình chuyển đổi ngắn, rõ ràng từ mặc định sang nhấn sẽ xác nhận thao tác nhấn. Trạng thái tải chuyển dần sang thành công cho mọi người biết hành động của họ đã thành công. Nhảy đột ngột hoặc hoạt ảnh quá chậm khiến giao diện có cảm giác không đáng tin cậy.
Một cách thực tế để tránh thiếu các trạng thái là liệt kê chúng cho từng thành phần trước khi thiết kế hoặc lập mô hình thành phần đó như một máy trạng thái: một tập hợp các trạng thái và các sự kiện di chuyển giữa chúng. ExodeUI do chúng tôi tạo ra hoạt động theo cách này. Bạn thiết kế từng trạng thái và chuyển đổi giữa chúng trong một tệp, đồng thời mã của bạn sẽ gửi các sự kiện chuyển đổi trạng thái trong ứng dụng thực.