2.3 การออกแบบหน้าจอบทเรียนคอมพิวเตอร์ช่วยสอน

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

· ความละเอียดของจอภาพ ปัจจุบันความละเอียดของจอภาพที่นิยมใช้ จะมีสองค่า คือ 640x480 pixel และ 800x600 pixel ดังนั้นควรพิจารณาถึงความละเอียดที่จะดีที่สุด เพราะหากออกแบบหน้าจอ สำหรับจอภาพ 800x600 pixel แต่นำมาใช้กับจอภาพ 640x480 pixel จะทำให้เนื้อหาตกขอบจอได้ แต่ถ้าหากจัดทำด้วยค่า 640x480 pixel หากนำเสนอผ่านจอ 800x600 pixel จะปรากฎพื้นที่ว่างรอบเฟรมเนื้อหาที่นำเสนอ

· การใช้สี เพื่อให้ผู้เรียนสามารถนั่งดู และศึกษาบทเรียนได้ดี ควรใช้สีในโทนเย็น หรืออาจจะพิจารณาองค์ประกอบร่วมกัน คือ สีของพื้น (Background) ควรเป็นสีขาว , สีเทาอ่อน ในขณะที่สีข้อความ ควรเป็นสีในโทนเย็น เช่น สีน้ำเงินเข้ม , สีเขียวเข้ม หรือสีที่ตัดกับสีพื้น จะมีการใช้สีโทนร้อน กับข้อความที่ต้องการเน้นเป็นพิเศษเท่านั้น และไม่ควรใช้สีเกิน 4 สีกับเนื้อหาข้อความ ไม่ควรสลับสีไปมาในแต่ละเฟรม

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

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

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

ที่มา :: บันทึกนี้เขียนที่ GotoKnow โดย รัฐพล ใน รัฐพล ศิริพิมลวัฒน์ ลิงค์ https://www.gotoknow.org/posts/34709

แนวคิดในการออกแบบหน้าจอบทเรียน แบบที่ 1

แนวคิดในการออกแบบหน้าจอบทเรียน แบบที่ 2

แนวคิดในการออกแบบหน้าจอบทเรียน แบบที่ 3

แนวคิดในการออกแบบหน้าจอบทเรียน แบบที่ 4

Copyright by แอดมินโอ๊ต ProgramsDD 08-10-2556

ที่มา https://programsdd.com/2013/10/08/layoutcai/