หนังสือ The Design of Everything Things โดย Don Norman กูรูด้าน UX หากใครอยากหาหนังสือเกี่ยวกับดีไซน์ดีๆ ซักเล่ม หรืออยากหาตำราเพื่อยึดเป็นสรณะแล้วล่ะก็ ผมไม่ลังเลที่จะแนะนำหนังสือ ‘The Design of Everyday Things’ ของ Don Norman ...

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

บทความแรกๆ ของ UI Blogazine ได้นำเสนอทฤษฎีเกสตอลท์ (Gestalt) ในบริบทที่ใช้ในการออกแบบสื่อกราฟิคโดยรวม ไม่ได้เฉพาะเจาะจงเรื่องของ UI มากสักเท่าไรนัก ในบทความนี้ เราจะมาทบทวนทฤษฎีนี้กัน และลงรายละเอียดในหัวข้อที่เกี่ยวกับงานอออกแบบ UI กันครับ พร้อมตัวอย่างและสถานการณ์การนำทฤษฎีเกสตอลท์ไปใช้ทำงานได้จริงๆ ทฤษฎีเกสตอลท์ (Gestalt Theory) เกสตอลท์ (Gestalt) เป็นคำในภาษาเยอรมัน หมายถึง ...

การออกแบบ UI สำหรับอุปกรณ์หน้าจอสัมผัส เช่น สมาร์ทโฟน (Smart Phones),  แท็บเล็ต (Tablets) จะมีหลายจุดที่แตกต่างจากการออกแบบ UI สำหรับใช้งานผ่านคอมพิวเตอร์ตั้งโต๊ะ (Desktop) และแล็ปท็อป ซึ่งมีเมาส์และคีย์บอร์ดเป็นอุปกรณ์ที่ใช้ในการเลือกและสั่งงาน UI ขณะที่อุปกรณ์หน้าจอสัมผัสจะใช้นิ้วมือเป็นหลัก ในบทความนี้ ผมขออนุญาตแนะนำวิธีการออกแบบ UI สำหรับอุปกรณ์หน้าจอสัมผัสในจุดที่ผมคิดว่าสำคัญซึ่งเป็นแนวทางและเทคนิคที่น่ารู้อย่างยิ่งยวดสำหรับ designer 1. ...

ขอขอบคุณ Admin เว็บ Designil ที่ช่วยแบ่งปันพื้นที่นักเขียนโนเนมให้ได้มีโอกาสถ่ายทอดความรู้ให้กับผู้คลั่งไคล้และสนใจในงาน web design ตลอดปี 2015 กับ 8 บทความที่ผมภูมิใจและตั้งใจเขียนเพื่อสนองความต้องการของตัวเองและผู้กระหายในองค์ความรู้ด้าน UI ด้วยใจที่รู้สึกตื่นเต้นและสนุกในการได้เรียนรู้สิ่งใหม่ๆ ในขณะที่ได้ลงมือเขียนทุกครั้งครา ย้อนวันวานและตามอ่านบทความย้อนหลังได้เลยครับ โดโซะๆ [hr] เทคนิคออกแบบ UI DESIGN ให้สวยด้วยความแตกต่าง 1 Pixel ...

ขอขอบคุณท่านผู้อ่านที่ติดตามหรือพึ่งจะมาอ่านจนถึงบทความนี้ ก่อนสิ้นปีนี้ ผมอยากจะมอบของขวัญชิ้นหนี่งซึ่งเป็นหนึ่งในสุดยอดวิชา การเป็นออกแบบขั้นเซียน ถ้าหากสำเร็จหรือฝึกวิชานี้แล้ว จะทำให้เราสามารถโลดโผนในยุทธจักรได้อย่างไม่ต้องเกรงกลัวฝีมือใครเลย วิชาที่ผมจะถ่ายทอดเปรียบได้กับคัมภัร์เปลี่ยนเส้นเอ็นของวัดเส้าหลินเลยก็ว่าได้ เพราะสามารถนำไปประยุกต์ได้ในหลายสถานการณ์จำเป็นและหลายรูปแบบกระบวนท่า ขอเพียงคำนึงถึงเป็นแกนหลักในขณะออกแบบ UI ก็เพียงพอแล้วครับ หลักการหรือวิชาที่ผมอยากนำเสนอคือ การทำ UI ให้เป็นลำดับชั้นตามความสำคัญ (Hierarchy)  Hierarchy หรือการออกแบบที่มีการเรียงลำดับความสำคัญขององค์ประกอบจะช่วยเรื่องการรับรู้ข้อมูลของยูสเซอร์ให้เป็นไปได้อย่างมีประสิทธิภาพ ภายใต้หลักการอ่านของยูสเซอร์ที่เป็นการสแกนอ่านข้อมูล ไม่ใช่การอ่านแบบลงรายละเอียด ทำให้การออกแบบที่มีลำดับชั้นการวางองค์ประกอบของเนื้อหาเป็นเรื่องง่ายต่อยูสเซอร์ที่จะเข้าใจได้ว่าเนื้อหาส่วนไหนสำคัญที่สุด เนื้อหาไหนสำคัญรองลงมา หรือเนื้อหาไหนที่ทางองค์กรต้องการสื่อสารให้ชัดเจนกับผู้อ่านมากที่สุด แต่จะทำได้ด้วยวิธีการใด ผมได้รวบรวมและกลั่นกรองจากประสบการณ์ สรุปออกมาเป็น ...

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

หลังจาก Apple เปิดตัว Interface ใหม่สำหรับ iOS 7 รูปแบบสไตล์ของการออกแบบไอคอนก็หันมาใช้ Line icon  หรือไอคอนแบบเส้นกันมากขึ้น เหตุผลที่ง่ายๆ คือไอคอนแบบเส้น มันดูสะอาดตากว่าแบบ Full Icon (ไอคอนแบบเต็ม) ซึ่งเข้ากับคอนเซ็ปต์การออกแบบของ Apple อยู่แล้วที่ต้องการตัดทุกสิ่งที่ไม่จำเป็นออกไป และพยายามใช้ white space ...

ไม่มีใครที่ไหนอยากจะถูกปกครองหรืออยู่ภายใต้การบังคับที่ไม่อนุญาตให้เราทำตามความต้องการของเราได้อย่างอิสระเสรี และดูเหมือนว่าการออกแบบ UI ก็ไม่ได้ต่างกับเรื่องนี้สักเท่าไรนัก การกระทำ (action) ที่เกิดขึ้นบนหน้าเว็บที่ปฏิสัมพันธ์ผ่านทาง UI ต้องเกิดขึ้นจากความเต็มใจของยูสเซอร์ ไม่ใช่เกิดจากความจำยอมนะครับ เราต้องออกแบบ UI ที่ทำให้ยูสเซอร์เกิดความรู้สึกว่าเค้ากำลังมีอำนาจในการควบคุมทุกอย่างในหน้าเว็บ (control) แม้กระทั่งทำอะไรผิดพลาดไป ก็สามารถแก้ไขหรือกลับไปสถานะก่อนหน้าได้เสมอ พูดอีกนัยหนึ่งก็คือ UI ต้องพร้อมให้อภัยยูสเซอร์เสมอ (forgiveness) มาดูตัวอย่างกันครับ ในหน้า feed ...

กฎข้อที่ 3 อย่ามากเกิน (Get rid of half the words on each page, then get rid of half of what’s left) กฏข้อสุดท้ายในการออกแบบ UI ออกจะดูแปลกๆ ...