8 เคล็ดลับที่เป็นประโยชน์สำหรับ UX ที่ดีขึ้นใน Flutter

แอปของคุณอาจทำงานได้อย่างสมบูรณ์แบบ เร็วเป็นบ้า ไม่มีข้อยกเว้น ไม่มีข้อผิดพลาด ไม่มีข้อขัดข้อง ตามที่คาดไว้ แต่ถ้าคุณไม่มอบประสบการณ์ที่ราบรื่นและเป็นประโยชน์แก่ผู้ใช้ ผลิตภัณฑ์ของคุณจะเป็นแอปธรรมดา ไม่ใช่แอปที่ยอดเยี่ยม ที่แย่ไปกว่านั้น ผู้ใช้อาจไม่พอใจกับประสบการณ์ที่ได้รับและคลั่งไคล้เมื่อเวลาผ่านไป
(เช่น ไม่ปิดแป้นพิมพ์หลังจากคลิกปุ่มค้นหา)
ดังนั้นมาทำให้แอปของเราโดดเด่นกันเถอะ!
1. ทำให้วิดเจ็ตที่เลื่อนได้ของคุณสามารถเลื่อนได้เสมอ
BouncingScrollPhysicsยอดเยี่ยมมาก! แต่ถ้าเราไม่มีของมากพอที่จะขยายให้เกินมุมมอง มันก็ไม่เด้งเลย มันสมเหตุสมผลแล้วจริงๆ
แต่ถ้าเราต้องการรีเฟรชรายการล่ะ
ในการสร้างเอฟเฟกต์การตีกลับ/การเลื่อนเกินโดยไม่คำนึงถึงขนาดของรายการ เราควรใช้ AlwaysScrollableScrollPhysics ร่วมกับมัน

2. โฟกัสอัตโนมัติเมื่อเปิด
บางครั้งเราต้องการใช้หน้าเพื่อกรอกช่องข้อความเท่านั้น
อาจเป็นช่องค้นหาหรืออีเมลก็ได้ เราต้องการโฟกัสทันทีที่เปิดขึ้นเพราะเรารู้ว่าผู้ใช้จะโฟกัสไปที่จุดนั้นในที่สุด ดังนั้นทำไมผู้ใช้ต้องรบกวนผู้ใช้ด้วยการแตะที่ช่องข้อความเพิ่มเติม

3. ตรวจสอบให้แน่ใจว่าช่องข้อความสามารถมองเห็นได้
สมมติว่าเรามีแบบฟอร์มและจำเป็นต้องตรวจสอบข้อมูลบางอย่าง ผู้ใช้จะคลิกที่ปุ่มส่ง แต่เดี๋ยวก่อน ปุ่มไม่ทำงานเนื่องจากบางฟิลด์ไม่ได้รับการตรวจสอบ
ผู้ใช้อาจไม่เข้าใจเนื่องจากฟิลด์เหล่านี้ไม่ปรากฏบนหน้าจอในขณะนั้น นั่นอาจทำให้เกิดประสบการณ์ที่ไม่น่าพึงพอใจ
แต่ไม่ต้องกังวล การป้องกันทำได้ง่ายมาก! ถ้าอย่างนั้นเรามาดูกันเลย!

4. โฟกัสที่วิดเจ็ตถัดไปเมื่อป้อนหรือส่ง
อันนั้นค่อนข้างตรงไปตรงมา คุณพิมพ์ชื่อของคุณและต้องการไปที่ช่องข้อความที่สองเมื่อกด Enter เป็นสิ่งที่ทุกคนคาดหวัง และพวกเขาก็ควรได้รับเช่นกัน!

ฉันยังสังเกตเห็นบางอย่าง: หลายคนใช้ FocusNode สำหรับสิ่งนั้น ไม่มีอะไรผิดปกติกับ FocusNode แต่เราก็ไม่ต้องการสิ่งนั้นเช่นกัน เราสามารถตั้งค่า textInputAction ได้ง่ายๆ และเริ่มกันเลย! การใช้ FocusNode เป็นขั้นตอนพิเศษที่เราไม่ต้องการ
5. จำตำแหน่งเลื่อน
สมมติว่าคุณกำลังเลื่อนหน้าและคลิกที่การ์ดเพื่อดูรายละเอียดหรือเปลี่ยนไปใช้แท็บอื่น จากนั้นกลับไปที่รายการอีกครั้ง แต่คุณเห็นว่าตำแหน่งนั้นถูกรีเซ็ต และคุณต้องเริ่มต้นใหม่อีกครั้ง! ช่างเป็นหายนะ!

6. แตะอีกครั้งเพื่อออก
ผู้ใช้ Android อาจเผลอคลิกปุ่มย้อนกลับในขณะที่อยู่ในหน้าแรก และแอปจะไปที่พื้นหลังทันที
นั่นจะเป็นประสบการณ์ที่ดีสำหรับพวกเขาหรือไม่?
ฉันจะทิ้งคำถามนี้ไว้ให้คุณคนเดียวและแสดงให้คุณเห็นว่าคุณสามารถป้องกันไม่ให้สิ่งนี้เกิดขึ้นได้อย่างไร!
(ขออภัยสำหรับตัวอย่างที่ไม่ดี ฉันขี้เกียจเกินไปที่จะเปลี่ยนไปใช้โปรแกรมจำลอง Android เพื่อสาธิตเคสด้วยปุ่มย้อนกลับ)

7. เลิกโฟกัสที่การเลื่อน
เราพิมพ์ เราป้อน และเราต้องการให้แป้นพิมพ์ปล่อยให้เราอยู่กับเนื้อหาตามลำพัง นั่นคือทั้งหมดที่เราต้องการ! โปรดอย่าไว้ชีวิตเรา!

8. เลิกสนใจเทปข้างนอก
หากเราไม่ต้องการทำให้ผู้ใช้คลั่งไคล้ เราควรปล่อยให้พวกเขาปิดแป้นพิมพ์เมื่อพวกเขาแตะนอกช่องข้อความ

สุดท้ายนี้
ไม่มีเวทย์มนตร์เป็นเพียงรายละเอียดเล็ก ๆ น้อย ๆ
ใส่ใจรายละเอียดเล็กๆ น้อยๆ จนคนคิดว่าคุณเป็นผู้วิเศษ!
- นักมายากล
โครงการ Github
รับไปปรบมือรัวๆ!
ขอบคุณสำหรับการอ่าน!
ฉันคิดว่าฉันจะขยายบทความนี้เป็นชุด
คุณสามารถติดตามฉันและติดตามข่าวสารเกี่ยวกับส่วนใหม่ได้!
โปรดอย่าลืมคลิกที่ปุ่ม และขอให้มีวันที่สดใส!