Monitor สำคัญกับงานออกแบบของ UI Designer มากเพียงใด
คุณเคยสงสัยกันไหมว่า… ทำไมนักออกแบบ หรือ Designer ถึงเลือกใช้เครื่อง Mac ในการทำงาน ?!?
จากผลสำรวจข้างต้นทำให้เราเห็นว่า นักออกแบบทั้งสาย UX และ UI Designer มากกว่า 80% ยังคงเลือกทำงานอยู่บน Platform ของ macOS (ผมเองก็อยู่บน Platform นี้มาเกือบ 15 ปีแล้วเช่นกัน) ซึ่ง 2 เหตุผลสำคัญที่ทำให้เรายังอยู่กับ Mac คือ OS (Operating System) ที่มาพร้อม Tools หลากหลายสำหรับสายงาน Designer และ Hardware ที่ผ่านการออกแบบและคัดเลือกมาอย่างละเอียด ทั้งยังรักษามาตรฐานและความเชื่อมั่นของผู้ใช้ได้อย่างดีตลอดหลายสิบปีที่ผ่านมา
ตั้งแต่อดีตจนถึงปัจจุบัน Monitor หรือ Display ของอุปกรณ์ภายใต้แบรนด์ Apple จะถูกนำเสนอด้วยเทคโนโลยีที่ดีที่สุด ณ ช่วงเวลานั้นเสมอ และโดดเด่นกว่าคู่แข่งไปอีกหลายไตรมาสหลังเปิดตัว ไม่ว่าจะเป็นการแสดงผลค่าสี (Color Profile) ความคมชัด (Contrast) หรือการ Calibrate หน้าจอที่แม่นยำจากโรงงาน ทำให้นักออกแบบมั่นใจได้ว่า เมื่อถือเครื่องออกมาจาก Apple Store ก็พร้อมเริ่มงานออกแบบได้ทันที
บทความนี้เลยอยากเรียบเรียงจากประสบการณ์ผู้เขียน เพื่อให้ผู้อ่านได้เข้าใจเทคโนโลยีของ Monitor ที่ใช้ในการทำงาน (โดยเฉพาะสายงาน Designer) รวมถึงถ้าอยากจะซื้อ External Monitor สักตัวมาช่วยให้ทำงานได้เร็วขึ้น ควรจะต้องใส่ใจกับรายละเอียดหรือปัจจัยสำคัญๆใดบ้าง
ปัจจัยที่ 1 Display Panel
หลังจากผ่านโลกของจอกระจกโค้ง (CRT) ก็มาสู่ยุคจอแบน(ราบ) โดยเทคโนโลยีของ LCD (Liqid-Crystal Displays) ในยุคแรกนั้นมีการแบ่ง Panel ของ Display ออกเป็น 3 ประเภท คือ TN (Twisted Nematic), IPS (In-Plane Switching) และ VA (Vertical Alignment)
TN Panels เป็น Panel ตัวแรกที่เกิดมาพร้อมกับจอ LCD และถูกพัฒนาให้โดดเด่นในเรื่อง Response Time (ความเร็วในการเปลี่ยนสีของ 1 Pixel บนหน้าจอ หน่วยเป็น ms) และ Refresh Rate ที่สูง (เช่น 120 Hz หมายถึงรองรับได้สูงสุดถึง 120 fps แต่จะทำความเร็วได้ถึงหรือไม่ขึ้นกับตัวประมวลภาพหรือ GPU ด้วย) ซึ่งเหมาะกับการใช้เล่นเกมส์เพราะเป็นการแสดงผลที่เมื่อการเคลื่อนไหวยิ่งเร็วก็ยิ่งทำให้รู้สึกว่าภาพดู Smooth สมจริง แต่สิ่งที่ต้องแลกมาคือการแสดงขอบเขตของสี (Color Gamut) ที่น้อยกว่า Panel ประเภทอื่น และมุมมองของสีที่แคบกว่า (ดังภาพตัวอย่างด้านล่าง)
IPS Panels เป็น Panel ที่ถูกพัฒนาขึ้นโดย LG เพื่อลบข้อด้อยเรื่องการแสดงผลของขอบเขตของสีและมุมมองที่แคบของ TN Panel ซึ่งจอ IPS จะมีมุมมองที่กว้างได้ถึง 178° (ขาดไปด้านละ 1° ทั้งแนวนอนและแนวตั้ง อ้างอิงข้อมูลจากจอ Apple Pro Display XDR ที่น่าจะเป็นจอคุณภาพสูงที่สุดที่ผู้ใช้งานทั่วไปสามารถเข้าถึงได้) ในยุคแรกๆ อุปกรณ์ที่ใช้ IPS Panel มีราคาสูงมาก แต่ Apple ก็เลือกนำมาใช้กับเครื่อง Macbook Pro และ iMac เพื่อตอบโจทย์กลุ่มลูกค้า Professional ไม่ว่าจะเป็นช่างภาพ สายงาน VDO หรือสายงานสิ่งพิมพ์ ที่ต้องการความถูกต้องของสีแม่นยำใกล้เคียงกับเครื่องพิมพ์ขนาดใหญ่ IPS Panel จึงกลายเป็นมาตรฐานที่ Apple เลือกใช้กับ Display ทุกรุ่นของสินค้า Apple มาจนถึงปัจจุบัน
จุดด้อย ของ IPS ก็คือ Response Time และ Refresh Rate ที่ต่ำราวๆ 60 Hz จึงไม่เหมาะแก่การเอาไปเล่นเกมส์ที่ต้องใช้ความเร็วสูงในการแสดงผลภาพ (อย่างไรก็ดี ปัจจุบันเริ่มมีหน้าจอ Gaming ที่ใช้ IPS แล้ว เช่น ASUS 27" ที่สามารถแสดงผลเกมส์ความละเอียด 1080p ได้ที่ 280 Hz หรือ 280 fps และเมื่อกลางปี 2019 LG เพิ่งเปิดตัวเทคโนโลยี Nano IPS ที่มี Response Time ที่ 1ms และ Refresh Rate ที่ 144 Hz)
ความเห็นส่วนตัว: การทำงานด้วยการมองหน้าจอทั้งวัน จอ IPS ช่วยลดความล้าของดวงตาได้ดีมาก และตัวหนังสือจะคมกว่าจอ TN ที่ความละเอียดเดียวกัน ลงทุนกับจอดีๆ สักตัว จอ IPS หลายยี่ห้อในปัจจุบันมีราคาถูกลงมากแบบจับต้องได้แล้ว ไม่ว่าจะเป็น Dell หรือ BenQ ที่สำคัญคุ้มกว่าค่าซ่อมแซมดวงตาในอนาคตเยอะ เชื่อสิ 😎
VA Panels เป็นเทคโนโลยีที่ผลิตโดย Samsung เพื่อแก้ปัญหาทั้ง IPS และ TN แต่สุดท้ายผลออกมาไม่ดีนัก กลุ่มเกมเมอร์ยังรู้สึกว่ามีภาพเคลื่อนไหวที่ติดเงา (Ghosting) มากจนน่ารำคาญ เทคโนโลยีเลยค่อยๆ หายไป ในขณะที่ Samsung ก็หันไป Focus ที่เทคโนโลยีใหม่ๆ บน จอ TV และ Mobile ต่อไปในชื่อ QLED
ปัจจัยที่ 2 Color Gamut หรือ Color Space
สำหรับ UI Designer หรือคนที่ทำงานออกแบบที่เกี่ยวกับ Platform บน Desktop และ Mobile ในยุคนี้ ควรทำความรู้จัก Color Profile 2 ตัว คือ Display P3 (DCI-P3) และ sRGB
ในยุคสมัยที่เว็บไซต์ยังถูกพัฒนาและแสดงผลบนหน้าจอ Desktop เป็นหลัก มาตรฐาน Color Profile ที่นักออกแบบตั้งค่าในเครื่องมือที่ใช้ออกแบบ คือ sRGB เพื่อให้ภาพที่ถูก Export ออกไปบนเว็บไซต์มีการแสดงผลของสีบนหน้าจอเครื่องต่างๆได้ใกล้เคียงกับที่ออกแบบไว้บนหน้าจอของตัวเองมากที่สุด แต่แล้วในปี 2010–2011 ได้มีการกำหนดมาตรฐานใหม่ขึ้นมาที่ชื่อ DCI-P3 (เพื่อใช้อ้างอิงกับภาพยนตร์ความละเอียดสูงที่รองรับเทคโนโลยี HDR หรือ High Dynamic Range) ทำให้บริษัทพัฒนาอุปกรณ์มือถือพยายามนำมาตรฐานนี้มาเพิ่มลงในหน้าจอมือถือด้วย ประกอบกับการเติบโตของผู้ใช้มือถือในโลกที่สูงมากขึ้นจนแซง Desktop ส่งผลให้ DCI-P3 เริ่มกลายเป็นมาตรฐานที่มีคนใช้มากขึ้น ไม่ได้เจาะจงอยู่แค่กลุ่มอุตสาหกรรมภาพยนตร์อีกต่อไป และผู้เขียนเชื่อว่าการพัฒนาเว็บไซต์หรือ Mobile Application ในอนาคต Color Profile แบบ DCI-P3 จะมาแทนที่ sRGB อย่างแน่นอน
ดังนั้นการเลือก Monitor สำหรับ UI Designer ยุคนี้ควรใส่ใจเรื่องการรองรับ DCI-P3 ที่มากกว่า 95% (ซึ่งจะรองรับเทคโนโลยี HDR รุ่นใหม่ไปด้วย) เพื่อให้งานที่เราออกแบบแสดงผลได้ใกล้เคียงบนหน้าจอของอุปกรณ์ใหม่ในอนาคต Tools ที่ใช้ในการออกแบบในปัจจุบัน ไม่ว่าจะเป็น Photoshop, Sketch และ Adobe XD ต่างก็รองรับการตั้งค่า Color Profile เป็น DCI-P3 ได้แล้ว เพียงแต่ไม่ได้ถูกตั้งเป็นค่าเริ่มต้นมาเท่านั้นเอง
ณ วันที่เขียนบทความ Monitor ที่วางขายในเมืองไทยที่รองรับ DCI-P3 มากกว่า 99% น่าจะมีแค่ iMac 5K, LG Ultrafine 27" และ Apple Pro Display XDR (เท่าที่ผู้เขียนค้นเจอ)
ปัจจัยที่ 3 ความละเอียดหน้าจอ 4K, 5K, 6K และ Retina Display
หลังจาก Apple เปิดตัวหน้าจอ Retina Display ใน iPhone และเริ่มนำมาใส่ในเครื่อง MacBook Pro ตั้งแต่ปี 2012 ทำให้ UI Designer หลายคนเริ่มเปลี่ยนมาใช้ Macbook Pro มากขึ้นกว่า Desktop อย่าง iMac เพราะจะได้เห็นรายละเอียดที่คมชัดมากขึ้นและแสดงผลใกล้เคียงกับหน้าจอของเครื่อง iPhone
หลังจากนั้นในปี 2014 Apple ได้เปิดตัว iMac 5K ตัวใหม่ที่ใส่หน้าจอ Retina มาพร้อมกับความละเอียด ความละเอียดหน้าจอขึ้นไปถึง 5120 x 2880 ซึ่งเมื่อเปิดมา Default Resolution ของ iMac 5K จะอยู่ที่ 2560 x 1440 ทำให้หน้าจอแสดงผลความคมชัดได้เทียบเท่ากับจอ Retina บน iPhone
ในปี 2019 หลังจาก Apple ให้ LG ผลิตและจัดจำหน่ายจอให้ Apple อยู่ช่วงหนึ่ง (LG รุ่น Ultrafine) Apple ก็เปิดตัว Pro Display XDR ที่รองรับความละเอียด 6K (6016 x 3384) ที่ขนาดหน้าจอ 32" และแน่นอนว่าราคารุนแรง!!! ตามสไตล์ Apple และน่าจะเน้นไปที่กลุ่มคนทำสายงาน VDO Production เป็นหลัก
ตอนนี้ทีม Designer ที่ KBTG ใช้ Monitor 4K ของ Dell รุ่น U2718Qในการทำงาน ซึ่งจากที่ลองใช้มาประมาณ 2 ปี พบว่าให้คุณภาพของสีและความละเอียดที่คมชัดได้ดีระดับหนึ่งในราคาที่จับต้องได้ (ประมาณหนึ่งหมื่นปลายๆ) โดยปรับ Resolution ลงมาที่ 2560 x 1440 ทำให้ได้ความคมชัดของภาพประมาณ @1.5x ก็ถือว่ามีความคมชัดใกล้เคียงกับจอ Retina ของ MacBook Pro (@2x) ระดับหนึ่ง แต่ถ้าใครกำลังสนใจอยากเปลี่ยนตาม แนะนำให้ดูรุ่นใหม่ที่เชื่อมต่อผ่าน USB-C แทนไปเลย เช่น Dell รุ่น U2720Q ราคาแพงกว่าเล็กน้อยแต่ความสะดวกที่ได้มาต่างกันเยอะ เพราะเสียบสายเส้น ได้ทั้งการส่งข้อมูลภาพ เสียงและการชาร์จไฟเข้า Laptop ในเวลาเดียวกัน
สิ่งที่ควรรู้เพิ่มเติม เมื่อต้องเพิ่ม External Monitor มาเพื่อช่วยในการทำงาน
ช่องเชื่อมต่อหรือ Ports ที่ใช้ในการส่งข้อมูลรูปภาพและเสียงจาก PCs/Laptops ไปสู่ External Monitor นั้น ในปัจจุบันจะมีอยู่ 5 รูปแบบ (ตามรูปตัวอย่างด้านบน) หาก Laptop ที่ผู้อ่านใช้อยู่มี Port แบบไหนอยู่บ้างควรเลือกหรือเตรียมสายที่ถูกต้องไว้ด้วย เนื่องจาก Monitor หลายตัวที่วางขายในปัจจุบัน ยังมี Port ที่รองรับ DisplayPort และ HDMI ติดตั้งมาให้เป็นหลัก ดังนั้นจึงควรตรวจสอบปลายทางและต้นทางให้ดีว่ามี Port ไหนที่เชื่อมต่อกันได้บ้าง ส่วนสาย Cable ตอนนี้มีให้เลือกต้นทาง/ปลายทาง Cross Over กันเกือบทุกชนิดหาซื้อได้ตาม Online Marketplace ทั่วไป
แต่ถ้าเป็น Laptop รุ่นใหม่ (ปลายปี 2016 เป็นต้นมา) จะมาพร้อมกับ USB Type C (USB-C) ซึ่งมีความสามารถเหนือกว่า Ports อื่นๆ ทั้ง 4 ตัวก่อนหน้าคือ USB Type C สามารถส่งข้อมูลภาพ เสียง และ กระแสไฟ ได้พร้อมกันในเส้นเดียว รวมถึงมี Monitor บางรุ่นที่มี USB Hub เพิ่มมาใน Monitor ให้ด้วย สามารถส่งข้อมูลจาก Hub มาที่ Laptop เราได้เลยผ่านสายเส้นเดียว นี่คือความสามารถที่แลกมาด้วยราคาที่สูงขึ้นของ External Monitor รุ่นใหม่ๆ ที่มาพร้อม USB Type C ก็ต้องชั่งน้ำหนักดูว่าคุ้มค่าพอหรือไม่
นอกจากนี้ External Monitor หลายตัวก็สามารถหมุนเปลี่ยนแกนเป็นแนวตั้งได้ ทำให้ Developer หลายคนโดยเฉพาะสายเว็บไซต์ ชอบเพิ่ม External Monitor อีกตัวไว้ Preview งานเวลาเขียน Code เพราะสะดวกไม่ต้องมา Scroll ดูทีละ Section หลังแก้โค้ดเสร็จ
สุดท้าย ขอขอบคุณผู้อ่านทุกท่านที่อ่านมาถึงตรงนี้มากๆครับ หากข้อมูลตรงไหนอธิบายได้ไม่ชัดเจนพอ สามารถมา Comment เพิ่มเติมได้ ผมจะรีบมาตอบคำถามและอธิบายให้ชัดเจนยิ่งขึ้นครับ
