การออกแบบหน้าจอเป็นส่วนสำคัญส่วนหนึ่งของการออกแบบโปรแกรมต่าง ๆ เพื่อให้ผู้ใช้งานสามารถเข้าใช้งานได้ง่าย สะดวกและรวดเร็ว โดยครั้งนี้จะนำเสนอหลักการออกแบบหน้าจอในส่วนขององค์ประกอบด้านข้อความ มีรายละเอียดดังนี้
องค์ประกอบด้านข้อความ
ข้อความ จัดเป็นองค์ประกอบหลักที่สำคัญที่สุดในการออกแบบบทเรียนคอมพิวเตอร์ช่วยสอน การออกแบบข้อความที่ดี ผู้ออกแบบต้องคำนึงถึงองค์ประกอบย่อยหลายด้าน เช่น รูปแบบตัวอักษร ขนาดตัวอักษร ความหนาแน่นตัวอักษร สีของข้อความและการจัดความสัมพันธ์ข้อความและภาพให้สอดคล้องกับองค์ประกอบอื่นๆ เช่น ภาพ และกราฟิกบนหน้าจอ รูปแบบและขนาดตัวอักษร การเลือกรูปแบบและขนาดของตัวอักษรที่เหมาะสมต้องคำนึงถึงระดับของผู้เรียนเป็นหลัก กล่าวคือผู้เรียนที่จัดอยู่ในเกณฑ์กลุ่มผู้อ่านช้า (Poor reader) ขนาดของตัวอักษรต้องใหญ่กว่าผู้เรียนในกลุ่มที่อ่านคล่อง การใช้ตัวอักษรใหญ่เกินไปทำให้การอ่านช้าลง เนื่องจากการที่ผู้อ่านต้องกวาดสายตาไปไกล หากตัวอักษรมีขนาดเล็กเกินไปอาจทำให้ผู้เรียน แม้จะเป็นผู้ที่อ่านคล่อง ก็อาจทำให้การอ่าน และการทำความเข้าใจมีประสิทธิภาพน้อยลงได้ มีงานวิจัยเกี่ยวกับขนาดของตัวอักษรทั้งภาษาไทยและภาษาอังกฤษ พบว่าผู้อ่านจะใช้เวลาในการอ่านตัวอักษรตัวพิมพ์ภาษาไทยหรือภาษาต่างๆ ขนาด 80 ตัวอักษรต่อบรรทัด น้อยกว่า การอ่านตัวอักษรขนาด 40 ตัวอักษรต่อบรรทัด ในขณะที่ความเข้าใจจากการอ่านตัวอักษรทั้ง 2ขนาดไม่แตกต่างกัน และขนาดของตัวอักษร (ภาษาอังกฤษ) กับการใช้ขนาดหัวเรื่องควรอยู่ระหว่าง 19-37 พอยต์ ในขณะที่ตัวหนังสือปกติมีขนาดประมาณ 12-19 พอยต์ ส่วนรูปแบบของตัวอักษรควรใช้ตัวที่อ่านง่าย แต่หากตัวอักษรที่ไม่ใช่ส่วนของเนื้อหาหลัก เช่น ตัวอักษรหัวเรื่องใหญ่ตัวอักษรประกอบการออกแบบ หรือตัวอักษรพิเศษอื่นๆ ผู้ออกแบบอาจใช้ตัวอักษรูปแบบและขนาดต่างๆ กันออกไปได้ แต่ไม่ควรมีความหนาแน่นของตัวอักษรมากเกินไป รูปแบบและขนาดตัวอักษรจะมีความสัมพันธ์กับช่องว่างระหว่างบรรทัดและระหว่างคำด้วย ช่องว่างระหว่างบรรทัดที่เหมาะสมจะช่วยให้อ่านง่ายขึ้น แต่หากช่องว่างดังกล่าวมากเกินไปก็จะทำให้สูญเสียความต่อเนื่องของมโนทัศน์ หลักการทั่วไปคือช่องว่างระหว่างบรรทัดนอกจากจะมีขนาดเหมาะสมแล้ว ควรมีความสม่ำเสมอตลอดการนำเสนอด้วย ความหนาแน่นของตัวอักษร ส่วนใหญ่จะรวมถึงความหนาแน่นขององค์ประกอบอื่นบนจอภาพเข้าไปด้วย ผลการวิจัยพบว่า ผู้เรียนจะชอบจอภาพที่มีความหนาแน่นปานกลาง หรือประมาณ 40% ของพื้นที่หน้าจอมากที่สุด และจะเลือกจอภาพที่มีความหนาแน่นสูง หรือประมาณ 50% ของพื้นที่หน้าจอ มากกว่าจอภาพที่มีความหนาแน่นต่ำ นอกจากนี้ยังพบว่าในวิชาที่มีเนื้อหายาก ผู้เรียนจะชอบจอภาพที่มีความหนาแน่นสูง เนื่องจากจอภาพที่มีความหนาแน่นขององค์ประกอบต่างๆ สูง จะมีข้อมูลที่ช่วยให้ความเข้าใจเนื้อหาและแนวคิดหลักต่างๆ ชัดเจนและต่อเนื่องขึ้น สีข้อความ เป็นองค์ประกอบหน้าจอ ที่ช่วยกระตุ้นความน่าสนใจในการอ่าน สีเป็นตัวกระตุ้นประสาทการรับรู้ที่สำคัญ การใช้สีที่เหมาะสมจะช่วยให้อ่านง่าย และสบายตา การกำหนดสีข้อความต้องพิจารณาสีพื้นหลังประกอบเสมอ ซึ่งจะเรียกว่าคู่สี คู่สีบางคู่สามารถใช้ร่วมกันได้ บางคู่ไม่ควรนำมาใช้ร่วมกัน ผลงานวิจัยพบว่านักเรียนส่วนใหญ่ชอบคู่สีอักษรขาวหรือเหลืองบนพื้นน้ำเงิน อักษรเขียวบนพื้นดำ และอักษรดำบนพื้นเหลือง หากใช้พื้นเป็นสีเทา คู่สีที่ผู้เรียนชอบคือ สีฟ้า สีแดง สีม่วง และสีดำ สีที่ชอบน้อยคือสีส้ม สีม่วงแดง สีเขียว และสีแดง แม้งานวิจัยชิ้นนี้จะทำขึ้นในช่วงก่อนปี ค.ศ. 1991 ซึ่งขณะนั้นจอภาพสามารถแสดงได้เพียง 16 สี (ขณะนี้จอภาพแสดงได้เป็นล้านสี) แต่คู่สีหลักๆ ดังกล่าวยังคงสามารถใช้อ้างอิงในการออกแบบบทเรียนคอมพิวเตอร์ได้ หลักการออกแบบคู่สีที่ควรต้องคำนึงถึงอีกประการหนึ่ง คือ ควรใช้พื้นหลังเป็นสีเข้มมากกว่าสีอ่อน เนื่องจากสีเข้มจะช่วยลดแสงสว่างจากจอภาพ ทำให้รู้สึกสบายตามากกว่าการใช้สีอ่อนเป็นพื้นหลัง ซึ่งระยะยาวจะช่วยลดความล้าของสายตา ในการอ่านจอภาพอันเนื่องมาจากความจ้าของสีพื้น ปัจจุบันการออกแบบสีพื้นหลังได้รับการพัฒนาไปเร็วมาก เนื่องจากประสิทธิภาพในการประมวลผลและการแสดงผลของคอมพิวเตอร์พัฒนาขึ้นเร็วมาก การออกแบบสื่อมัลติมีเดียทั่วไปขณะนี้มีการออกแบบพื้นหลังให้มีพื้นผิวที่มีลวดลายมีมิติ และใช้เทคนิคในการออกแบบอย่างเต็มรูปแบบ ในการเลือกสีของตัวอักษรและขนาดของตัวอักษรที่เหมาะสม จึงควรพิจารณาอย่างถี่ถ้วน สีของตัวอักษรซึ่งมองดูชัดเจนบนพื้นสีหน้าจอบริเวณหนึ่ง อาจไม่เหมาะสมหรืออ่านยากบนพื้นสีหน้าจอเดียวกันแต่คนละบริเวณกันก็เป็นไปได้ การวางรูปแบบข้อความ องค์ประกอบที่เกี่ยวข้องกับข้อความบนจอภาพประการหนึ่งคือ การวางรูปแบบข้อความ เทคนิคในการนำเสนอข้อความให้อ่านง่าย สวยงาม น่าสนใจ ทำได้หลายวิธี ผู้ออกแบบสามารถนำเสนอข้อความทีละส่วน ทีละตอน หรือเสนอข้อความทั้งหมดในคราวเดียวกันก็ได้ ขึ้นอยู่กับเทคนิคการนำเสนอที่เหมาะสม เช่น ในการนำเสนอเนื้อหาที่เป็นขั้นตอนที่จำเป็น ต้องบรรจุอยู่ในจอภาพเดียวกัน ผู้ออกแบบอาจเสนอทีละขั้นโดยผู้เรียนเป็นผู้ควบคุมการนำเสนอ ซึ่งจะช่วยให้ผู้เรียนมีความสนใจเนื้อหาข้อความดีกว่าการนำเสนอทั้งหมดพร้อมกัน อย่างไรก็ตาม ไม่ว่าจะเสนอข้อความทีละส่วนหรือพร้อมกันทั้งหมด โดยภาพรวมแล้วการออกแบบหน้าจอจะต้องมีความเหมาะสมและน่าอ่าน ซึ่งเป็นหลักการออกแบบงานกราฟิกทั่วไป ที่ต้องคำนึงถึงรายละเอียดดังนี้
- ความสมดุลของหน้าจอโดยรวม (Balance) การเฉลี่ยน้ำหนักขององค์ ประกอบบนจอภาพ ซ้าย ขวา บน ล่าง อย่างเหมาะสมนี้ ผู้ออกแบบจะจัดให้มีความสมดุลแบบแบ่งครึ่งซ้ายขวาเท่ากัน หรือการจัดภาพหรือองค์ประกอบที่ซ้ายขวาไม่เท่ากัน แต่ดูแล้วสมดุลกันก็ได้ องค์ประกอบที่จะช่วยในการจัดสมดุลของจอภาพนี้ คือ รายละเอียดทุกอย่างที่เรามองเห็นในกรอบจอภาพ เช่น โทนสี ขนาดภาพ ตำแหน่งของภาพ/คำ ช่องว่าง การฟิกประกอบหน้าจอ ประมาณข้อความ ความแน่นของภาพ/ข้อความ และการให้แสงสี
- ความเรียบง่าย (Simplicity) เป็นสมบัติสำคัญของการออกแบบสื่อทุกประเภทซึ่งออกแบบได้ไม่ยาก แต่การออกแบบให้มีความเรียบง่ายและน่าสนใจด้วยนั้นทำได้ยาก โดยเฉพาะอย่างยิ่ง การออกแบบข้อความ ปัจจุบันการออกแบบหน้าจอคอมพิวเตอร์จะมีองค์ประกอบของกราฟิกในรูปแบบต่างๆ กันเกี่ยวข้องด้วย เช่น ภาพนิ่ง ภาพเคลื่อนไหว ภาพวาด และอื่นๆ โดยยังมีข้อความเป็นองค์ประกอบหลัก "ความเรียบง่าย" โดยทั่วไปจึงมักกล่าวโดยรวมซึ่งหมายถึง การออกแบบหน้าจอคอมพิวเตอร์ที่ผู้ออกแบบได้จัดผสมผสานองค์ประกอบร่วมต่างๆ เข้าด้วยกัน เพื่อให้เกิดการสื่อสารระหว่างผู้เรียนและคอมพิวเตอร์อย่างมีระบบ อ่านง่าย เข้าใจง่าย และผู้เรียนได้รับความรู้หรือเกิดการเรียนรู้อย่างมีประสิทธิภาพ
เพื่อนๆ สามารถศึกษาข้อมูลการออกแบบส่วนต่าง ๆ เพิ่มเติมได้ที่
http://www.learners.in.th/blogs/posts/22912
ช่วยได้เยอะมากค่ะเพราะหน้าจอโปรแกรมที่สวยงามจะช่วยให้โปรแกรมเราน่าสนใจมากขึ้น
ตอบลบความคิดเห็นนี้ถูกผู้เขียนลบ
ตอบลบเห็นด้วยเรื่องความเรียบง่ายของการออกแบบ เพราะบางทีการมีลวยลาย หรือรูปแบบกราฟฟิคที่ซ้ำซ้อนเกินไป มันก็ส่งผลให้ใช้งานได้ยากขึ้น
ตอบลบ(นายภาณุวัฒน์ ง้วนประเสริฐ 52040797)
จากลิงค์นี้ http://www.learners.in.th/blogs/posts/229123 ในข้อ 3 ความแตกต่าง ( contrast ) ถ้าเรามีการเน้นสี เน้นรูปภาพ จะทำให้ผู้ใช้ เข้าใจชัดเจนและง่ายมากขึ้น ซึ่งก็เป็นส่วนที่สำคัญ
ตอบลบ