It’s all about user experience.

Archive for the ‘Inspiration’ Category


World Usability Day 2009

Nov 17, 2009 Author: mk | Filed under: Inspiration

อาทิตย์ที่แล้วได้รับเชิญจาก Usable Labs มหาวิทยาลัยสงขลานครินทร์ ให้ไปร่วมเสวนาในงาน World Usability Day 2009 ที่ มอ. หาดใหญ่มาครับ ไหนๆ เรามีเว็บ Usably (ที่ไม่ค่อยได้อัพเดต) กันอยู่แล้ว ก็เอาเรื่องมาเล่าตรงนี้ละกันจะได้มีความเคลื่อนไหวกันหน่อย

งาน World Usability Day เป็นแคมเปญที่คนสายงานด้าน usability ในโลกร่วมกันจัดขึ้นปีละครั้ง โดยเลือกวันพฤหัสบดีที่สองของเดือนพฤศจิกายนเป็นหลัก ที่ผ่านมาก็มี 43 ประเทศจัดงาน World Usability Day กันครับ (ดูแผนที่ประกอบ มันเยอะกว่าที่คิดมาก) ของเมืองไทยเองก็เป็นครั้งแรกที่จัดในคราวนี้ล่ะ

(more...)

OS Design History 1981-2009

Nov 12, 2009 Author: Champ | Filed under: Inspiration

จริงๆ ลิงค์เก่าแล้วหละครับ แต่ผมเพิ่งไปเจอมา น่าศึกษาทีเดียวนะ เห็นการเปลี่ยนแปลงได้อย่างชัดเจน โดยเฉพาะจาก Win 98 -> XP และการเริ่มต้นของ OS X

os

ตามลิงค์โลด!

fontuse

พอดีไปเจอบทความที่เฉลยฟอนต์ในโลโก้ของเว็บดังๆ มา (ส่วนใหญ่จะไม่รู้จักชื่อ) เลยมาโพสท์ลิงค์สั้นๆ ครับผม (เผื่อจะหนีไปจาก Helvetica, Arial, ...) ได้ :p

Fonts Used In Logos of Popular Websites

โดยคุณ อธิคม อัศวานันท์ กรรมการผู้จัดการบริษัท Intersteps และ Marketing Director บริษัท Midas Creative ในเครือ JSL

ยกมาเฉพาะส่วนต้นๆ ที่เหลืออ่านต่อกันเองน่อ

“การทำ Usability Design ทำให้งานออกมาไม่สวย หรือไม่ตรง Brand” ซึ่งก็เป็นหัวข้อที่คงต้องถกกันไปอีกพักหนึ่ง เพราะถ้ามองในฐานะ User การที่เราจะเข้ามาใช้บริการหรือหาข้อมูลบน Web เราอยากจะให้ข้อมูลหาง่าย และไม่ซับซ้อน หรืออยากเห็น Graphic สวยๆ แต่หาข้อมูลอะไรไม่เจอเลย

สมัยที่ผมยังเรียนหนังสืออยู่ในต่างประเทศ User Experience ยังเป็นสิ่งที่ในตลาดยังไม่ให้ความสำคัญนัก แต่มีอาจารย์อยู่ท่านหนึ่งที่สนใจ และให้ความสำคัญมากเกี่ยวกับการทำ Usability Design โดยใน Class ที่สอน ท่านจะไม่ยอมให้นักเรียนใช้ Computer ในการออกแบบ website เลย จนกว่าจะออกแบบ Architecture วางโครงสร้าง และ Navigation ของ website ให้เสร็จ แล้วให้ทั้งชั้นเรียนทดสอบวิธีการใช้อย่างละเอียดให้เรียบร้อยก่อน ว่าใช้ได้ง่ายจริง และตรงตามจิตวิทยาของผู้ใช้

ในช่วงแรกก็มีนักเรียนหลายคนที่ไม่เห็นด้วยกับหลักคิดและต่อต้าน แต่ภายหลังจากเรียนกับอาจารย์ท่านนี้ ทำให้พวกเราส่วนใหญ่เริ่มเห็นด้วยว่าการออกแบบ website หรือระบบต่างๆ ถ้าผลออกมาแล้วใช้ยากและซับซ้อนเกินไป หรือไม่ตอบโจทย์การทำงานทั้งหมด ถือว่ากระบวนการทำงานนั้นๆ เปล่าประโยชน์ โดยปัจจุบัน อาจารย์ท่านนี้ได้เปิดบริษัทของตัวเอง และเป็นคนออกแบบ User Experience ให้กับ website ในเครือของ CNN รวมถึงบริษัทยักษ์ใหญ่หลายแห่ง และเพื่อนร่วมชั้นหลายๆ คน ก็เป็น User Experience Designer ให้กับบริษัทชั้นนำ อย่าง Sony Play Station, Fox News and Apple

เคยเขียนเรื่อง ผลการประกวด Mozilla Labs Design Challenge Spring 09 ไปแล้ว คราวนี้เป็นผลการประกวดรอบ Summer 09 ในหัวข้อให้ออกแบบระบบ Tab แบบใหม่ให้ Firefox ครับ

รางวัลชนะเลิศแบ่งเป็น 5 หมวด ผมคัดที่ชอบมา 3 อันละกัน

(more...)

วันนี้เพิ่งมีข่าว Google มีแผนจะทำ Google Chrome OS ซึ่งเน้นไปที่กลุ่มผู้ใช้เน็ตบุ๊ค (แต่ยังไม่มีภาพ mock-up หรือ screenshot มายั่วน้ำลายแต่อย่างใด) เลยเอา Intel's Moblin ซึ่งเป็นอินเตอร์เฟสสำหรับเน็ตบุ๊คเช่นกันมาฝากครับ

ดูแล้วก็เข้าท่าดี แต่ผมชอบ Jolicloud มากกว่า

สนใจเพิ่มเติม ตามลิงค์นี้ไปเลยครับ :-)

Microsoft Office 2010 The Movie

May 14, 2009 Author: Champ | Filed under: Inspiration

office2010

เว็บโปรโมต Microsoft Office 2010 คราวนี้เขาทำแบบเปิดตัวหนังเรื่องหนึ่งกันเลยทีเดียวครับ

Narrative: There are five billions working people in the world. In 2010, their hero will arrive.
เทอร์มิเนเตอร์!

ปล. ไม่ค่อยเกี่ยวกับ Usability เท่าไหร่ แต่อาจจะเกี่ยวกับ User Experience (beforehand)

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

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

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

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

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

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

globalnavbg

ฟอนต์ Comic Sans ที่มากับวินโดวส์เป็นฟอนต์ยอดนิยมติดอันดับต้นๆ ของโลก แม้ว่าจะมีคนเกลียดมันมากมายแค่ไหนก็ตาม ใครจะไปรู้ว่าแท้จริงแล้วมันเป็นเรื่องฟลุก คนสร้างเองยังไม่ใช้ และมันลอกแบบมาจากตัวหนังสือในการ์ตูน The Dark Knight Returns

comicsans

Wall Street Journal มีสกู๊ปสัมภาษณ์นาย Vincent Connare ดีไซเนอร์ชาวอังกฤษที่เป็นคนออกแบบฟอนต์นี้ ที่มาของเรื่องคือเขาอยู่ในทีมสร้าง Microsoft Bob และมีอยู่วันหนึ่ง เปิดโปรแกรมมาเจอการ์ตูนหมาพูดข้อความในช่องคำพูด แต่ฟอนต์ที่ใช้ดันเป็นคลาสสิกโกธิกอย่าง Times ทำให้เขาทนไม่ได้ต้องมาทำฟอนต์ใหม่ให้เข้ากัน เผอิญในออฟฟิศมีหนังสือการ์ตูนเพียงสองเล่มเท่านั้นคือ The Dark Knight Returns กับ Watchmen

Vincent บอกว่าฟอนต์ที่เขาภูมิใจที่สุดคือ Magpie แต่ก็มักจะถูกความดังของ Comic Sans กลบซะหมด โดยส่วนตัวแล้วเขาไม่ได้ใช้ Comic Sans (ปัจจุบันไมโครซอฟท์เป็นเจ้าของ) แต่ก็ไม่ปฏิเสธอะไรเวลามีคนมาตื่นเต้นเมื่อรู้ว่าเขาเป็นคนสร้างฟอนต์ยอดนิยมอันนี้

ปัจจุบันมีขบวนการเรียกร้องให้แบน Comic Sans เป็นจำนวนมากบนอินเทอร์เน็ต ตัวอย่างคือ Ban Comic Sans ซึ่งริเริ่มเมื่อปี 1999 โดย Holly Sliger นักศึกษาหญิงสายการออกแบบ ที่ผมชอบมากคือ ระหว่างรณรงค์ เธอพบกับนักศึกษารุ่นพี่และดีไซเนอร์คนหนึ่งซึ่งเขาเห็นด้วยกับเธอว่า "This is horrible" ในใจของเธอตอนนั้นบอกว่า "That's when I knew he's the guy I would marry." และทั้งสองคนก็แต่งงานกันในอีก 1 ปีถัดมา

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

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

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

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

Categories