ปุ่มในการจำลองมักจะแสดงสถานะเดียว: ค่าเริ่มต้น ในผลิตภัณฑ์จริง ปุ่มเดียวกันนี้จะถูกโฮเวอร์ โดยเน้นด้วยคีย์บอร์ด กด ปิดการใช้งานในขณะที่แบบฟอร์มไม่สมบูรณ์ และโหลดในขณะที่ส่งคำขอ แต่ละสถานะนั้นเป็นสถานะ UI และแต่ละรายการจำเป็นต้องมีการออกแบบ
ช่วยแยกสองกลุ่มออกจากกัน สถานะการโต้ตอบมาจากผู้ใช้: โฮเวอร์ โฟกัส กด และปิดใช้งาน สถานะของข้อมูลมาจากระบบ: กำลังโหลด, ว่างเปล่า, ข้อมูลบางส่วน, ข้อผิดพลาด และความสำเร็จ ตัวอย่างเช่น หน้าจอรายการจำเป็นต้องมีการออกแบบเมื่อกำลังโหลด เมื่อไม่มีรายการ เมื่อมีรายการเดียว เมื่อมีหลายร้อย และเมื่อคำขอล้มเหลว
รัฐโฟกัสสมควรได้รับความสนใจเป็นพิเศษ ผู้ที่ใช้แป้นพิมพ์หรืออุปกรณ์สลับจะขึ้นอยู่กับตัวแสดงโฟกัสที่มองเห็นได้เพื่อทราบว่าตนอยู่ที่ไหน การลบโครงร่างโฟกัสของเบราว์เซอร์ออกโดยไม่มีการเปลี่ยนใหม่ถือเป็นหนึ่งในความล้มเหลวในการเข้าถึงที่พบบ่อยที่สุด
การเปลี่ยนแปลงระหว่างสถานะก็เป็นส่วนหนึ่งของการออกแบบเช่นกัน การเปลี่ยนจากค่าเริ่มต้นเป็นการกดอย่างชัดเจนสั้นๆ จะเป็นการยืนยันการแตะ สถานะการโหลดที่เปลี่ยนเป็นความสำเร็จอย่างราบรื่นจะบอกผู้คนว่าการกระทำของพวกเขาได้ผล การกระโดดกะทันหันหรือภาพเคลื่อนไหวที่ช้าเกินไปทำให้อินเทอร์เฟซดูไม่น่าเชื่อถือ
วิธีปฏิบัติเพื่อหลีกเลี่ยงสถานะที่หายไปคือการแสดงรายการสถานะสำหรับแต่ละส่วนประกอบก่อนออกแบบ หรือสร้างแบบจำลองส่วนประกอบเป็นเครื่องสถานะ: ชุดของสถานะและเหตุการณ์ที่ย้ายไปมาระหว่างสถานะเหล่านั้น ExodeUI ซึ่งเราสร้างขึ้นนั้นทำงานในลักษณะนี้ คุณออกแบบแต่ละสถานะและการเปลี่ยนระหว่างสถานะเหล่านั้นในไฟล์เดียว และโค้ดของคุณจะส่งเหตุการณ์ที่เปลี่ยนสถานะในแอปจริง