วันนั้นทีม UX ของผมเหลือกันเพียงแค่ 2 คน ไม่ใช่ 2 คนแบบในซีรีส์ที่ฟอร์มทีมแล้วเปลี่ยนโลกนะครับ แต่เป็นคนหนึ่งกำลังจะลาออกไปเปิดร้านหมูกระทะ ส่วนอีกคนคือคนที่ไม่รู้ว่าเอาตัวรอดเพราะหน้าด้าน หรือแค่ยังไม่ได้รับ Offer ที่ดีกว่ากันแน่
และในจังหวะที่เรากำลังนั่งเงียบๆ ทำใจกับความเวิ้งว้างของ Sprint Board ซุปเปอร์ PM ก็เดินเข้ามาพร้อมคำถามสไตล์บัวไม่ให้ช้ำ น้ำไม่ให้ขุ่นว่า “พี่ พรุ่งนี้มี Flow หน้าล็อกอินไหม จะได้ส่งขึ้น Sprint” ผมกลืนน้ำลายดังเอื๊อก แล้วหันไปมอง Figma ที่ออกแบบไว้ ทั้งๆ ที่ยังไม่รู้เลยว่าผู้ใช้คือใคร ณ จุดนั้น สิ่งเดียวที่ยังอยู่กับผม คือ Design System (ที่ซื้อมาด้วยเงินตัวเอง)
จากตอนที่แล้ว ผมเขียนไว้ว่า Design System คือระบบความเข้าใจร่วม ของวิเศษที่เกิดมาเพื่อให้ Designer, Developer, Product Manager ยัน Marketing พูดภาษาเดียวกันสักที แต่นั่นคือโลกในอุดมคติ โลกที่มีเวลา มีกำลังคน มีหัวใจ ไม่ใช่โลก UX Apocalypse ที่เราอยู่ตอนนี้ ในมัสติเวิร์สที่ระบบปฏิบัติการหลักคือ เดี๋ยวค่อยคิดเด้อ หรือไม่ก็ เอาไว้ก่อน
Design System ไม่ได้มีไว้เพื่อใช้งาน แต่มีไว้เพื่อบนบานศาลกล่าว เพราะมันขลังชนิดที่ว่าไม่มีใครกล้าแตะไฟล์ หรือหยิบมาใช้ แม้จริงๆ มันควรจะเป็นของชิ้นเดียวที่ยังพอพิงได้ในวันที่ทุกอย่างล้มพังครืนเหมือนโดมิโน
ในโลกที่ทุกอย่างเร่งด่วน แม้แต่ Design Sprint ยังเอาไม่อยู่ เพราะพี่จะเอาของพรุ่งนี้ แล้วบอกว่าต้องเสร็จตั้งแต่เมื่อวาน ใครไหนกันจะตามใจพี่ไหว การเกิดมีของ Design System มันอาจไม่ได้ช่วยให้เรา ออกแบบอะไรได้หรูหราเท่าไหร่ แต่มันช่วยให้เราทำงานต่อได้ แม้วัน (Req) มามาก
เราไม่ต้องมานั่งวาดปุ่มใหม่ ไม่ต้องมานั่งคิดว่า Spacing กี่ px ถึงจะไม่โดน Dev ด่า หรือไม่ต้องมาถกกับ PM ว่าทำไม Toast Message ต้อง Fade-In เราก็เพียงแค่หยิบของมาจาก System มาต่อๆ เข้าด้วยกัน ออกแบบด้วยความไวแสง และหวังให้ “User Don’t Cry”
ในยุค UX Apocalypse — Design System ไม่ใช่ของวิเศษ แต่มันคือกระเป๋ายารักษา กล่องเล็กๆ ในยุควันสิ้นโลก ที่แม้แต่ยาแผลแดงก็โคตรจะมีประโยชน์ อย่างน้อยในนั้นก็มีกระดาษทิชชู่เอาไว้เช็คน้ำตา ซึ่งมันอาจจะรักษาไม่ได้ทุกแผล แต่มันช่วยให้เรา ยังพอขยับนิ้วลาก Component ไปได้อีกนิด ก่อน Deadline จะลากเราไปกินทั้งตัว
Design System รักษาอะไรได้บ้าง
รักษาเวลาที่เหลือน้อย
เคยไหม อยู่กลาง Sprint เวลาเหลือน้อยเต็มที PM เดินมาบอกว่า "ขอ Redesign Flow Onboarding หน่อย พอดีทีม Marketing อยากให้มัน Friendly ขึ้นครับ" (ครับพี่ ผมก็อยาก Friendly กับชีวิตอยู่เหมือนกัน) แต่ในจังหวะนั้น ไม่มีเวลา Brainstorm ไม่มีเวลา Test สิ่งเดียวที่ยังอยู่ คือ Design System ที่ทีมเก่าทิ้งไว้ กับความหวังว่ามันจะไม่พัง เราหยิบ Component ที่เคยใช้ ลากมาต่อเป็น Flow แบบ Half-Automatic แล้วส่งให้ Dev ไปอย่างเฉียดฉิว ผมไม่ได้ภูมิใจกับมันหรอก แต่มันคืองานที่เสร็จในเวลาที่ไม่มีอะไรเสร็จเลย
รักษาความเข้าใจร่วม
เมื่อทีม Dev ถามเรื่อง State Interaction เราไม่ต้องไปวาด Hover ใหม่ แค่ส่ง Guideline ที่เคยเขียนไว้พร้อมบอกว่า "เหมือนหน้า Checkout ที่เราใช้ไปตอน Release ก่อนนั้นแหละ" (ถ้า Dev ดีเราจะรอด แต่ถ้าไม่ก็ตัวใครตัวมัน) หรือแม้แต่เรื่องคลาสสิคที่เถียงกันคอเป็นเอ็นคือเรื่อง 'สี' ที่ไม่สามารถอธิบายได้ว่าาีหลักเป็นสีน้ำตาลนะ บางคนมองเป็นสีเปลือกไม้ บางคนมองเป็นสีขาวของน้ำตาลทราย สุดท้ายจะจบได้ด้วย HEX นั้นแหละครับ
รักษาโปรเจกต์ที่ Chaos
เมื่อเราเข้าไปรับช่วงโปรเจกต์ที่ไม่มี Design Handover ไม่มี Spec สิ่งเดียวที่ยังอยู่คือ Design System เราเปิดดูไฟล์แล้วเจอปุ่มที่คุ้นๆ ที่ยังพอ Sync กับ Dev ได้ แน่นอนว่าเราหายใจต่อได้อีกนิด เพราะรู้ว่าเรายัง สร้างของใหม่ต่อจากจุดนั้นได้ แต่ก็เหนื่อยหน่อยในการรื้อค้นสิ่งศักสิทธิ์ที่ไม่มีใครแตะเลย
รักษาความสม่ำเสมอของ UX/UI
ผู้ใช้ไม่อยากเรียนรู้ใหม่ทุกครั้งที่เจอหน้าใหม่ๆ เขาอยากรู้ว่า ปุ่ม Submit อยู่ตรงไหน สีไหนคือปลอดภัยกดได้ หรือสีไหนคือพี่แน่ใจเหรอว่าต้องกดอันนี้อะ Design System ช่วยให้ Product ของเราดูเป็นคนเดียวกัน แม้มันจะมีหลายทีม หลายจอ หลายเจตนา และหลาย Persona (หรือเรียกได้ว่าไม่มีนั่นเอง) ก็ตาม
รักษาความยืดหยุ่นในการปรับตัว
วันหนึ่ง CEO อาจมาบอกว่า "เปลี่ยนสีหลักจากน้ำเงินเป็นเขียว ทั้งแบรนด์ภายใน 2 สัปดาห์ให้หน่อยนะ" หรือ PM อาจบอกว่า "ปุ่ม CTA ควรใหญ่ขึ้น 20% จะได้ Conversion ดีขึ้น" ถ้าไม่มี Design System เราจะต้องไล่แก้ทุกหน้าจอ ทุก Component ด้วยสองมือเปล่าของเราเอง แต่ถ้ามี System เราก็แค่แก้ที่ Design Token ตัวเดียว แล้วทุกที่ที่ใช้สีนั้น ขนาดนั้นจะเปลี่ยนตามไปทันที มันไม่ใช่แค่เรื่องประหยัดเวลา แต่เป็นเรื่องของความอยู่รอดในโลกที่เปลี่ยนแปลงเร็ว
Design System without UX
Design System คืนสิ่งที่สำคัญที่สุดให้เรานั่นคือ เวลา ที่เราสูญเสียไปนาน ในโลกโปรเจคเร่ง เราขับรถเร็วพอๆ กับดอมแล้ว แต่มันก็จะมีอะไรมาเร่งเร้าให้เราขับไวกว่านั้นอีก และแม้เวลาจะเป็นเรื่องสำคัญในยุคนี้ แต่เราไม่ได้อยากเป็น UX Designer เพื่อวางปุ่มหรือ Argue เรื่อง Padding 8px
หน้าที่หลักเราคือ สนใจว่าผู้ใช้รู้สึกยังไง อะไรทำให้เขาสับสนบ้าง อะไรที่ทำให้เขารู้สึกใช่ และเราจะช่วยเขาเข้าใจโลกดิจิทัลที่วุ่นวายได้ยังไง — Design System ไม่ใช่พระเอก แต่เป็นเพื่อนร่วมรบที่พึ่งพาได้ในวันที่เหนื่อยเกินกว่าจะเริ่มจากศูนย์ แต่ระวังให้ดีครับ Design System ก็เหมือนดาบสองคม เหมือนกาละสอง-ซ้องปีป มันช่วยเราได้ก็จริง แต่ถ้าเราหยุดคิด มันก็อาจตัดขั้วหัวใจเราโดยไม่รู้ตัว
ทุกครั้งที่เราหยิบของใน System มาใส่โดยไม่ฟังเสียงของผู้ใช้ เรากำลังตัดหัวใจของ UX ทิ้งทีละนิด
คำถามสำคัญที่เราต้องถามตัวเองเสมอคือ
"เราใช้ Design System เพื่อช่วยผู้ใช้ หรือแค่ช่วยตัวเองให้รอด Deadline"
ผมเคยเห็นหน้าจอที่สวยงาม เป๊ะทุกมิลลิเมตร Consistency กว่านี้ไม่มีอีกแล้ว แต่เห็น User Research Report บอกว่า 70% ของคนที่เข้ามาใช้ Drop ออกจาก Flow กลางทาง เห็นคอมเมนต์ใน App Store ที่บอกว่าใช้งานยากจัง หรือไม่ก็มีคำว่าไม่รู้จะทำยังไง อยู่แทบทุกประโยค
ทันใดนั้นเองผมก็รู้ได้ทันทีเลยว่า เราไม่ได้ออกแบบ UX อีกต่อไปแล้ว เรากำลังจัดของลงกล่อง เราออกแบบของบางอย่างเพื่อให้สามารถแปะวาง และส่งของได้ทันเวลา
แต่วันนี้ ผมนั่งใน Meeting แล้วรู้สึกเหมือนทุกคนกำลังคิดเรื่องอื่นที่เหมือนจะคนละเรื่องเดียวกัน
Dev คิดเรื่องจะ Implement ยังไงให้ง่าย
PM คิดเรื่องจะ Deliver ยังไงให้ทัน timeline
Designer คิดเรื่องจะใช้ Component ไหนให้ตรง Guideline
แล้วใครคิดเรื่องมนุษย์บ้าง คำตอบคือไม่มี!
"Design systems are for people. Full stop."
("ระบบการออกแบบนั้นมีไว้สำหรับผู้คน จบจือ”)
— Brad Frost ผู้สร้าง Atomic Design
แต่ดูๆ แล้ว เราเอา Design System ไปใช้เพื่อทุกอย่าง ยกเว้นผู้คน
ปัญหาคือ Design System ได้กลายเป็นข้ออ้างที่สะดวกสบาย ซึ่งเป็นเหตุผลที่เราไม่ต้องนั่งคิดใหม่ ไม่ต้องถามว่า "ผู้ใช้ในบริบทนี้ต้องการอะไร" เพราะเรามี Component พร้อมใช้อยู่แล้ว เรามี Pattern ที่ Proven อยู่แล้ว เรามี Guideline ที่ถูกต้องอยู่แล้ว แต่ที่เราไม่มีก็คือ Empathy ให้ผู้ใช้
มนุษย์ UX อย่างเราสอนตัวเองว่าต้องคิดเป็นระบบ เราคุยกับ Dev ด้วยคำว่า Atomic Design, Design Tokens, Scalable Components เรานำเสนอ Stakeholder ด้วยกราฟที่บอก "Efficiency Increased by 300%" แต่เราไม่เคยถามว่า ผู้ใช้เขารู้สึกว่า Experience ดีขึ้นไหมนะ เขาเข้าใจเรามากขึ้นไหมนะ หรือแม้แต่ ผู้ใช้เขากล้าที่จะใช้งานมากขึ้นไหมนะ หรือเขารู้สึกว่าโดนพัดพาไปด้วย Flow ที่เราเขียนไว้ โดยไม่รู้ว่าตัวเองกำลังไปไหน แล้วแปะ UI Component จาก Design System ร้างๆ
— Dan Mall Digital Design System advocate เคยเตือนไว้ว่า
"The danger of Design Systems is not in their existence but in the illusion of done-ness they create."
(“อันตรายของระบบการออกแบบไม่ได้อยู่ที่การมีอยู่ของมัน แต่เป็นการหลอกตัวเองว่ามันเสร็จสิ้นแล้ว”)
ผมแปลแบบเข้าใจง่ายๆ ว่า อันตรายของ Design System ไม่ใช่ว่ามันมีอยู่ แต่อยู่ที่มันทำให้เราคิดว่า งานจบแล้ว ทั้งที่ยังไม่ได้เข้าใจคนใช้จริงๆ (จริงๆ อาจจะรวมถึง Design System ต้องปรับอยู่ตลอด ไม่มีวันเสร็จก็ตาม)
Design System กลายเป็นดาบที่ทิ่มแทง UX ได้เหมือนกัน
แม้ดาบนั้นไม่ได้แทง UX แล้วตายดับลงไปในทีเดียว แต่มันแทงเข้าเนื้อช้าๆ ด้วยความเข้าใจผิดที่ดูไม่มีพิษภัย ด้วย Flow ที่เหมือนจะเวิร์ก และด้วยนิสัยของทีมที่หยุดถามว่า “ผู้ใช้เป็นยังไงบ้าง” และมันจะค่อยๆ ตายลงไป ตอนที่ไม่มีใครถามว่าใน Context นี้ ผู้ใช้ต้องการแบบนี้จริงเหรอ
ปัญหา 4 ข้อที่ไม่เคยเขียนไว้ใน Design Guideline :
เราหยุดคิดเพราะมันมีให้เลือกอยู่แล้ว
ปุ่มมีใน System หรือ Modal ก็มี แม้แต่ Card Layout ก็พร้อมใช้ แล้วทำไมเราต้องคิดอะไรเพิ่มอีก แค่หยิบมาแปะ แล้วจัดตาม Grid แต่เราเคยคิดบ้างไหมว่า User ใน Flow นี้ เขาต้องการ ปุ่มแบบนี้จริงไหม
เราหยุดฟัง เพราะ Component เคยใช้แล้วไม่ต้องเทสต์
"อันนี้ใช้ในหน้า Register แล้วเวิร์ก" หรือ "เราใช้ Modal นี้มาตั้งแต่ปีที่แล้ว ไม่มี Complaint อะไรเลยนะ" เสียงจาก PM หรือ Stakeholder ที่มักจะพูดแบบนี้ตลอด แต่การไม่มี Complaint ไม่ได้แปลว่ามันดี บางครั้ง ผู้ใช้ไม่ได้บ่น อาจเป็นเพราะเขาเลิกใช้ไปแล้วต่างหาก
เราหยุดรู้สึก เพราะอารมณ์ไม่ได้อยู่ใน System
Design System มี Layout / Spacing / Color Role แต่มันไม่มี Emotion ไม่มี Empathy ไม่มี Guideline ไหนเลยเขียนว่า ผู้ใช้จะรู้สึกยังไง ถ้ากดปุ่มนี้ แล้วเจอ Error 3 ครั้งติด บางทีสิ่งที่ผู้ใช้ต้องการ ไม่ใช่ UI ที่สวย แต่คือใครบางคนที่เข้าใจว่าเขารู้สึกยังไงในจังหวะนั้นจริงๆ ต่างหาก
เราหยุดตั้งคำถาม เพราะทุกอย่างถูก template ไว้หมด
ทุกอย่างดูดี / ตรง Spec / On-Brand / WCAG ผ่าน แต่ไม่มีใครถามว่าผู้ใช้ว่าเข้าใจไหม ไม่มีใครรู้ว่าทำไม User ถึงออกจาก Flow ในหน้าที่สอง เพราะเราคิดว่ามันสวยแล้ว เท่ากับแค่นี้ก็เวิร์กแล้วล่ะ (จริงหรอ?)
ใช้ Design System ยังไงให้ UX ไม่ตายด้าน
ผมไม่อยากให้คนเข้าใจผิดว่าผมเกลียด Design System นะครับ บ่แม่นเด้อ Design System มันดีมาก มันช่วยให้เราทำงานได้เร็ว Consistent และทีมสื่อสารกันได้ดี แต่ถ้าหากใช้มันได้ไม่ดี ทำให้ไม่ได้แก้ปัญหาพื้นฐานของ UX เลย หนำซ้ำมันกลับจะทำให้ UX เราชุลมุนวุ่นวายกว่าเดิมไปอีก มันไม่ได้ทำให้เราเข้าใจผู้ใช้มากขึ้นเลยสักนิด
หลังจากที่ผมล้มเหลวมา 2-3 โปรเจกต์ ผมเริ่มเรียนรู้วิธีใช้ Design System แบบที่ยังมีหัวใจ และไม่ทำลาย UX ประมาณนี้ครับ :
หยิบ Component มาใช้ด้วยเจตนา ไม่ใช่ความเคยชิน
ก่อนจะกด Copy และ Pate จาก System ลองถามตัวเองก่อนว่า สิ่งนี้เหมาะกับผู้ใช้ในบริบทนี้ไหม หรือ มันตอบความต้องการจริง หรือแค่ตอบ Spec เท่านั้น
ลองไม่ต้องใช้บาง pattern ถ้ามันขวางทางผู้ใช้จริงๆ
Design System คือมาตรฐาน แต่มาตรฐานควรรับใช้ประสบการณ์มนุษย์ ไม่ใช่กักขังมัน อย่ากลัวที่จะหลุดจาก System ถ้ามันจะทำให้ผู้ใช้เข้าใจเร็วขึ้น และประสบการณ์ดีขึ้น
เอาหัวใจ ใส่กลับเข้าไปใน System
อย่าลืมใส่ Microcopy อย่าลืมใส่คำอธิบายเล็กๆ หรือใส่ Human Tone ที่ช่วยให้คนไม่รู้สึกโดดเดี่ยว System ไม่ควรทำให้ผู้ใช้รู้สึกเหมือนอยู่ในระบบราชการที่หนีไปเที่ยวต่างประเทศ แล้วไม่ได้อะไรกลับมาเลย
อย่าใช้ Design System แทนการฟังเสียงผู้ใช้
ไม่มี Component ไหนที่แทน Usability Test ได้ฉันใด ก็ไม่มี Guideline ไหนที่แทนความเข้าใจจาก User Interview ได้ฉันนั้น
ใช้ Design System เป็นภาษากลาง ไม่ใช่กฎเหล็ก
มันควรเป็นพื้นที่ที่ Designer คุยกับ Dev ได้ ไม่ใช่สิ่งที่ใช้ปิดปากกันว่าของมันมีอยู่แล้ว ทำไมจะต้องคิดใหม่ด้วย มันควรจะเป็นพื้นที่สื่อสารกันได้อย่างเข้าใจ และพัฒนาให้ดีขึ้นเรื่อยๆ ไม่ใช่ว่ามีแล้วก็จบ หยุดปรับ หยุดปรุง หยุดคิด
วันหนึ่งตอนขับรถกลับบ้าน ผมนั่งคิดว่า ตอนไหนกันนะที่ผมเลิกเป็น User Experience Designer แล้วกลายเป็น User Interface Organizer แทน เมื่อไหร่กันนะที่ผมหยุดถามว่าผู้ใช้รู้สึกยังไง แล้วเริ่มต้นแค่ว่า Component ไหนที่เหมาะสมที่สุดแทน
ผมไม่ได้ขอให้ทุกคนทิ้ง Design System นะครับ เพราะมันคือเครื่องมือที่ดีที่สุดอยู่ดี ไม่เถียงเลย (ใครบอกไม่ดี ผมจะช่วยเถียงด้วย) แต่ผมแค่อยากให้เราจำไว้ว่า เครื่องมือที่ดีที่สุดใน UX ไม่ใช่ Component Library ไม่ใช่ Design Token ไม่ใช่ Pattern ที่ Proven แต่มันคือ
✦ ความสามารถในการเข้าใจมนุษย์
✦ ความกล้าที่จะตั้งคำถาม
✦ การฟังเสียงผู้ใช้ ที่อยู่นอกระบบที่เราออกแบบ
"The best products feel like they were designed specifically for you, not like they came off an assembly line."
("ผลิตภัณฑ์ที่ดีที่สุด จะรู้สึกเหมือนว่าได้รับการออกแบบมาโดยเฉพาะสำหรับคุณ ไม่ใช่เหมือนกับว่าออกมาจากสายการประกอบ”)
— Julie Zhuo อดีต VP of Design ที่ Facebook
Design System สำหรับผมในฐานะ UX Designer เลยเปรียบเสมือน “กาสะลอง–ซ้องปีบ” ที่มีทั้ง ด้านที่อ่อนโยน น่ารัก คอยช่วยเหลือเราในวันที่ทุกอย่างยุ่งเหยิง ให้เราพึ่งพาได้ หยิบจับง่าย ประหยัดแรง คุม Consistency ให้ทีมไม่หลุดทิศ
แต่ในอีกด้านหนึ่ง มันก็แอบซ่อนความร้ายลึก กดทับความคิด กักขังความรู้สึก ลบเลือนความเป็นมนุษย์ในงานออกแบบ เพราะเราหยิบมันมาใช้โดยไม่ตั้งคำถาม ไม่ฟังเสียงของคนใช้งานจริง ไม่ได้ออกแบบเพื่อเขาแต่เพื่อให้เสร็จไปวันๆ เท่านั้น
Design System ไม่ได้ผิดหรอกครับ มันก็แค่เป็นระบบ เป็นเครื่องมือ เป็นพี่น้องที่เราเลือกอยู่ด้วยเอง ข้อดีคือ เวลาและความง่าย แม้มันจะไม่ได้ทำให้เราออกแบบเก่งขึ้น แต่จะทำให้เรามีเวลาพักหายใจในโลกเหนื่อยๆ มันคือระบบที่คอยจัดการสิ่งที่ควรจะไม่ต้องคิดแล้ว เพื่อให้เรามีพลังพอจะไปคิดในสิ่งที่ ควรคิดให้มากกว่าทุกอย่าง และ Design System จะไม่มีทางทำลาย UX ได้เลย ถ้าเรายังคิด, ฟัง, รู้สึก, ตั้งคำถาม และออกแบบด้วยความตั้งใจ เหมือนวันแรกที่เราเลือกจะเป็น UX Designer
เพราะบางครั้ง การออกแบบที่ดีที่สุด ไม่ได้มาจากการทำตาม System แต่มาจากการรู้ว่า เมื่อไหร่ควรไม่ใช้เพื่อมนุษย์คนหนึ่งที่กำลังหาทางเข้าใจ ในโลกที่เต็มไปด้วยระบบที่ดูสวยงาม แต่กลับไม่มีใครเข้าใจเขาได้เลยจริงๆ
นี่แหละหัวใจที่สำคัญของ UX Apocalypse: A Survival Guide for Designer สำหรับบทความนี้ครับ
Presented by s.up dnscool —’space’ to growth ‘up’
Crafting Skills. Designing Destiny.
The Pub for Life-Vibe-Skill.