Skeuomorphism and Flat Design: การออกแบบ UX/UI เพื่อให้สอดคล้องกับกระบวนการรับรู้ของมนุษย์

Main Article Content

มัธยม อ่อนจันทร์
บังอร พลมิตร
ศรารัตน์ วรรณแจ่ม

บทคัดย่อ

การวิจัยนี้มีวัตถุประสงค์เพื่อ 1) ศึกษาหลักการของการปฏิสัมพันธ์ระหว่างมนุษย์กับคอมพิวเตอร์ (Human-Computer Interaction: HCI) รวมถึงแนวคิดการออกแบบอินเทอร์เฟซ 2 สไตล์ ได้แก่ Skeuomorphism และ Flat Design และ 2) ออกแบบแอปพลิเคชันต้นแบบ UI/UX สำหรับการรับคำสั่งซื้อจากลูกค้าในร้านอาหาร โดยเน้นการตอบสนองต่อความต้องการของผู้ใช้และเพิ่มประสิทธิภาพในการทำงาน เครื่องมือที่ใช้ การวิจัยนี้ใช้แบบสอบถามเพื่อสำรวจพฤติกรรมและความต้องการของผู้ใช้ การสังเกตการใช้งานแอปพลิเคชันต้นแบบ และการสัมภาษณ์พนักงานรับคำสั่งซื้อในร้านอาหารเพื่อรวบรวมข้อมูลเกี่ยวกับความง่ายในการใช้งาน ความสวยงาม และการตอบสนองต่อการใช้งานจริงของแอปพลิเคชัน กลุ่มประชากร: กลุ่มประชากรที่ใช้ในการวิจัยประกอบด้วยพนักงานรับคำสั่งซื้อในร้านอาหารอีสาน จำนวน 10 คน ซึ่งได้รับการสังเกตและสัมภาษณ์เพื่อประเมินความพึงพอใจ ความสะดวกในการใช้งาน และความเหมาะสมของแอปพลิเคชันต้นแบบ สถิติที่ใช้วัดประสิทธิภาพ: ใช้สถิติพื้นฐาน เช่น ค่าเฉลี่ย (Mean) และส่วนเบี่ยงเบนมาตรฐาน (Standard Deviation) ในการประเมินผล ผลการวิจัย: ส่วนที่ 1: ข้อมูลทั่วไปของผู้ตอบแบบสอบถาม จำนวนผู้ตอบแบบสอบถาม: 10 คน เพศ: ค่าเฉลี่ย = 1.50, ส่วนเบี่ยงเบน  มาตรฐาน = 0.52705 (คิดเป็นร้อยละ 50) อายุ: ค่าเฉลี่ย = 1, ส่วนเบี่ยงเบนมาตรฐาน = 0.00 (คิดเป็นร้อยละ 100 ซึ่งส่วนใหญ่เป็นนักศึกษาพาร์ทไทม์) ส่วนที่ 2: ความพึงพอใจเกี่ยวกับการใช้งานแอปพลิเคชัน 2.1 คุณภาพของแอปพลิเคชัน ความง่ายในการใช้งาน: ค่าเฉลี่ย = 4.70, ส่วนเบี่ยงเบนมาตรฐาน = 0.48 ความสะดวกในการใช้งาน: ค่าเฉลี่ย = 4.70, ส่วนเบี่ยงเบนมาตรฐาน = 0.48 ความถูกต้อง: ค่าเฉลี่ย = 4.80, ส่วนเบี่ยงเบนมาตรฐาน = 0.42 ความเร็วในการใช้งาน: ค่าเฉลี่ย = 5.00,      ส่วนเบี่ยงเบนมาตรฐาน = 0.00 2.2 ความปลอดภัยของแอปพลิเคชัน ความน่าเชื่อถือของระบบแจ้งเตือน: ค่าเฉลี่ย = 4.70,  ส่วนเบี่ยงเบนมาตรฐาน = 0.48 ระบบล็อกอินเฉพาะบุคคล: ค่าเฉลี่ย = 5.00, ส่วนเบี่ยงเบนมาตรฐาน = 0.00 ความถูกต้องในการประมวลผล: ค่าเฉลี่ย = 5.00, ส่วนเบี่ยงเบนมาตรฐาน = 0.00 2.3 ด้านการนำเสนอของแอปพลิเคชัน ความเหมาะสมของตัวอักษร: ค่าเฉลี่ย = 5.00, ส่วนเบี่ยงเบนมาตรฐาน = 0.00 การจัดวางองค์ประกอบ: ค่าเฉลี่ย = 4.60, ส่วนเบี่ยงเบนมาตรฐาน = 0.51 การใช้สัญลักษณ์และสื่อ: ค่าเฉลี่ย = 4.30, ส่วนเบี่ยงเบนมาตรฐาน = 0.48 ความสวยงาม: ค่าเฉลี่ย = 4.80,             ส่วนเบี่ยงเบนมาตรฐาน = 0.42 ความทันสมัย: ค่าเฉลี่ย = 4.40, ส่วนเบี่ยงเบนมาตรฐาน = 0.51 การใช้ skeuomorphism ในการออกแบบ UX บนมือถือและการทำให้อินเตอร์เฟซคุ้นเคยและใช้งานง่ายขึ้นมีต้นกำเนิดจากยุคแรกของการคอมพิวเตอร์และมือถือ และ Flat Design หรือการออกแบบ “แบบแบน” เป็นการออกแบบที่เน้นความเรียบง่าย โดยลดทอนรายละเอียดที่ไม่จำเป็นและเน้นการใช้สีสดใส ไอคอนแบน และรูปทรงที่เรียบง่าย แนวคิดนี้มีจุดมุ่งหมายเพื่อเพิ่มประสิทธิภาพในการใช้งาน ถ้านำสองอย่างนี้ มาออกแบบใช้ร่วมกันจะทำให้ แอปพลิเคชัน มีการออกแบบที่ดี และรวดเร็ว ผลการวิจัยชี้ให้เห็นว่า แอปพลิเคชันที่ออกแบบในสไตล์ Flat Design ได้รับการประเมินด้านความชัดเจนและความสะดวกในการใช้งานสูงกว่าสไตล์ Skeuomorphism ส่งผลให้ Flat Design สามารถนำไปพัฒนาต่อยอดในการออกแบบแอปพลิเคชันที่มีประสิทธิภาพและตอบสนองต่อความต้องการของผู้ใช้งานในบริบทจริงได้ดียิ่งขึ้น

Downloads

Download data is not yet available.

Article Details

รูปแบบการอ้างอิง
อ่อนจันทร์ ม. ., พลมิตร บ. ., & วรรณแจ่ม ศ. . (2024). Skeuomorphism and Flat Design: การออกแบบ UX/UI เพื่อให้สอดคล้องกับกระบวนการรับรู้ของมนุษย์. วารสารวิทยาศาสตร์ เทคโนโลยี และนวัตกรรม มหาวิทยาลัยกาฬสินธุ์, 3(2), 65–72. https://doi.org/10.14456/ksti.2024.16
ประเภทบทความ
บทความวิจัย

เอกสารอ้างอิง

Saul Greenberg & Bill Buxton, “Usability Evaluation Considered Harmful (Some of the Time)” in CHI 2008 Proceedings: Usability Evaluation Considered Harmful?, April 5-10, 2008 (Florence, Italy).

Donald A. Norman, The Psychology of Everyday Things (New York: Basic Books Inc., 1988) ISBN: 0-465-06709-3. See also Donald A. Norman, "The Psychology of Everyday Things" (1992) 79:3 Acta Psychologica 275.

Jakob Nielsen, Hypertext and Hypermedia: Historical Context, Findings, and Trends (San Diego, CA: Academic Press, 1990) ISBN: 0-12-518410-7; see also Jakob Nielsen, Hypertext and Hypermedia: Historical Context, Findings, and Trends (San Diego, CA: Academic Press, 1993) ISBN: 0-12-518411-5. See Jakob Nielsen, “Hypertext and Hypermedia: Historical Context, Findings, and Trends” (1995) 11:3-4 Computers in Human Behavior 673.

Kim S, Lee S. Smash the dichotomy of skeuomorphism and flat design: Designing an affordable interface to correspond with the human perceptuomotor process. Int J Hum Comput Stud. 2020 Sep;141:102435.

Shen Z, Chen T, Wang Y, Li M, Chen J, Hu Z. Skeuomorphic or flat? The effects of icon style on visual search and recognition performance. Displays. 2024 Sep;84:102813.

Greenberg S, Buxton B. Usability evaluation considered harmful (some of the time). In: CHI 2008 Proceedings: Usability Evaluation Considered Harmful?; April 5-10, 2008; Florence, Italy.

Dix A, Finlay J, Abowd G, Beale R. Human-computer interaction. 3rd ed. Pearson Education Limited; 2004. ISBN-13: 978-0-13-046109-4.

Nielsen J. 10 usability heuristics for user interface design [Internet]. 1994 [cited 2024 Sep 4]. Available from: https://www.nngroup.com/articles/ten-usability-heuristics/

Gibson J. What is skeuomorphism? [Internet]. Interaction Design Foundation - IxDF; 2016 Jun 4 [cited 2024 Sep 4]. Available from: https://www.interaction-design.org/literature/topics/skeuomorphism

Nielsen Norman Group. Articles & videos [Internet]. [cited 2024 Sep 4]. Available from: https://www.nngroup.com/articles/flat-design/

Karray S, Driss Z. Fluid-structure interaction of a radial turbine. In: Applied Computational Fluid Dynamics. Available from: https://books.google.co.th/books?hl=th&lr=&id=oOuZDwAAQBAJ&oi=fnd&pg=PA201&dq=karray+et+al.+2008+flat+design&ots=Ic8volxC6t&sig=kcKjDd7_vyzysylv8VTPHGdrFGo&redir_esc=y#v=onepage&q&f=false

Kim S, Lee S. Smash the dichotomy of skeuomorphism and flat design: Designing an affordable interface to correspond with the human perceptuomotor process. Int J Hum Comput Stud. 2020;141:102435.

Rogers Y, Sharp H, Preece J. Interaction design: Beyond human-computer interaction. 3rd ed. 2011.