งานออกแบบ/สินค้าตัวนี้ห่วยจัง! เพราะคนทำมีฝีมือแค่นี้(จริงเหรอ???)

พอดีไปอ่านข่าว ขอเชิญร่วมวิจารณ์แนวทางการออกแบบ เว็บไซต์ธนาคารกสิกรไทยโฉมใหม่ และ อดีตหัวหน้าทีมดีไซน์ซัมซุงเผย ทำไมผลิตภัณฑ์ซัมซุงดีไซน์ออกมาห่วย ก็เลยอยากเขียนอะไรไว้หน่อย

** สำหรับสายงานที่เกี่ยวข้องกับการออกแบบและเขียนโปรแกรมหรือITควรจะเข้าไปอ่านข่าวและคอมเมนท์เองด้วยนะ
** ล่าสุดเว็บกสิกรเปลี่ยนกลับเป็นแบบเดิมแล้วล่ะ (ภายใน1วันหลังจากlaunch 20 ก.พ.)

ส่วนใหญ่แล้ว ไม่ว่าธุรกิจอะไรก็ตามที่มีการขายสินค้าให้ลูกค้า ซึ่งในที่นี้พูดถึงทั้งเป็น "รูปธรรม (สิ่งของ hardware)" และ "นามธรรม (โปรแกรม เว็บ software)" นั้น สิ่งแรกที่ลูกค้าเห็นหรือเรียกว่าเป็น First Impression ให้เขาประทับใจหรือหรือยี้ในครั้งแรกเลยก็คือ UI - User Interface หรือ งานดีไซน์นั่นเอง

ล่าสุด กสิกรไทยได้ทำการปรับโฉมหน้าเว็บใหม่ ซึ่งก็ออกมาเป็นแบบรูปข้างบนนี่! ถ้าถามว่ามันสวยมั้ย?
คำถามนี้คงต้องย้อนถามก่อนว่า...

ถามใครล่ะ??

ถ้าคุณอยู่ในวงการพัฒนาเว็บไซต์หรือเป็นคนที่เล่นเว็บเปิดแอพประจำคำตอบ 90% น่าจะออกไปทาง "แย่มาก มันห่วยสิ้นดี!!" แต่รู้มั้ยว่าคำถามเดียวกันนี้ แต่ไปถามกับคนอีกกลุ่มหนึ่งคำตอบที่ได้อาจจะแค่ "ทำไมเหรอ ก็สวยดี(มั้ง)"

เอาล่ะ เชื่อว่าคนที่เข้ามาอ่านบล๊อกนี้น่าจะเป็นคนกลุ่มแรกมากกว่าที่เปิดเข้าเว็บไปปุ๊บก็บ่นเลยว่าใครออกแบบมาเนี่ย มันช่าง@#$%&*เหลือเกิน

ป.ล. เราก็ว่ามันไม่ได้แย่ขนาดนั้นนะ UI สวยดีแต่ UX ไม่ผ่าน -- สำหรับคนที่รู้จัก UI แต่ยังไม่รู้จัก UX ไปอ่านเพิ่มได้ที่นี่ จิ้มเลย!
ป.ป.ล. คนอีกกลุ่มที่ว่าคือกลุ่มที่ไม่ค่อยเล่นคอม/มือถือ หรือเล่นแต่เป็นคนรุ่นผู้ใหญ่ที่ไม่ค่อยสนดีไซน์เท่าไหร่นะครับ ลองถามมาแล้ว คนกลุ่มนี้ส่วนใหญ่จะบอกว่าเว็บยุคใหม่ดีไซน์เรียบๆ นี่แหละที่มันไม่สวยเพราะมันไม่มีอะไร 555

แล้วออกแบบเช่นนี้มา มันไม่ดีตรงไหนเหรอ

เท่าที่อ่านคอมเมนท์ของแต่ละเจ้าที่มาวิจารณ์ ส่วนใหญ่จะบอกว่าหน้าเว็บนี้มันคงจะดี ถ้าเป็นยุคปี90s-ช่วงปี2000 ที่หน้าจอคอมพิวเตอร์ถูกจำกัดแค่ 800 x 600 px แล้วการออกแบบเว็บโดยใช้ Flash ทั้งหน้ายังเป็นที่นิยมอยู่

แต่นี่มันปีอะไรเข้าไปแล้วครับ 2015 ... 2015แล้วท่าน เดี๋ยวนี้เทรนด์เขานิยมเว็บคลีน ของไม่รก อ่านง่ายหาของง่าย และที่สำคัญคือต้อง Responsive เปิดในจอขนาดเท่าไหร่ก็ได้ตั้งแต่หน้าจอคอมไปจนถึง Smartphone พูดง่ายๆ คือดีไซน์ใหม่นี่มันไม่ตอบโจทย์พวกนี้เลย ให้ตายเถอะ! (ยิ่งคุณเห็นมันแล้วหงุดหงิดเท่าไหร่ แสดงว่าคุณมีความเป็น Developer/Power User เท่านั้น เพราะจากที่ไปถามมา End User จริงๆ จะบอกแค่ว่า "ก็สวยดี" เมื่อคุณไปถามเขา)

โอเคมาเข้าเรื่องกันดีกว่า...
(อ้าว แล้วที่เกริ่นมายืดยาวนี่ยังไม่เข้าอีกเหรอ 555 ยัง!)

[แปล] User eXperience (UX) - ตอนที่ 2 สร้างตัวแทนผู้ใช้กับ Persona

คงเคยสินะ สถานการณ์กลืนไม่เข้าคายไม่ออกหลังจากเข้าห้องประชุมมาสามชั่วโมงแล้วก็ยังไม่มีทีท่าว่าจะหาข้อสรุปได้ตอนแรกก็ไม่เท่าไหร่หรอกนะ แต่ละคนเริ่มระดมไอเดียกันเพื่อแก้ปัญหาที่ทีมกำลังพบเจอ แต่หลังจากไอเดียมากมายพรั่งพรูออกมา คนนั้นก็อยากได้อันนั้น คนนี้ก็อยากได้อันนี้ ส่วนเราก็มีไอเดียของเรา แล้วเถียงยังไงมันก็ไม่มีวันจบเพราะแต่ละคนมีเหตุผลของตัวเอง

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

สิ่งที่จะเกิดขึ้นก็คือรถคันนั้นจะเต็มไปด้วยฟังก์ชั่นทุกอย่างที่คนอยากได้ แต่..

ไม่มีใครอยากใช้มันล่ะ!

เหมือนเวลาที่คุณจะซื้อของอะไรบางอย่าง มันดูดี มีฟังก์ชันการใช้งานหลากหลาย น่าใช้มาก แต่คุณดันไม่ซื้อมันแต่กลับหยิบสินค้าอีกชิ้นที่มันทำอะไรไม่ค่อยได้แต่ถูกใจคุณเดินไปเคาเตอร์จ่ายเงิน
เหมือนกับคำกล่าวที่ว่า

“I don’t know the key to success, but I know the key to failure is trying to please everybody”

(เราไม่รู้หรอกว่าหนทางสู่ความสำเร็จคืออะไร ... แต่เรารู้ว่าหนทางสู่ความล้มเหลวก็คือการพยายามทำให้ทุกคนชอบมัน)

ลองจินตนาการต่ออีกหน่อยว่าถ้าคุณได้รับมอบหมายให้ไปแก้ปัญหาในร้านอาหารเหตุหนึ่งนะ

คุณเลือกที่จะทำอะไร ระหว่าง

- สร้างเมนูอาหารที่หลากหลาย 30 จานที่มั่นใจว่าลูกค้าไม่ว่าจะมีรสนิยมแบบไหนก็ต้องถูกใจสักจาน

หรือ

- ลดเมนูอาหารจาก 30 จานให้เหลือเพียงแค่ 10 จาน และทำ 10 จานนั้นให้มีคุณภาพที่ดีที่สุด

สรุปก็คือ ไม่ต้องพยายามทำให้ Product ของเราตอบสนองความต้องการของลูกค้าทุกคนหรอก ขอแค่ทำบางอย่างเพื่อให้ตอบสนองต่อความต้องการของคนให้ถูกกลุ่มแบบเฉพาะเจาะจงไปก็พอแล้ว

มารู้จักกับ Persona กัน

ในฐานะคนสร้าง Product แล้วเราก็ต้องการออกแบบให้ตรงความต้องการของลูกค้ามากที่สุดใช่มั้ยล่ะ เพราะถ้าลูกค้าพอใจก็ปิดจ๊อบเร็ว (และรับเงินเร็ว 555)

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

ดังนั้นเราจะสร้างสิ่งหนึ่งขึ้นมาเป็นตัวแทน User ทีนี้เวลาประชุมก็เลิกคิดซะทีว่าเราอยากได้อะไร แต่ให้เปลี่ยนเป็น เจ้าตัวแทนผู้ใช้คนนี้น่ะมันอยากได้อะไร!!

[แปล] User eXperience (UX) - ตอนที่ 1 อะไรคือUXกันนะ ทำไมถึงสำคัญนัก

พอดีที่ออฟฟิศมาเปิดคอร์ส UX User Experience: The Ultimate Guide to Usability โดย Dr David Travis ซึ่งจริงๆ มันเป็นคอร์สเสียเงินแต่บอสใจดีออกค่าเรียนให้ เลยขอเอาที่ดูมาสรุปไว้ในบล๊อกนี้ละกัน

เวลาเราจะสร้างโปรแกรมขึ้นมาโปรแกรมหนึ่ง (หรือออกแบบดีไซน์อะไรบางอย่าง) ไม่ว่าจะเป็นโปรแกรมแบบ Desktop Web หรือ Mobile ก็ตาม คนส่วนใหญ่มันจะคิดถืงแต่ "ความสวยงาม" เป็นหลัก

อ้าว พูดงี้แล้วมันไม่ถูกเหรอ ออกแบบออกมาถ้าสวยก็ทำให้คนประทับใจได้ก่อนแล้วนะ แบบ First Impression ไงล่ะ

ก็ถูกนั่นแหละนะ แต่...

เคยไหม ... โหลดแอพมาเล่นเพราะดูจากใน preview แล้วแอพมันสวยเหลือเกิน แต่พอโหลดมาใช้แล้วกลับมาความรู้สึกว่ามันยังไม่ใช่ แล้วก็ไม่เปิดมันมาใช้อีกเลย
และเคยไหม ... แอพอะไรก็ไม่รู้ โหลดมาเล่นๆ ดีไซน์ไม่สวยเอาซะเลยแต่เรากลับเปิดใช้มันทุกวัน

การดีไซน์productออกมาให้สวยงามมันไม่ได้แปลว่ามันจะน่าใช้หรอกนะ เราต้องคิดด้วยว่าถ้าเราเป็น User แล้วเจอโปรแกรมแบบนี้ เราจะชอบมันหรือไม่อยากเปิดมันมาใช้อีกเลย

แยกให้ออกระหว่าง UX กับ UI

UX (User eXperience) กับ UI (User Interface) เป็นสิ่งที่ดีไซน์เนอร์มือใหม่หลายคนไม่เข้าใจมัน
เพราะการออกแบบโปรแกรมไม่เหมือนกับการออกแบบสื่อสิ่งพิมพ์ (โปรแกรมมันต้องมีการตอบโต้กับผู้ใช้ แต่พวกสื่อสิ่งพิมพ์คนอ่านจะมองแต่ภาพ ถ้าเห็นแล้วคิดว่าสวยก็ถือว่าใช้ได้)

สำหรับดีไซน์เนอร์ อาจจะเคยได้ยินคำว่า UI กันบ่อย เพราะมันก็คือการดีไซน์ให้หน้าตาของโปรแกรมเราสวยงามดูหรูหราอลังการไฮโซ ... ส่วน UX ล่ะ มันคือสิ่งที่ว่าด้วยความรู้สึกของผู้ใช้ ซึ่งความสวยงามของการดีไซน์นั้นไม่ได้ช่วยให้โปรแกรมใช้ง่ายขึ้นแต่อย่างใด

มีภาพชุดหนึ่งที่เราเห็นว่าเขายกตัวอย่างข้อแตกต่างระหว่าง UX กับ UI ได้ดี เป็นภาพจาก design.org เราลองมาดูกัน

ในตัวอย่างนี้เขาเปรียมเทียบโปรแกรมของเราเป็น "อาหารเช้าคอนเฟล็ก" การใช้ของก็ง่ายๆ คือเอาไว้กินล่ะนะ (ฮา)

ตัวแรกสุดคือ Product หรือก็คือตัวแทนโปรแกรมที่เราจะออกแบบนั่นแหละซึ่งในที่นี้ก็คือถ้วย ช้อน และคอนเฟล็ก (อาหารเช้าแบบซีเรียลรับประทานพร้อมนมสด)

ดังนั้น ขอถามว่าเราจะกินคอนเฟล็กพวกนี้ยังไงกัน?
คำตอบก็คือใช้ส่วนติดต่อกับผู้ใช้ User Interface ซึ่งในที่นี้มันคือ "ช้อน" นั่นเอง!

เอาล่ะ การออกแบบ UI ที่ดีก็คือการออกแบบเจ้าช้อนนี่ให้มันสวยงาม อาจจะเป็นช้อสแตนเลสมีลายอะไรประมาณนั้น ผู้ใช้จับช้อนขึ้นมาแล้วอาจจะร้องว้าว ช้อนสวยจังอะไรทำนองนี้

แต่ความสวยงาม (UI) ที่พูดไปเมื่อกี้อาจจะไม่มีประโยชน์เลยถ้าเกิดว่า User ไม่ได้สนใจความสวยงามพวกนั้น เพราะเขากำลังหิว!

เพิ่งตื่นมาเช้าๆ สมองยังเบลออยู่ และหิวมาก ถ้าจากสเต็ปเมื่อกี้คุณบอกว่าคุณออกแบบช้อนอย่างวิจิตรอลังการมีแกะสลักลายด้วย รายละเอียดพวกนี้คงไม่ใช่สิ่งที่ User สนใจเท่าไหร่นัก เพราะตอนนี้พวกเขาขอให้มันเอาไปใช้ตักอาหารเข้าปากได้ก็พอแล้ว

ลองคิดดูสิ ว่าถ้าคุณอาจจะตักคอนเฟล็ก แล้วเราเอาช้อนเล็กๆ แต่สวยนะ ดีไซน์ดีสไตล์มากให้คุณ คุณอาจจะชอบมันในตอนแรกที่ได้รับ แต่พอลองตักอาหารดูแล้วก็จะเริ่มพบว่ามันตักยาก ตักนมก็ไม่ได้ คุณก็จะเริ่มหงุดหงิดแล้วเดินไปหาช้อนใหญ่ๆ มาใช้แทนโดนไม่สนว่าช้อนมันจะดีไซน์เป็นอย่างไรจริงไหม

พอเห็นภาพแล้วสินะว่า UX มันคือการออกแบบที่คิดถึงจิตใจของ User มากๆ โดยไม่สนใจความสวยงามเลย (แต่ก็ใช้ว่า ไม่มี UI ได้นะ ถึง UX จะดีงามแต่ถ้ามันไม่สวย User ก็ปิดทิ้งได้เหมือนกันนา)