เนื้อหา
- 1. อย่าทำเครื่องหมายฟิลด์บังคับ
- 2. อย่าใช้สปินเนอร์
- 3. มีปุ่มเพียงประเภทเดียวหรือดีกว่าเพียงปุ่มเดียวต่อแบบฟอร์ม
- 4. เขตข้อมูลก้อน
- 5. คิดว่าทำไมคุณถึงถามอะไรบางอย่างและรู้สึกอย่างไรกับผู้ใช้
- 6. วันที่เป็นเพื่อนตัวน้อยที่กระรอก
- 7. แบบฟอร์มเป็นงานฝีมือของนักพัฒนา
- 8. อย่าใช้คอลัมน์ในแบบฟอร์ม
- 9. อย่าใช้สองช่องเมื่อจะทำ
- 10. เป็นคนดี
แบบฟอร์มไม่มีอะไรที่นักออกแบบเกลียดมากไปกว่าแบบฟอร์ม พวกเขาไม่จำเป็นต้องดึงความคิดสร้างสรรค์ออกมาเสมอไปหรือ อาจถึงเวลาที่เราดูแบบฟอร์มอีกครั้งและเข้าใจว่าแบบฟอร์มพื้นฐานที่สุดคือการสนทนาระหว่างผู้ใช้และซอฟต์แวร์
ลืมชี้และคลิกแบบฟอร์มแสดงถึงปฏิสัมพันธ์ที่ร่ำรวยที่สุดที่เราในฐานะนักออกแบบดิจิทัลจะต้องเผชิญ ครั้งต่อไปที่แบบฟอร์มจะมาในแบบของคุณอย่าคิดว่ามันเป็นเพียงเรื่องของการใช้เอฟเฟกต์ CSS ที่ดีหรือการเพิ่ม jQuery ที่ดี การออกแบบฟอร์มมีความลึกมากขึ้น
ฉันได้ทดสอบผู้ใช้หลายร้อยรูปแบบและออกแบบรูปแบบที่ซับซ้อนสำหรับ บริษัท ประกันภัยการโต้ตอบการจองวันหยุดและอื่น ๆ อีกมากมาย มีโอกาสที่คุณจะใช้แบบฟอร์มของฉันในช่วงสองสามเดือนที่ผ่านมา
นี่คือบทเรียนที่ฉันต้องการเรียนรู้ก่อนที่จะเริ่มออกแบบฟอร์ม
1. อย่าทำเครื่องหมายฟิลด์บังคับ
คุณรู้จักเครื่องหมายดอกจันเล็ก ๆ ที่หมายถึงฟิลด์บังคับหรือไม่? ฉันพบว่าล้มเหลวหลายครั้งในการทดสอบผู้ใช้ ตามแนวคิดแล้วช่องที่ต้องบังคับไม่สมเหตุสมผลมากนัก แต่ก็ไม่มีความเท่าเทียมกันแบบออฟไลน์ เหมาะอย่างยิ่งสำหรับนักพัฒนาเพราะพวกเขาเสนอแนวทางขาวดำที่ดีในการทำให้เสร็จสมบูรณ์ เครื่องหมายดอกจันและฟิลด์บังคับล้มเหลวเนื่องจากเป็นพฤติกรรมที่เรียนรู้ พฤติกรรมโดยทั่วไปที่ฉันเห็นในการทดสอบผู้ใช้คือผู้ใช้กรอกแบบฟอร์มที่ด้านบนและเสร็จสิ้นเมื่อมีบางอย่างหยุดพวกเขาหรือกดปุ่ม
วิธีแก้ปัญหานั้นง่ายมากทำเครื่องหมายช่องที่ไม่บังคับทำเครื่องหมายสถานที่ที่ผู้ใช้ที่ดีของเราต้องหยุดและคิดว่าพวกเขาจำเป็นต้องกรอกข้อมูลในช่องนั้นหรือไม่
2. อย่าใช้สปินเนอร์
HTML5 นั้นยอดเยี่ยมใช่หรือไม่ มีเครื่องมือใหม่ที่น่าตื่นเต้นมากมายให้เล่นด้วย เราต้องคิดถึงความเหมาะสมของของเล่นใหม่ของเรา ตอนนี้ช่องตัวเลขมีลูกศรขึ้นและลงเล็กน้อยเพื่อให้ผู้ใช้เลื่อนดูตัวเลขได้
มีสองปัญหาที่นี่ ประการแรกการแสดงลูกศรเริ่มต้นของเบราว์เซอร์ทำให้มีขนาดเล็กมาก การคลิกที่ยุ่งเหยิงมากและคนที่มีไขมันในหมู่พวกเรากำลังจะต่อสู้กับ iPhone เรียกว่า Fitt’s Law ยิ่งบางสิ่งที่เล็กลงก็ยิ่งยากที่จะคลิก
แต่ฉันได้ยินเสียงคุณตะโกนคุณสามารถพิมพ์ตัวเลขลงในช่องตัวเลขได้โดยตรง ใช่คุณทำได้ แต่ลองดูที่หน้าจอของเบราว์เซอร์ลูกศรสปินเนอร์ขึ้น / ลงคล้ายกับเพื่อนที่ไว้ใจได้ของเราในช่องเลือก ผู้ใช้ที่นำเสนอด้วยสปินเนอร์เป็นครั้งแรกจะถือว่ามันมีลักษณะคล้ายกับกล่องเลือกซึ่งพวกเขาไม่สามารถพิมพ์ลงไปได้
คำแนะนำของฉันคือหลีกเลี่ยงความชัดเจนจนกว่าจะกลายเป็นสถานที่ทั่วไปมากขึ้นหรือนักพัฒนาเบราว์เซอร์จัดเรียงการออกแบบเริ่มต้นออก
3. มีปุ่มเพียงประเภทเดียวหรือดีกว่าเพียงปุ่มเดียวต่อแบบฟอร์ม
มีหลักการทางจิตวิทยาที่รู้จักกันน้อยเรียกว่ากฎหมายของฮิค กฎหมายของ Hick ระบุว่าเรามีตัวเลือกมากขึ้นเท่าไหร่ก็ยิ่งยากที่จะเลือก ไม่ใช่วิทยาศาสตร์จรวดที่ฉันรู้จัก แต่เป็นกฎที่ควรคำนึงถึง
คุณสามารถช่วยผู้ใช้ที่ดีของคุณได้โดยช่วยให้พวกเขาตัดสินใจเลือก การทำให้ปุ่มหลักทั้งหมดเป็นสีเดียวและการมีเพียงปุ่มเดียวต่อหน้าจะช่วยให้เลือกได้ง่ายขึ้น ปุ่มไหนที่ฉันควรจะกด? โอ้มันง่ายมากมันเป็นสีที่ยิ่งใหญ่
4. เขตข้อมูลก้อน
ฉันศึกษาเกี่ยวกับประสาทวิทยาศาสตร์ในชีวิตก่อนหน้านี้และศึกษาจิตวิทยาของความจำโดยเฉพาะในระยะสั้นหรือความจำในการทำงาน ตอนนี้ก่อนที่คุณจะพูด ไม่ความจุหน่วยความจำระยะสั้นไม่ใช่ 7 +/- 2, 4 +/- 1 หรือในมนุษย์พูดได้สามถึงห้าชิ้น เราในฐานะมนุษย์นั้นยอดเยี่ยมในการประเมินสิ่งเร้าทางสายตาข้อ จำกัด คือเราจะดีกว่าเมื่อจำนวนน้อยลง การแบ่งแบบฟอร์มเป็นกลุ่มเล็ก ๆ ทำให้การประเมินง่ายขึ้นเนื่องจากสิ่งที่ผู้ใช้ป้อนลงในแบบฟอร์มมักมาจากหน่วยความจำของพวกเขา
ตรวจสอบให้แน่ใจว่ากลุ่มฟิลด์ของคุณมีความยาวประมาณสี่ช่อง
5. คิดว่าทำไมคุณถึงถามอะไรบางอย่างและรู้สึกอย่างไรกับผู้ใช้
นี่อาจเป็นคำแนะนำที่ตรงไปตรงมาที่สุดที่ฉันให้ แต่มักใช้น้อยที่สุด
ลองดำเนินการดังต่อไปนี้:
ถามทุกคำถามที่คุณถาม จำเป็นมั้ย? รู้สึกอย่างไรที่ถูกถามเรื่องนี้?
บ่อยครั้งที่ธุรกิจจำเป็นต้องถามคำถามและเราในฐานะนักออกแบบสามารถโต้แย้งเกี่ยวกับความจำเป็นจนกว่าเราจะเป็นสีฟ้าต่อหน้า ต้องมีการถามคำถาม ในการทำความเข้าใจความต้องการทางธุรกิจสำหรับข้อมูลนี้เรามักจะประนีประนอมได้
เราสามารถช่วยได้โดยบอกผู้ใช้ที่ดีของเราว่าเหตุใดเราจึงต้องถามคำถามนั้น สร้างความมั่นใจเกี่ยวกับการใช้งานและการแบ่งปันข้อมูลและโดยทั่วไปจะดี
ยกตัวอย่างของเราอีกครั้ง:
ยังคงเป็นคำถามที่ยาก แต่หวังว่าเราจะทำให้เม็ดยามีรสหวาน
6. วันที่เป็นเพื่อนตัวน้อยที่กระรอก
การป้อนวันที่อาจเป็นความท้าทายที่แท้จริงและมีข้อผิดพลาดบางประการที่คุณสามารถหลีกเลี่ยงได้ ปัญหาเดียวที่ใหญ่ที่สุดคือการจัดการกับข้อผิดพลาด
วิธีที่ง่ายที่สุดคือการเปิดปฏิทิน เป็นที่น่าสังเกตว่าสัปดาห์เริ่มต้นในวันจันทร์ในสหราชอาณาจักรและวันอาทิตย์ในสหรัฐอเมริกา หากผู้ใช้ของคุณไม่จดจ่อผู้ใช้อาจเลือกวันอาทิตย์ที่หมายถึงวันจันทร์
นอกจากนี้ยังควรค่าแก่การกล่าวถึงรูปแบบวันที่ระหว่างประเทศด้วย สหรัฐอเมริกาวางอันดับหนึ่งเดือนแรกในญี่ปุ่นเป็นปีแรก ดังนั้นวันที่เช่น 4/5/12 สามารถตีความได้สามวิธี
นั่นเป็นเหตุผลที่ดีที่สุดที่จะใช้กล่องเลือก
7. แบบฟอร์มเป็นงานฝีมือของนักพัฒนา
แบบฟอร์มเป็นงานฝีมือสำหรับนักพัฒนาและนักออกแบบ การทำความเข้าใจเกี่ยวกับข้อผิดพลาดที่อาจเกิดขึ้นกับการป้อนข้อมูลและการออกแบบโค้ดส่วนหลังของคุณเพื่อรับมือถือเป็นความท้าทาย
นี่คือวิธีง่ายๆ การป้อนค่าสกุลเงิน ข้อผิดพลาดที่เป็นไปได้ที่ผู้ใช้อาจทำนั้นมีมาก การบังคับรูปแบบข้อมูลที่ผู้ใช้ต้องพบนั้นเป็นเรื่องที่น่าหงุดหงิดสำหรับผู้ใช้ของคุณและมาดูกันดีกว่าว่านักพัฒนาซอฟต์แวร์มักจะขี้เกียจเล็กน้อย
อะไรจะท้าทายดีไปกว่าการสร้างแบบฟอร์มกันกระสุน
8. อย่าใช้คอลัมน์ในแบบฟอร์ม
ปัญหาใหญ่ในการใช้คอลัมน์ในฟอร์มคือโฟลว์ เราเริ่มแบบฟอร์มที่ด้านบนและสิ้นสุดที่ด้านล่าง ในการแนะนำคอลัมน์โฟลว์ของฟอร์มอาจเสียได้
อย่าถือว่าผู้ใช้แท็บผ่านฟอร์มดังนั้นการโฟกัสจึงเป็นวิธีการนำทางแบบฟอร์มในคอลัมน์ เป็นเรื่องยากที่ฉันจะเห็นสิ่งนั้นในการทดสอบผู้ใช้ เวลาส่วนใหญ่ที่เราเห็นป้อนรายละเอียดให้คลิกไปที่ฟิลด์ถัดไปด้วยเมาส์ / แทร็กแพด / นิ้วจากนั้นป้อนรายละเอียดและอื่น ๆ
9. อย่าใช้สองช่องเมื่อจะทำ
คนส่วนใหญ่ไม่ใช่นักพิมพ์สัมผัส ในการทดสอบผู้ใช้เราจะเห็นผู้คนมองไปที่แป้นพิมพ์ขณะที่พวกเขาพิมพ์
เมื่อป้อนหมายเลขโทรศัพท์โดยแยกฟิลด์แบบฟอร์มกล่าวว่าให้เพิ่มรหัสพื้นที่และหมายเลขทำให้เกิดปัญหาจริง ผู้ใช้ไม่เห็นหรือจำไม่ได้ว่ามีสองช่องดังนั้นให้ป้อนตัวเลขเต็มในช่องแรกยิ่งไปกว่านั้นหากช่องนั้น จำกัด อักขระจำนวนหนึ่ง
ใช้เพียงช่องเดียวสำหรับหมายเลขโทรศัพท์เช่นเดียวกับหมายเลขบ้าน / ถนน - ใช้ช่องป้อนข้อความเพียงช่องเดียว
10. เป็นคนดี
คุณต้องแปลกใจเกี่ยวกับจำนวนข้อความแสดงข้อผิดพลาดที่ค่อนข้างหยาบคายในนั้น
นี่คือตัวอย่างหนึ่งที่ฉันพบเมื่อไม่นานมานี้
ความจริงที่พวกเขาแนะนำว่าคุณเต็มใจที่จะป้อนวันที่ในอนาคตและจากนั้นก็ตอบสนองที่ค่อนข้างชัดเจนมันก็ไม่ดีเท่าไหร่
นำตัวเองไปแทนที่ผู้ใช้อีกครั้งคุณจะรู้สึกอย่างไรเมื่อเห็นข้อผิดพลาดนี้ รำคาญ? อาจจะแย่กว่าด้วยซ้ำ. การเป็นคนดีเป็นเรื่องง่าย
ฉันได้สร้างคริปโต / ชีตที่สามารถดาวน์โหลดได้เพื่อช่วยให้คุณออกแบบฟอร์มได้ดีขึ้น ซึ่งรวมถึงแนวทางปฏิบัติที่ดีที่สุดอีกมากมายในการออกแบบฟอร์มที่ดีขึ้น