by Lazur URH วันนี้ผมจะมาพูดถึงความสำคัญของ “สีเทา” เนื่องจากเป็นเรื่องที่หลายคนมองข้ามหรือ อาจจะคิดว่าในการออกแบบแต่ละครั้งนั้น เราจำเป็นต้องใช้สีจำพวกประเภท Grayscale tone ด้วยหรอ ในการออกแบบนั้นการที่เราใส่สี Grayscale tone เข้าไปทำให้งานของเราดูมีเนื้อหาชัดเจน และเพิ่มระดับความสำคัญได้ดียิ่งขึ้น วันนี้ผมจะมาแนะนำวิธีใช้และเสนอในหลายๆแง่มุมของสีเทากัน 😁 ความเคยชินกับการมองเห็นสีในชีวิตประจำวัน 👀การมองเห็นในชีวิตประจำวันของเรานั้นเกิดจากแสงกระทบวัตถุที่เรากำลังมองอยู่ตกกระทบกับตัวรับภาพในดวงตา(Photoreceptor) และส่งข้อมูลไปยังสมอง เคยใช้งาน UI ที่เน้นความเรียบง่ายมีพื้นที่โล่งสีขาวแล้วมีความรู้สึกแสบตา หรือรู้สึกขัดใจอะไรสักอย่างกับมันหรือเปล่า ความรู้สึกนั้นเกิดจากการได้รับสีที่เราไม่คุ้นชิน เหมือนที่เราได้รับในชีวิตประจำวัน พี่ Khomsun Chaiwong Designer เคยพูดสาระติดตลกไว้ว่า “ นี่..บนโลกเราอะ มันไม่มีหรอกนะ ไอ้สีขาวที่มันขาวจริงๆเหมือนสีจอมือถืออะ โด่” นั้นคือเหตุผลว่าทำไมการนำสีเทา(Grayscale) มาใช้งานจริงเป็นเรื่องที่สำคัญ ผมขอยกตัวอย่างให้เห็นภาพกันชัดๆ ถึงความสำคัญในการใช้สีเทา กับบริษัทที่ใครๆก็รู้จัก “Apple” 🍎 เราจะสังเกตได้จาก CI ของสีพื้นหลังที่ Apple เลือกใช้ได้ไม่ว่าจะเป็น website, phone, store หรือ advertising จะถูกใช้สี Grayscale หมด ไม่มีการใช้สีขาวล้วน #FFFFF (RGB) ในการออกแบบใดๆเลย เพื่อที่เขาต้องการให้ผู้ใช้งานไม่เกิดความขัดใจกับการใช้งานในสิ่งที่ต้องการนำเสนอ ใน Part ต่อไปผมจะมาพูดถึงเรื่องของ Grayscale ต่อ เกี่ยวกับการใช้สีเพื่อให้ความสำคัญของ Content ครับ บทความใน Part นี้หวังว่าจะเป็นประโยชน์ไม่มากก็น้อยนะครับ ขอบคุณครับ :] หน่วยที่ 1 ความรเู้ กยี่ วกับกราฟกิ สี (COLOR) หมายถึง ลกั ษณะกระทบต่อสายตาใหเ้ ห็นเปน็ สีมผี ลถึงจติ วทิ ยา คือมอี ำนาจใหเ้ กดิ ความ โดยทั่วไปสใี นธรรมชาติและสที ีส่ รา้ งขนึ้ จะมีรปู แบบการมองเหน็ ของสที แ่ี ตกตา่ งกัน ซึ่งรูปแบบการ 1. มีความรู้ ความเขา้ ใจเก่ียวกบั ความหมายของสี 3.1 ความหมายของสี ใบงานท่ี 1.3 แผนท่ี 3 ระบบสใี นงานกราฟิก 3.1 ความหมายของสี แม่สี (PRIMARIES) สีตา่ งๆนน้ั มอี ยู่มากมายแหล่งกำเนดิ ของสีและวิธีการผสมของสตี ลอดจนรสู้ กึ ท่ีมีต่อสีของมนษุ ย์แต่ละกลมุ่ ย่อม อยู่ในรูปของแสงรังสี ซึ่งเป็นพลงั งานชนดิ เดยี วทีม่ สี ี คุณสมบตั ขิ องแสงสามารถนำมาใช้ ในการถา่ ยภาพ ภาพ 1. วงจรสี (Colour Wheel) วงจรสี คอื สีที่เกิดจากการผสมกันเปน็ คู่ เรม่ิ ตงั้ แต่ แมส่ ี 3 สี แล้วเกิดเปน็ สใี หมข่ น้ึ มา จนครบวงจร จะได้สี เพ่มิ ข้นึ อกี 6สี 2. วรรณะของสี (Tone of Colour) 3. สีตรงขา้ ม (Comprementary Colour) 4. สีขา้ งเคยี ง ( Analogous Colour) สีแดง ให้ความรูส้ กึ รอ้ น รุนแรง กระตนุ้ ทา้
ทาย เคลือ่ นไหว ตน่ื เตน้ เรา้ ใจ มีพลงั ความอดุ มสมบรู ณ์ สสี ม้ ให้ความรู้สกึ ร้อน ความอบอนุ่ ความสดใส มชี วี ติ ชวี า วยั รุน่ ความคกึ คะนอง การ สีเหลอื ง ใหค้ วามรสู้ กึ แจ่มใส ความสดใส ความรา่ เรงิ ความเบิกบานสดชืน่ ชีวิตใหม่ ความ สเี ขยี ว ใหค้ วามรูส้ ึก สงบ เงยี บ รม่ ร่นื ร่มเยน็ การพกั ผ่อน การผอ่ นคลาย ธรรมชาติ ความ สนี ้ำเงนิ ให้ความรู้สึกสงบ สุขมุ สุภาพ หนักแน่น เครง่ ขรมึ เอาการเอางาน ละเอียด รอบคอบ สงา่ 3.2 ระบบสที ี่ใชก้ ับงานกราฟิก โดยท่ัวไปสใี นธรรมชาตแิ ละสที สี่ รา้ งขึ้น จะมรี ูปแบบการมองเห็นของสที ่แี ตกต่างกนั ซ่ึงรูปแบบการ 1. ระบบสี RGB ตามหลกั การแสดงสีของเครือ่ งคอมพวิ เตอร์ 3.2.1 ระบบสี RGB ภาพที่ 1.5 ระบบสี GRB ภาพที่ 1.6 ระบบสี CMYK 3.2.3 ระบบสี HSB Hue คอื สตี ่างๆ ทสี่ ะท้อนออกมาจากวัตถุแล้วเข้าสูส่ ายตาของเรา ซ่งึ มกั เรียกสตี ามช่อื สี เชน่ สีเขยี ว สเี หลือง สี Saturation คอื ความสดของสี โดยค่าความสดของสจี ะเรมิ่ ท่ี 0 ถงึ 100 ถ้ากำหนด Saturation ที่
0 สีจะมคี วามสดน้อย Brightness คือ ระดับความสวา่ งของสี โดยค่าความสว่างของสจี ะเริ่มท่ี 0 ถงึ 100 ถ้ากำหนดท่ี 0 ความสวา่ งจะนอ้ ยซ่ึง ภาพที่ 1.7 ระบบสี HSB 3.2.4 ระบบสี LAB เปน็ มาตรฐานสำหรบั การวัดคา่ แบบครอบคลมุ ทุกสีในระบบสี RGB และ CMYK สามารถใชก้ ับสที ี่ เกดิ ของระบบสีนี้ ได้แก่ ภาพท่ี 1.8 ระบบสี LAB ระบบสีแบบ Grayscale จะจัดการแต่ละพิกเซลในแบบ 8 บิต เหมอื นเป็นสวิทช์เปิด- ภาพที่ 1.9 ระบบสี Grayscale 3.2.6 ระบบสี Bitmap 1 บิต ซง่ึ แตล่ ะพกิ เซลในภาพจะเปน็ ได้เพยี งขาวหรือดำเทา่ น้ัน มกั ใชก้ บั ภาพวาดทวี่ าด้วยหมกึ ดำ ภาพลายเสน้ 3.2.7 ระบบสี Indexed เป็นโหมดสีท่ีเหมาะสำหรบั การทำภาพบน web
โดยทที่ กุ ครัง้ ที่แปลงภาพจากโหมดสอี นื่ ๆ มาเปน็ Index 3.3 เทคนิคการเลือกใช้สใี นการออกแบบ |