แสดงตัวเลือก
รหัสกำหนดวิธีการโหลดกล่องโต้ตอบลงในหน่วยความจำและแสดงผล ตารางต่อไปนี้อธิบายงานการแสดงผลประเภทต่างๆ และคำสำคัญที่ใช้ในการดำเนินการ
วิธีการแสดงจะโหลดแบบฟอร์มและตั้งค่าคุณสมบัติที่มองเห็นได้เป็น True พารามิเตอร์ที่ส่งผ่านไปยังวิธีการแสดงจะระบุชนิดของกล่องโต้ตอบ หากละเว้นพารามิเตอร์สไตล์หรือตั้งค่าเป็น vbModeless หรือ 0 (ค่าเริ่มต้น) กล่องโต้ตอบจะไม่มีโหมด หากพารามิเตอร์สไตล์เป็น vbModal หรือ 1 กล่องโต้ตอบจะเป็นโมดอล
เมื่อเลือก "ตกลง" หรือ "ยกเลิก" เพื่อออกจากกล่องโต้ตอบ คุณสามารถใช้คำสั่ง Unload หรือวิธีซ่อนได้ ตัวอย่างเช่น:
ยกเลิกการโหลดจากเกี่ยวกับ
-หรือ-
จากเกี่ยวกับซ่อน
คำสั่ง Unload จะลบกล่องโต้ตอบออกจากหน่วยความจำ ในขณะที่วิธี Hide จะลบออกจากหน้าต่างโดยการตั้งค่าคุณสมบัติ Visible ของกล่องโต้ตอบเป็น False เมื่อยกเลิกการโหลดแบบฟอร์ม ตัวแบบฟอร์มเองและตัวควบคุมของแบบฟอร์มจะถูกยกเลิกการโหลดจากหน่วยความจำ (รวมถึงตัวควบคุมใดๆ ที่ถูกโหลด ณ รันไทม์) เมื่อแบบฟอร์มถูกซ่อน แบบฟอร์มและตัวควบคุมจะยังคงอยู่ในหน่วยความจำ เมื่อคุณต้องการประหยัดพื้นที่หน่วยความจำ วิธีที่ดีที่สุดคือยกเลิกการโหลดแบบฟอร์ม เนื่องจากการยกเลิกการโหลดแบบฟอร์มจะทำให้หน่วยความจำว่าง หากคุณใช้กล่องโต้ตอบบ่อยๆ คุณสามารถเลือกที่จะซ่อนแบบฟอร์มได้ การซ่อนแบบฟอร์มยังคงสามารถเก็บข้อมูลใดๆ ที่เกี่ยวข้องได้ รวมถึงค่าคุณสมบัติ สิ่งพิมพ์ และการควบคุมที่สร้างขึ้นแบบไดนามิก หลังจากซ่อนแบบฟอร์มแล้ว คุณสามารถอ้างอิงคุณสมบัติและการควบคุมของแบบฟอร์มที่ซ่อนจากโค้ดต่อไปได้
การออกแบบจอแสดงผลประเภทต่างๆ
Microsoft Windows เป็นอุปกรณ์ที่ไม่ขึ้นอยู่กับอุปกรณ์ - แอปพลิเคชันแบบหน้าต่างสามารถทำงานบนคอมพิวเตอร์หลายเครื่องที่มีความละเอียดในการแสดงผลและความเข้มของสีที่แตกต่างกัน ในทำนองเดียวกัน แอปพลิเคชันที่เขียนด้วย Visual Basic จะทำงานบนจอภาพประเภทต่างๆ และจำเป็นต้องคำนึงถึงสิ่งนี้เมื่อออกแบบแอปพลิเคชัน
ออกแบบแบบฟอร์มที่ไม่ขึ้นอยู่กับความละเอียด
ตามค่าเริ่มต้น Microsoft Visual Basic จะไม่เปลี่ยนขนาดของฟอร์มและตัวควบคุมเมื่อเปลี่ยนความละเอียดของหน้าจอ ซึ่งหมายความว่าแบบฟอร์มที่ออกแบบบนหน้าจอที่มีความละเอียด 1024×768 จะขยายเกินขอบเขตของหน้าจอเมื่อทำงานบนหน้าจอที่มีความละเอียด 640×480 ถ้าคุณต้องการสร้างฟอร์มและตัวควบคุมที่มีสัดส่วนเดียวกันโดยไม่คำนึงถึงความละเอียดของหน้าจอที่ใช้ คุณต้องออกแบบฟอร์มที่ความละเอียดต่ำสุดหรือเพิ่มโค้ดที่เปลี่ยนฟอร์มให้กับโปรแกรมของคุณ
วิธีที่ง่ายที่สุดในการหลีกเลี่ยงปัญหาเรื่องขนาดคือการออกแบบแบบฟอร์มที่ความละเอียด 640×480 หากคุณต้องการทำงานที่ความละเอียดสูงกว่า คุณยังต้องพิจารณาว่าแบบฟอร์มจะปรากฏที่ความละเอียดต่ำกว่าอย่างไร วิธีดำเนินการคือใช้หน้าต่าง "FormLayout" เพื่อดูตัวอย่างขนาดและตำแหน่งของแบบฟอร์ม คุณยังสามารถใช้ "ResolutionGuides" เพื่อดูว่าส่วนใดของหน้าจอที่มองเห็นได้ด้วยความละเอียดต่ำ หากต้องการเปลี่ยนไปใช้ "ResolutionGuides" คุณสามารถคลิกขวาที่เมาส์ในหน้าต่าง "FormLayout" และเลือกรายการเมนู "ResolutionGuides" จากเมนูป๊อปอัป
ณ รันไทม์ Visual Basic จะวางฟอร์มตามตำแหน่งเวลาออกแบบ หากคุณออกแบบให้ทำงานที่ความละเอียด 1024×768 และวางแบบฟอร์มไว้ที่มุมขวาล่างของหน้าจอ แบบฟอร์มอาจไม่สามารถมองเห็นได้เมื่อรันที่ความละเอียดต่ำกว่า เพื่อหลีกเลี่ยงสถานการณ์นี้ คุณสามารถเลือกรายการเมนู "StartupPosition" จากเมนูป๊อปอัปของหน้าต่าง "FormLayout" เพื่อกำหนดตำแหน่งเริ่มต้นของแบบฟอร์มระหว่างการออกแบบ ในทำนองเดียวกัน คุณสามารถกำหนดตำแหน่งของแบบฟอร์ม ณ รันไทม์ได้โดยใช้โค้ดต่อไปนี้ในเหตุการณ์ FormLoad:
PRivateSubForm_Load()
ฉันย้าย0,0
สิ้นสุดย่อย
แม้ว่าการตั้งค่าคุณสมบัติด้านซ้ายและด้านบนของฟอร์มเป็น 0 อาจให้ผลเหมือนกัน แต่วิธีการย้ายสามารถดำเนินการให้เสร็จสิ้นได้ในขั้นตอนเดียว
Visual Basic ใช้หน่วยการวัดที่ไม่ขึ้นกับอุปกรณ์ นั่นคือ twip ซึ่งเป็นหน่วยที่ใช้ในการคำนวณขนาดและตำแหน่ง คุณสมบัติสองประการของวัตถุ Screen คือ TwipsPerPixelX และ TwipsPerPixelY สามารถใช้เพื่อกำหนดขนาดการแสดงผลขณะรันไทม์ การใช้คุณสมบัติเหล่านี้ คุณสามารถเขียนโค้ดเพื่อปรับขนาดและตำแหน่งของฟอร์มและตัวควบคุมได้
การควบคุมชุดย่อยส่วนตัว()
DimXAsInteger
DimYAsInteger
X=หน้าจอTwipsPerPixelX
Y=หน้าจอTwipsPerPixelY
SelectCaseX,Y
กรณีที่15,15
'ปรับขนาดและย้ายการควบคุม
txtName.Height=200
txtName.Width=500
txtName.Move200,200
'เพิ่มโค้ดที่เขียนขึ้นสำหรับการแก้ปัญหาอื่นๆ'
-
สิ้นสุดย่อย
คุณต้องทราบตำแหน่งของหน้าต่างของ Visual Basic ในขณะออกแบบด้วย หากคุณย้ายหน้าต่างโปรเจ็กต์ไปทางด้านขวาของหน้าจอด้วยความละเอียดสูง คุณจะพบว่าไม่สามารถเข้าถึงได้อีกต่อไปเมื่อคุณเปิดโปรเจ็กต์ด้วยความละเอียดต่ำ
ออกแบบความเข้มข้นของสีที่แตกต่างกัน
เมื่อออกแบบแอปพลิเคชัน คุณยังต้องพิจารณาความสามารถในการแสดงสีที่เป็นไปได้ของคอมพิวเตอร์ที่รันแอปพลิเคชันนั้นด้วย คอมพิวเตอร์บางเครื่องสามารถแสดงสีได้ 256 สีขึ้นไป ในขณะที่บางเครื่องสามารถแสดงสีได้เพียง 16 สีเท่านั้น หากคุณออกแบบแบบฟอร์มโดยใช้จานสี 256 สี การปรับสี (วิธีการจำลองสีที่ไม่ถูกต้อง) จะทำให้องค์ประกอบบางอย่างบนแบบฟอร์มหายไปเมื่อแสดงบน 16 สี
เพื่อหลีกเลี่ยงปัญหานี้ วิธีที่ดีที่สุดคือจำกัดสีที่แอปพลิเคชันของคุณใช้ให้เป็นสีมาตรฐาน 16 สีของ Windows สีเหล่านี้แสดงด้วยค่าคงที่สีของ Visual Basic (เช่น vbBlack, vbBlue, vbCyan เป็นต้น) หากคุณต้องการใช้มากกว่า 16 สีในแอปพลิเคชันของคุณ คุณยังควรใช้สีมาตรฐานสำหรับข้อความ ปุ่ม และองค์ประกอบอินเทอร์เฟซอื่นๆ
ออกแบบโดยคำนึงถึงผู้ใช้เป็นหลัก
เว้นแต่ว่าคุณสร้างแอปพลิเคชัน Visual Basic สำหรับการใช้งานของคุณเองเท่านั้น ผู้อื่นจะประเมินมูลค่าของการสร้างของคุณได้เท่านั้น อินเทอร์เฟซผู้ใช้ของแอปพลิเคชันมีผลกระทบอย่างมากต่อผู้ใช้ ไม่ว่าโค้ดจะยอดเยี่ยมทางเทคนิคเพียงใด หรือได้รับการปรับให้เหมาะสมเพียงใด หากผู้ใช้พบว่าแอปพลิเคชันนั้นใช้งานยาก พวกเขาก็มีโอกาสน้อยที่จะยอมรับแอปพลิเคชันนั้นได้ดี
ในฐานะโปรแกรมเมอร์ ไม่ต้องสงสัยเลยว่าคุณคุ้นเคยกับเทคโนโลยีคอมพิวเตอร์เป็นอย่างดี เป็นเรื่องง่ายที่จะลืมว่าผู้ใช้ส่วนใหญ่ไม่เข้าใจ (และอาจไม่สนใจ) เทคโนโลยีที่ซ่อนอยู่เบื้องหลังแอปพลิเคชัน คิดว่าแอปพลิเคชันเป็นเครื่องมือสำหรับปลายทาง: วิธีหนึ่งในการทำงานให้สำเร็จง่ายกว่าจินตนาการหากไม่ได้รับความช่วยเหลือจากคอมพิวเตอร์
อินเทอร์เฟซผู้ใช้ที่ออกแบบมาอย่างดีจะแยกผู้ใช้ออกจากเทคโนโลยีพื้นฐาน ทำให้ง่ายต่อการทำงานที่ต้องการให้เสร็จสิ้น เมื่อออกแบบอินเทอร์เฟซผู้ใช้ของแอปพลิเคชัน คุณต้องคำนึงถึงผู้ใช้อยู่เสมอ คุณจะค้นพบคุณสมบัติต่าง ๆ ของแอปพลิเคชันได้อย่างไรโดยไม่มีคำแนะนำ แอปพลิเคชันตอบสนองอย่างไรเมื่อเกิดข้อผิดพลาด คำตอบสำหรับคำถามเหล่านี้มีอะไรบ้าง รวมถึงปัญหาอื่นๆ ที่เกี่ยวข้องกับการออกแบบที่เน้นผู้ใช้เป็นศูนย์กลาง จะกล่าวถึงในส่วนนี้
พื้นฐานของการออกแบบอินเทอร์เฟซ
คุณไม่จำเป็นต้องเป็นศิลปินเพื่อสร้างอินเทอร์เฟซผู้ใช้ หลักการส่วนใหญ่ของการออกแบบอินเทอร์เฟซผู้ใช้จะเหมือนกับหลักการออกแบบพื้นฐานที่สอนในชั้นเรียนศิลปะเบื้องต้น หลักการออกแบบพื้นฐานของการจัดองค์ประกอบ สี ฯลฯ ใช้ได้กับหน้าจอคอมพิวเตอร์เช่นเดียวกับที่ใช้กับกระดาษหรือภาพวาด
แม้ว่า Visual Basic จะทำให้การสร้างส่วนต่อประสานกับผู้ใช้เป็นเรื่องง่ายเพียงแค่ลากและวางตัวควบคุมบนแบบฟอร์ม แต่การวางแผนเล็กน้อยก่อนการออกแบบสามารถสร้างความแตกต่างอย่างมากในการใช้งานแอปพลิเคชันของคุณ คุณอาจต้องการเริ่มออกแบบโดยการวาดแบบฟอร์มบนกระดาษ ตัดสินใจว่าจำเป็นต้องใช้ตัวควบคุมใด ความสำคัญสัมพัทธ์ขององค์ประกอบต่างๆ และความสัมพันธ์ระหว่างตัวควบคุม
ส่วนประกอบ: รูปลักษณ์และความรู้สึกของการใช้งานของคุณ
องค์ประกอบหรือเลย์เอาต์ของแบบฟอร์มไม่เพียงส่งผลต่อความสวยงามเท่านั้น แต่ยังส่งผลกระทบอย่างมากต่อการใช้งานแอปพลิเคชันอีกด้วย องค์ประกอบรวมถึงปัจจัยต่างๆ เช่น การวางตำแหน่งการควบคุม ความสอดคล้องขององค์ประกอบ การเคลื่อนไหว การใช้พื้นที่สีขาว และความเรียบง่ายของการออกแบบ
ตำแหน่งของการควบคุม
ในการออกแบบอินเทอร์เฟซส่วนใหญ่ องค์ประกอบทั้งหมดไม่ได้มีความสำคัญเท่ากัน การออกแบบอย่างระมัดระวังเป็นสิ่งจำเป็นเพื่อให้แน่ใจว่าองค์ประกอบที่สำคัญกว่าปรากฏต่อผู้ใช้อย่างรวดเร็ว องค์ประกอบที่สำคัญหรือเข้าถึงบ่อยควรวางในตำแหน่งที่โดดเด่น ในขณะที่องค์ประกอบที่สำคัญน้อยกว่าควรถูกลดระดับลงในตำแหน่งที่โดดเด่นน้อยกว่า
ในภาษาส่วนใหญ่ เราคุ้นเคยกับการอ่านจากซ้ายไปขวาและจากบนลงล่างของหน้า เช่นเดียวกับหน้าจอคอมพิวเตอร์ ดวงตาของผู้ใช้ส่วนใหญ่จะเพ่งความสนใจไปที่ด้านซ้ายบนของหน้าจอก่อน ดังนั้น องค์ประกอบที่สำคัญที่สุดจึงควรวางไว้ที่ด้านซ้ายบนของหน้าจอ ตัวอย่างเช่น หากข้อมูลในแบบฟอร์มเกี่ยวข้องกับลูกค้า ฟิลด์ชื่อควรปรากฏขึ้นในตำแหน่งที่มองเห็นเป็นอันดับแรก ควรวางปุ่มต่างๆ เช่น "ตกลง" หรือ "ถัดไป" ที่ส่วนล่างขวาของหน้าจอ โดยปกติผู้ใช้จะไม่สามารถเข้าถึงปุ่มเหล่านี้ก่อนที่จะดำเนินการกับแบบฟอร์มให้เสร็จสิ้น
สิ่งสำคัญคือต้องจัดกลุ่มองค์ประกอบและการควบคุม พยายามจัดกลุ่มข้อมูลตามฟังก์ชันหรือความสัมพันธ์ เนื่องจากฟังก์ชันต่างๆ เชื่อมโยงกัน ปุ่มสำหรับค้นหาฐานข้อมูลจึงควรจัดกลุ่มเป็นภาพแทนที่จะกระจัดกระจายทั่วทั้งแบบฟอร์ม เช่นเดียวกับข้อมูล ฟิลด์ชื่อและที่อยู่มักจะถูกจัดกลุ่มไว้ด้วยกันเนื่องจากมีความเกี่ยวข้องกันอย่างใกล้ชิด ในหลายกรณี คุณสามารถใช้ตัวควบคุมเฟรมเพื่อช่วยกระชับการเชื่อมต่อระหว่างตัวควบคุมได้
ความสอดคล้องขององค์ประกอบอินเทอร์เฟซ
ในการออกแบบส่วนต่อประสานผู้ใช้ ความสอดคล้องถือเป็นคุณธรรม รูปลักษณ์และความรู้สึกที่สอดคล้องกันสร้างความกลมกลืนภายในแอปพลิเคชัน ทำให้ทุกอย่างดูสอดคล้องกัน หากอินเทอร์เฟซขาดความสอดคล้องกัน อาจก่อให้เกิดความสับสนและทำให้แอปพลิเคชันดูสับสน ไม่เป็นระเบียบ มีคุณค่าน้อยลง และอาจก่อให้เกิดข้อสงสัยเกี่ยวกับความน่าเชื่อถือของแอปพลิเคชันด้วยซ้ำ
เพื่อรักษาความสอดคล้องของภาพ ให้สร้างกลยุทธ์การออกแบบและแบบแผนประเภทก่อนที่คุณจะเริ่มพัฒนาแอปพลิเคชันของคุณ องค์ประกอบการออกแบบ เช่น ประเภทการควบคุม ขนาดการควบคุม เกณฑ์การจัดกลุ่ม และการเลือกแบบอักษร ควรถูกกำหนดไว้ล่วงหน้า สามารถสร้างเทมเพลตการออกแบบเพื่อช่วยในการออกแบบได้
มีตัวควบคุมจำนวนมากใน Visual Basic ซึ่งอาจทำให้บางคนต้องการใช้ตัวควบคุมทั้งหมด เพื่อหลีกเลี่ยงสิ่งล่อใจนี้ ให้เลือกชุดย่อยของการควบคุมที่เหมาะกับการใช้งานเฉพาะของคุณ แม้ว่าตัวควบคุมต่างๆ เช่น กล่องรายการ กล่องคำสั่งผสม ตาราง และแผนภูมิทั้งหมดสามารถใช้เพื่อแสดงรายการข้อมูลได้ แต่วิธีที่ดีที่สุดคือใช้ประเภทใดประเภทหนึ่งทุกครั้งที่เป็นไปได้
นอกจากนี้ พยายามใช้ตัวควบคุมอย่างเหมาะสม แม้ว่าตัวควบคุมกล่องข้อความสามารถตั้งค่าเป็นแบบอ่านอย่างเดียวและใช้เพื่อแสดงข้อความได้ แต่ตัวควบคุมป้ายกำกับมักจะเหมาะสมกับวัตถุประสงค์นี้มากกว่า ต้องสอดคล้องกันเมื่อตั้งค่าคุณสมบัติสำหรับตัวควบคุม หากคุณใช้พื้นหลังสีขาวสำหรับข้อความที่แก้ไขได้ในที่เดียว อย่าใช้พื้นหลังสีเทาที่อื่นเว้นแต่คุณจะมีเหตุผลที่ดี
การรักษาความสอดคล้องระหว่างรูปแบบต่างๆ ในแอปพลิเคชันมีบทบาทสำคัญในการใช้งาน หากคุณใช้พื้นหลังสีเทาและเอฟเฟกต์สามมิติบนแบบฟอร์มหนึ่งและใช้พื้นหลังสีขาวบนอีกแบบฟอร์มหนึ่ง ทั้งสองแบบฟอร์มจะไม่เกี่ยวข้องกัน เลือกประเภทและรักษาความสอดคล้องตลอดทั้งแอปพลิเคชัน แม้ว่าจะหมายถึงการออกแบบคุณสมบัติบางอย่างใหม่ก็ตาม
ไดนามิก: แบบฟอร์มตรงกับฟังก์ชัน
การเคลื่อนไหวเป็นเบาะแสที่มองเห็นได้สำหรับการทำงานของวัตถุ แม้ว่าคำนี้อาจไม่คุ้นเคยกับคุณ แต่ตัวอย่างของความมีชีวิตชีวาก็มีอยู่ทุกหนทุกแห่ง แฮนด์จักรยานเมื่อคุณวางมือบนแฮนด์ การเคลื่อนไหวจะเผยให้เห็นความจริงที่ว่าแฮนด์ถูกขันด้วยมือของคุณ การกดปุ่ม ลูกบิดหมุน และการเปิดสวิตช์ไฟล้วนทำให้เคลื่อนไหวได้ และจุดประสงค์ก็ชัดเจนทันทีที่คุณเห็น
ส่วนต่อประสานกับผู้ใช้ยังใช้การเคลื่อนไหว ตัวอย่างเช่น เอฟเฟกต์สามมิติที่ใช้บนปุ่มคำสั่งทำให้ดูเหมือนถูกกด หากคุณออกแบบปุ่มคำสั่งที่มีขอบเรียบ คุณจะสูญเสียความรู้สึกไดนามิกนี้ และไม่สามารถบอกผู้ใช้ได้อย่างชัดเจนว่าเป็นปุ่มคำสั่ง ในบางกรณี ปุ่มแบนอาจเหมาะสม เช่น ในแอปพลิเคชันเกมหรือมัลติมีเดีย ตราบใดที่ปุ่มเหล่านั้นสอดคล้องกันทั่วทั้งแอปพลิเคชัน ก็ถือว่าเป็นเรื่องปกติ
กล่องข้อความยังให้ความรู้สึกถึงการเคลื่อนไหว และผู้ใช้สามารถคาดหวังได้ว่ากล่องที่มีเส้นขอบและพื้นหลังสีขาวที่มีข้อความที่แก้ไขได้ นอกจากนี้ยังสามารถแสดงกล่องข้อความโดยไม่มีเส้นขอบได้ (BorderStyle=0) ซึ่งทำให้ดูเหมือนป้ายกำกับและไม่แจ้งให้ผู้ใช้ทราบว่าสามารถแก้ไขได้อย่างชัดเจน
การใช้พื้นที่สีขาว
การใช้ช่องว่างในส่วนติดต่อผู้ใช้ช่วยให้องค์ประกอบต่างๆ โดดเด่นและปรับปรุงการใช้งาน พื้นที่สีขาวไม่จำเป็นต้องเป็นสีขาว ซึ่งถือเป็นพื้นที่ว่างระหว่างและรอบๆ ตัวควบคุมของแบบฟอร์ม ตัวควบคุมมากเกินไปบนฟอร์มอาจทำให้อินเทอร์เฟซรก ทำให้ยากต่อการค้นหาเขตข้อมูลหรือตัวควบคุม ต้องแทรกพื้นที่สีขาวในการออกแบบเพื่อเน้นองค์ประกอบการออกแบบ
ระยะห่างที่สม่ำเสมอระหว่างส่วนควบคุมและการจัดตำแหน่งองค์ประกอบแนวตั้งและแนวนอนยังช่วยให้การออกแบบใช้งานได้มากขึ้น เช่นเดียวกับข้อความในนิตยสาร มันถูกจัดเรียงเป็นแถวและแถวอย่างเรียบร้อยโดยมีระยะห่างสม่ำเสมอ และอินเทอร์เฟซที่เรียบร้อยจะทำให้อ่านง่าย
Visual Basic มีเครื่องมือหลายอย่างที่ทำให้ง่ายต่อการปรับระยะห่าง การจัดเรียง และขนาดของตัวควบคุม คำสั่งต่างๆ เช่น จัดเรียง ทำให้มีขนาดเท่ากัน ระยะห่างแนวนอน ระยะห่างแนวตั้ง และกึ่งกลางในหน้าต่าง สามารถพบได้ในเมนูรูปแบบ
ทำให้อินเทอร์เฟซเรียบง่าย
บางทีหลักการที่สำคัญที่สุดของการออกแบบอินเทอร์เฟซก็คือความเรียบง่าย สำหรับแอพพลิเคชัน ถ้าอินเทอร์เฟซดูยาก ตัวโปรแกรมเองก็อาจจะยากเช่นกัน การคิดให้ลึกซึ้งยิ่งขึ้นอีกเล็กน้อยสามารถช่วยสร้างอินเทอร์เฟซที่ดู (และ) ใช้งานง่ายได้ จากมุมมองด้านสุนทรียภาพ การออกแบบที่เรียบง่ายและสะอาดตามักเป็นที่นิยมมากกว่า
ข้อผิดพลาดทั่วไปในการออกแบบอินเทอร์เฟซคือการพยายามใช้อินเทอร์เฟซเพื่อเลียนแบบวัตถุในโลกแห่งความเป็นจริง ตัวอย่างเช่น ลองจินตนาการถึงแอปพลิเคชันที่ต้องมีการสร้างกรมธรรม์ประกันภัยที่สมบูรณ์ ปฏิกิริยาตามธรรมชาติคือการออกแบบอินเทอร์เฟซบนหน้าจอเหมือนกับกรมธรรม์ประกันภัย การทำเช่นนี้มีปัญหาหลายประการ: รูปร่างและขนาดของกรมธรรม์ประกันภัยแตกต่างจากที่ปรากฏบนหน้าจออย่างมาก และการพยายามจำลองตารางดังกล่าวอย่างสมบูรณ์แบบจะจำกัดให้อยู่ในกล่องข้อความและกล่องกาเครื่องหมายโดยไม่เกิดประโยชน์กับ ผู้ใช้.
จะดีกว่าถ้าออกแบบอินเทอร์เฟซของคุณเองซึ่งมีสำเนากรมธรรม์ประกันภัยต้นฉบับที่พิมพ์ออกมาด้วย (พร้อมตัวอย่างก่อนพิมพ์) ด้วยการสร้างกลุ่มฟิลด์แบบลอจิคัลจากนโยบายดั้งเดิมและการใช้อินเทอร์เฟซแบบแท็บหรือแบบฟอร์มที่เชื่อมโยงหลายรูปแบบ ทำให้สามารถแสดงข้อมูลทั้งหมดได้โดยไม่ต้องเลื่อนหน้าจอ คุณยังสามารถใช้การควบคุมเพิ่มเติม เช่น กล่องรายการที่มีตัวเลือกที่โหลดไว้ล่วงหน้า ซึ่งสามารถลดความยุ่งยากในการพิมพ์ได้
คุณยังสามารถลดความซับซ้อนของแอปพลิเคชันจำนวนมากได้ด้วยการนำฟังก์ชันที่ใช้งานน้อยกว่าออกและย้ายไปยังรูปแบบของตัวเอง การระบุค่าเริ่มต้นอาจทำให้แอปพลิเคชันง่ายขึ้นในบางครั้ง หากผู้ใช้เก้าในสิบรายเลือกข้อความตัวหนา ให้กำหนดให้ข้อความเป็นตัวหนาเป็นค่าเริ่มต้นแทนที่จะขอให้ผู้ใช้เลือกในแต่ละครั้ง (อย่าลืมระบุตัวเลือก ค่าเริ่มต้นนี้สามารถแทนที่ได้) . วิซาร์ดยังช่วยลดความซับซ้อนของงานหรืองานที่ใช้ไม่บ่อยอีกด้วย
การทดสอบการทำให้เข้าใจง่ายที่ดีที่สุดคือการสังเกตการใช้งานจริง หากผู้ใช้ที่เป็นตัวแทนไม่สามารถบรรลุสิ่งที่ต้องการได้ในทันทีหากไม่มีความช่วยเหลือออนไลน์ ก็จำเป็นต้องพิจารณาการออกแบบใหม่
ใช้สีและรูปภาพ
การใช้สีในอินเทอร์เฟซสามารถเพิ่มความดึงดูดสายตาได้ แต่การละเมิดมักเกิดขึ้น จอภาพจำนวนมากสามารถแสดงสีได้หลายล้านสี ทำให้ง่ายต่อการใช้งาน เช่นเดียวกับหลักการออกแบบขั้นพื้นฐานอื่นๆ สีอาจทำให้เกิดปัญหาได้มากมายหากไม่พิจารณาอย่างรอบคอบเมื่อเริ่มการออกแบบ
ความชอบด้านสีของทุกคนแตกต่างกันมากและรสนิยมของผู้ใช้ก็จะแตกต่างกันไปด้วย สีสามารถกระตุ้นอารมณ์ความรู้สึกที่รุนแรงได้ และหากคุณกำลังออกแบบโปรแกรมสำหรับผู้ชมทั่วโลก สีบางสีอาจมีความสำคัญทางวัฒนธรรม โดยทั่วไป ทางที่ดีที่สุดคือรักษาแบบดั้งเดิมและใช้สีที่เป็นกลางและเงียบกว่า
แน่นอนว่าผู้อ่านที่ตั้งใจไว้ รวมถึงน้ำเสียงและอารมณ์ที่คุณพยายามสื่อจะมีอิทธิพลต่อการเลือกสีของคุณด้วย สีแดง เขียว และเหลืองสดใสทำงานได้ดีในแอปที่เด็กเล็กใช้ แต่ในแอปธนาคาร มีแนวโน้มที่จะนำความรับผิดชอบทางการเงินน้อยกว่า
การใช้สีสว่างเพียงเล็กน้อยก็สามารถเน้นหรือดึงดูดความสนใจไปยังบริเวณที่สำคัญได้อย่างมีประสิทธิภาพ ตามหลักการทั่วไป พยายามจำกัดความหลากหลายของสีที่ใช้ในแอปพลิเคชันของคุณ และโทนสีควรจะสม่ำเสมอ หากเป็นไปได้ ควรใช้จานสีมาตรฐาน 16 สี เมื่อดูบนจอภาพ 16 สี การผสมสีสามารถป้องกันไม่ให้สีอื่นๆ ปรากฏขึ้นได้ อีกประเด็นที่ต้องพิจารณาเมื่อทำงานกับสีคือตาบอดสี บางคนไม่สามารถบอกความแตกต่างระหว่างการผสมสีหลักต่างๆ ได้ (เช่น สีแดงและสีเขียว) สำหรับผู้ที่มีอาการนี้ ข้อความสีแดงบนพื้นหลังสีเขียวจะมองไม่เห็น
รูปภาพและไอคอน
การใช้รูปภาพและไอคอนสามารถเพิ่มความน่าสนใจให้กับแอปพลิเคชันได้ แต่การออกแบบอย่างระมัดระวังก็เป็นสิ่งจำเป็นเช่นกัน รูปภาพสามารถถ่ายทอดข้อมูลเป็นภาพได้โดยไม่ต้องใช้ข้อความ แต่บ่อยครั้งที่ผู้คนตีความรูปภาพต่างกัน
แถบเครื่องมือที่มีไอคอนแสดงฟังก์ชันต่างๆ เป็นอุปกรณ์อินเทอร์เฟซที่มีประโยชน์ แต่อาจส่งผลย้อนกลับได้หากไม่สามารถระบุฟังก์ชันที่ไอคอนแสดงได้อย่างง่ายดาย เมื่อออกแบบไอคอนแถบเครื่องมือ คุณควรดูแอปพลิเคชันอื่นๆ เพื่อดูว่ามีการสร้างมาตรฐานใดบ้าง ตัวอย่างเช่น แอปพลิเคชันจำนวนมากใช้กระดาษที่มีมุมโค้งงอเพื่อแสดงไอคอนไฟล์ใหม่ อาจมีคำอุปมาที่ดีกว่าในการนำเสนอฟังก์ชันการทำงานนี้ แต่การใช้การนำเสนอแบบอื่นอาจทำให้เกิดความสับสนในหมู่ผู้ใช้
การพิจารณาความสำคัญทางวัฒนธรรมของภาพก็เป็นสิ่งสำคัญเช่นกัน หลายโปรแกรมใช้กล่องจดหมายอภิบาลพร้อมธง (รูปที่ 6.21) เพื่อแสดงฟังก์ชันการทำงานของเมล เดิมเป็นไอคอนสำหรับสหรัฐอเมริกา ผู้ใช้ในประเทศหรือวัฒนธรรมอื่นอาจไม่รู้จักว่าเป็นกล่องจดหมาย
เมื่อออกแบบไอคอนและรูปภาพของคุณเอง พยายามทำให้มันเรียบง่าย รูปภาพที่ซับซ้อนที่มีหลายสีไม่พอดีกับไอคอนแถบเครื่องมือขนาด 16×16 พิกเซล หรือเมื่อแสดงบนหน้าจอความละเอียดสูง
เลือกแบบอักษร
แบบอักษรยังเป็นส่วนสำคัญของอินเทอร์เฟซผู้ใช้เนื่องจากมักจะถ่ายทอดข้อมูลที่สำคัญให้กับผู้ใช้ เลือกแบบอักษรที่อ่านง่ายบนความละเอียดและประเภทของจอภาพที่แตกต่างกัน ควรใช้แบบอักษร sans-serif หรือ serif แบบธรรมดาทุกครั้งที่เป็นไปได้ แบบอักษรที่เขียนด้วยลายมือหรือแบบอักษรตกแต่งอื่นๆ มักจะดูดีกว่าในการพิมพ์มากกว่าบนหน้าจอ และยิ่งขนาดแบบอักษรเล็กลงเท่าไรก็ยิ่งอ่านได้ยากเท่านั้น
เว้นแต่ว่าคุณวางแผนที่จะกำหนดค่าแบบอักษรต่อแอปพลิเคชัน คุณควรใช้แบบอักษรมาตรฐานของ Windows เช่น Arial, NewTimesRoman หรือ System หากระบบของผู้ใช้ไม่มีแบบอักษรที่ระบุ ระบบจะใช้แบบอักษรอื่น และผลลัพธ์อาจแตกต่างไปจากที่คาดไว้โดยสิ้นเชิง หากคุณกำลังออกแบบสำหรับผู้ชมในต่างประเทศ ให้ตรวจสอบว่ามีแบบอักษรใดบ้างในภาษาที่ต้องการ นอกจากนี้ เมื่อออกแบบสำหรับภาษาอื่น คุณต้องพิจารณาการขยายข้อความด้วย - ในบางภาษา สตริงข้อความอาจใช้พื้นที่มากกว่า 50%
นอกจากนี้ เมื่อเลือกแบบอักษร ความสม่ำเสมอในการออกแบบเป็นสิ่งสำคัญมาก ในกรณีส่วนใหญ่ คุณไม่ควรใช้แบบอักษรมากกว่าสองแบบในแอปพลิเคชัน แบบอักษรมากเกินไปอาจทำให้แอปพลิเคชันดูเหมือนตั๋วโทษได้
-