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

แน่นอนว่า สรุปแล้วก็คือ การทำให้การเอาเมาส์ไปชี้แล้วเมนูเหล่านี้ "โดดเด่นน่าจิ้ม" นั่นเอง

เชิญอ่านที่ Spoonfed Design

ปล.
หลังๆ นี่เห็นเว็บแต่ละแห่งพยายามรวมกันไปรวมกันมาทั้งนั้น ไม่มีใครจะเขียนอะไรกันใหม่ๆ แล้วหรือค้าบบบ

ปอ. (เลียนแบบคุณแอน - ไม่รู้แปลว่าอะไรเหมือนกัน)
บันทึกนี้ก็เป็นหนึ่งในการ "รวมกันไปรวมกันมา" เช่นกัน เฮ้ย เขียนอะไรใหม่ๆ กันบ้างดิ๊

ปฮ. (ตกลงแปลว่าอะไรเนี่ย ไอ้ ปอ. ปฮ. เนี่ย)
มีตัวอย่างเว็บแอปเปิ้ลด้วย ขอบอกว่าเมนูเค้านี่แหละ เป็นต้นฉบับให้กระผมลอกมาหลายทีและ (ทั้งเมนู ทั้ง css พี่ท่านคิดมาดียิ่งนัก) ดูรูปได้ แต่อย่าทะเลาะกันในนี้เลยค้าบ ไปทะเลาะที่บล็อกนั้นละกัน

ที่นี่ พี่เขายกตัวอย่างการออกแบบหยุมหยิมจิ้มนิดจิ้มหน่อย แต่จิ้มแล้วโดน แตะแล้วสวย จากหลากหลายตัวอย่างเว็บที่พิถีพิถันในการลงรายละเอียด (อาทิ มีความเชี้ยะอย่างที่คุณ iMenn ว่าไว้)

ตามไปดูที่ wefunction.com จ้ะ

เพิ่งมาเจอเว็บที่รวบรวมกับ แนวทางการออกแบบ (Design Pattern) นั่นคือ ตัวอย่างงานออกแบบสำหรับกรณีต่างๆ เช่น หน้าลงทะเบียน, โหวต, การดูรายละเอียดรูป ฯลฯ มีทั้งที่เว็บแบ่งประเภทไว้ให้ (Design Pattern), มีทั้งหน้าจอตัวอย่าง (Screen Shot) และรูปจากทางบ้าน (User Sets)

ดีไซน์ แพทเทิร์น (Design Pattern) นั้นเป็นศัพท์ที่ใช้กับหลายแวดวง ทั้งการออกแบบกราฟฟิค, เขียนโปรแกรม, CSS, การทำ User Interface ความหมายคือ เมื่อมันมีการเกิดขึ้นซ้ำๆ แล้ว ก็สมควรเรียกว่า "แนวต่างๆ" ได้แล้ว เหมือนกับที่เราฟังเพลงมาเยอะๆ แล้วเราก็แบ่งประเภทของเพลงต่างๆ เป็น "แนวเพลง" (มันไม่ได้ลอก มันแค่แนวเดียวกัน)

เอ้า งั้นมาดูการออกแบบแนวต่างๆ กันบ้าง

เชิญที่ UI-Patterns.com คร้าบ

คงรู้สึกเป็นการเปรียบเทียบที่เกินเลยไปมาก หากเป็นสาวก Joomla หรือ Drupal (กระผมเดาว่า สาวก Drupal ทั้งหลาย น่าจะชอบว่า Drupal เป็น Linux มากกว่าให้เจ้า Joomla ที่ฟีเจอร์เยอะ แต่เทอะทะ งุ่มง่ามมาเป็น Linux)

แต่กระผม ผู้เป็นสาวก Wordpress และ สาวก Mac ย่อมชื่นชมวาทกรรมชวนเชื่อนี้อย่างยิ่ง และอดไม่ได้ที่จะมาบล็อก!!

แม่ค้าร้านตลาดชอบละครตบตีกัน เราชาวไอทีก็ชอบสงครามน้ำลายนี่เช่นกัน เมื่อสำนักข่าว Slashdot กล่าวถึง บันทึกที่เปรียบเทียบ Open Source and usability: Joomla vs. WordPress ก็มีคนมาโต้ตอบกันมากมาย ไม่ขอแย้งคนโต้ ขอแค่สรุปคนเขียนละกัน

เค้าบอกว่า จากประสบการณ์การนำ Joomla และ Wordpress ไปทำเว็บให้ลูกค้า, Joomla นั้น Feature เยอะกว่า ตอบสนองความต้องการได้รอบด้านกว่า แต่กระบวนการทำงานแต่ละเรื่องนั้น "เข้าถึงการใช้งาน" (Usability) ยุ่งยากกว่า Wordpress

โดยเค้าได้ยกตัวอย่างขั้นตอนเปรียบเทียบกันว่า หากจะเขียนโพสต์ข่าวที่มีรูปประกอบ หรือการสร้าง "หน้า" เนื้อหาของเว็บโดยให้ปรากฏในเมนู ถ้าใช้ Wordpress นั้น จะมีไม่กี่ขั้น ส่วน Joomla มีหลายขั้น

และมีแนวคิดเรื่องการออกแบบที่น่าสนใจ ที่เค้าบอกว่า

"WordPress has really been developed by the KISS-principle, while Joomla! appears to have been developed to solve every problem on Earth (by engineers, for engineers)."

คือ Wordpress นั้น ยึดหลัก KISS อย่างเหนียวแน่น (KISS คือ "Keep it Simple, Stupid" หรือ จงทำให้ง่ายๆ โง่ๆ เข้าไว้ (อันนี้เป็นคำขวัญออฟฟิศผมเหมือนกัน ทั้งนัยแห่งการชื่นชมและประชดประชัน - "ง่ายๆ โง่ๆ") แต่ Joomla นั้นทำให้มันซับซ้อน แก้ปัญหาซะทุกอย่างในโลกนี้ และเหน็บแหนมว่า สร้างโดยวิศวกร เพื่อวิศวกร ไม่ใช่เพื่อคนทั่วไป)

สรุป: กระผมเป็นสาวก Wordpress และสาวก Mac, กระผมชื่นชอบความเรียบง่าย และความง่ายๆ โง่ๆ, กระผมชื่นชอบวิวาทะ เหมือนที่แม่บ้านชื่นชอบละครหลังข่าว

ดังนั้น สาวก platform อื่นๆ ทั้งหลาย เชิญมาวิวาทะกันได้ ฮิฮิ

ปล. พูดถึง CMS และ Usability ใครว่างเรียนเชิญชมน้องใหม่ของวงการ Concrete5 นะครับ เห็นเดโมแล้วอยากกราบ โอ้ งามแท้ ผนวกหน้าบ้านหลังบ้านเนียนโคตร

เพิ่งจะรู้ว่าเทรนด์การออกแบบสุดฮิตในระยะนี้ ฝรั่งเค้าเรียกกันว่า "aurora/color spectrum" ซึ่งผมเองเรียกว่า "ลูกกวาด" (color spectrum) หรือ "ฟิ้งๆ" (aurora) มาเสียนาน

ปีที่แล้ว เทรนด์สุดฮิตคือ "Grunge" นะครับ (ลองหาในกูเกิ้ล ก็เจอเพียบๆ) ซึ่งเมื่อเริ่มฮิต ก็เริ่มมีคนเอาของมาแจก (ลองดูใน vecteezy.com ก็จะเห็นเยอะมาก)

ปีนี้ มีเทรนด์ลูกกวาดมาไม่ทันไร ก็มีคนเอาของมาแจกกันอีกแล้ว (ตอนนี้ยังเป็น Bitmap, อีกไม่นาน ต้องมี Vector แน่นอน)

เชิญที่ 26 Gorgeous Aurora And Colour Spectrum Wallpapers ขอรับ

แถมอีกเว็บ อันนี้ก็งามแต๊ เชิญที่ sevenedge blog

จะเห็นว่าโลกนั้นเปลี่ยนวนไปมาระหว่างความซับซ้อนและความเรียบง่าย

โลกของการดีไซน์ เราคง minimal กันจนไม่รู้จะลดทอนอะไรกันแล้ว ตอนนี้เลยเป็นแนวโน้ม "รก" แทน

ส่วนโลกของอินเตอร์เฟสที่ใฝ่หาความเรียบง่าย ก็คงเพราะก่อนหน้านี้ อะไรต่อมิอะไรมันรกเสียเหลือเกิน ปุ่มยุ่บยั่บ, ตัวเลขไม่มีความหมายไปเรื่อย, และก็ ไม่มีใครใช้เป็น

เอ้า นึกว่าหัวข้อนี้จะไม่เกี่ยวกับประเด็น Usable ของเว็บนี้ซะแล้ว ลากมาเกี่ยวจนได้ (หน่อยนึง)

สวัสดี (ไปดีกว่า... )

เห็นข่าวที่คุณ mk นำมาลงที่ blognone แล้วก็เกิดความปรีดาปราโมทย์เป็นอย่างยิ่ง, ปกติเราเป็นคนชอบแคปเจอร์อะไรแปลกๆ มาเก็บไว้ดูทีหลังอยู่แล้ว พอได้เห็นคลิปวิดีโอ Microsoft 2019 ที่แสดงวิสัยทัศน์ของไมโครซอฟท์ว่าอีก 10 ปี คอมพิวเตอร์จะหน้าตา ฟังก์ชั่น ฟีเจอร์เป็นอย่างไร แล้วก็ยิ่งยินดี แคปเจอร์กันมือระวิง

เท่าที่สังเกตดู อินเตอร์เฟซต่างๆ ในคลิปวิดีโอนี้ ใช้สีน้อยลง ส่วนใหญ่จะเป็นสีในโทนฟ้า เขียว น้ำตาล (อาจเกี่ยวข้องกับโทนของวิดีโอที่ดูรักษาสิ่งแวดล้อมชะมัดด้วยก็ได้) Round Corner ยังคงอยู่, ฟอนต์ใช้แบบบางๆ เป็นหลัก ก็ทันสมัยนี่เคอะ, ไอคอนเป็น monotone, อีก element ที่เห็นว่าใช้บ่อยมากคือวงกลมแบบมีด้านหนึ่งเป็นสี่เหลี่ยมอย่างที่เห็นนี้

เจ้านี่มีชื่อมั้ยครับเนี่ย?

โดยส่วนตัวคิดว่าข้อมูลบางส่วนใส่เข้ามาให้ดู "เยอะๆ" "Info เยอะๆ สิโว้ยจะได้ดูแน่นๆ" ไปหน่อย ฟอนต์ของข้อมูลบางอย่างเลยถูกหดเสียจนกระจิดริดขนาดว่าถ้าไม่มองในระยะ 5 เซ็นติเมตรคงอ่านไม่ออก

บ่นมาเยอะแล้ว ไปดูรูป (พร้อมคอมเมนต์เลวๆ ของข้าพเจ้า) กันเลยดีกว่าครับ (รูปเยอะนะ)

(more...)