57dadbe443421aafc69049adda94fa7d

คำนำ สานักงานคณะกรรมการการอุดมศึกษา กระทรวงศึกษาธิการ ได้มีข้อตกลงความร่วมมือกับ มหาวทิ ยาลัยพะเยา ภายใต้โครงการปฏิรปู หลกั สูตรการศกึ ษาแหง่ ชาติ ได้ใหม้ กี ารพฒั นาหลกั สูตรและแผนการ สอน เอกสารประกอบการสอน คู่มือครู ที่บูรณาการความรู้ด้านเทคโนโลยีสารสนเทศและการส่ือสารกับกลุ่ม อาชพี เพื่อใชป้ ระกอบการเรยี นการสอนของสถานศึกษาที่เข้ารว่ มโครงการ เอกสารประกอบการสอนรายวิชา มีเน้ือหาท่ีนาไปสู่องค์ความรู้ท่ีสร้างความเข้าใจในคอมพิวเตอร์ กราฟิกเบ้ืองต้นโดยประกอบไปด้วย ความรู้เบ้ืองต้นเก่ียวกับคอมพิวเตอร์กราฟิก ระบบคอมพิวเตอร์กับงาน กราฟิก หลักการทางานและการแสดงผลของภาพคอมพิวเตอร์กราฟิก คุณลักษณะของกราฟิกและไฟล์ ภาพกราฟิก หลักการใช้สีและแสงในคอมพิวเตอร์ พื้นฐานการออกแบบกราฟิก หลักการออกแบบกราฟิก ตวั อักษรในงานออกแบบกราฟิก ฮาร์ดแวร์และซอฟต์แวรส์ าหรับคอมพิวเตอร์กราฟิก และคอมพิวเตอร์กราฟิก กบั การประยุกต์ใชง้ าน ผู้จัดทาเอกสารประกอบการสอนหวังเป็นอย่างย่ิงว่า เอกสารประกอบการสอนเล่มนี้จะเป็น ประโยชน์ต่อผู้เรียนและผู้ท่ีสนใจ เพื่อให้ผู้เรียนสามารถนาความรู้ที่ได้ไปประยุกต์ใช้ได้ในอนาคต และ ขอขอบคุณ สานักงานคณะกรรมการการอุดมศึกษา(สกอ.) สานักงานคณะกรรมการการศึกษาขั้นพื้นฐาน (สพฐ.) และสถานศกึ ษาทเี่ ขา้ ร่วมโครงการ ผ้จู ัดทา นายนคเรศ ชัยแก้ว 1 มกราคม 2557

สารบัญ หนา้ หวั ข้อ 1 บทที่ 1 ความรูเ้ บ้ืองต้นเก่ียวกบั คอมพวิ เตอร์กราฟิก 2 4 ความหมายของกราฟิกและคอมพิวเตอร์กราฟิก ประวัตขิ องคอมพวิ เตอรก์ ราฟิก 8 ประโยชน์ของคอมพวิ เตอร์กราฟิกกบั สังคมปจั จบุ นั 9 11 บทท่ี 2 ระบบคอมพวิ เตอรก์ ับงานกราฟกิ การเกดิ ภาพบนเคร่ืองคอมพวิ เตอร์ 14 อุปกรณ์คอมพิวเตอร์หลักสาหรบั งานกราฟิก 15 อปุ กรณ์คอมพิวเตอรเ์ สรมิ สาหรับงานกราฟิก 19 บทที่ 3 หลักการทางานและการแสดงผลของภาพคอมพิวเตอร์กราฟกิ 25 หลักการทางาน การแสดงผลของภาพกราฟิก 29 36 บทท่ี 4 คุณลักษณะของกราฟิกและไฟลภ์ าพกราฟิก ประเภทและคณุ ลักษณะของงานกราฟิก 41 ชนิดของไฟลภ์ าพกราฟิก 41 43 บทที่ 5 หลักการใช้สแี ละแสงในคอมพิวเตอร์ 48 ประเภทของสีในคอมพิวเตอร์ เทคนคิ การนาสไี ปใช้ในงานกราฟิก 51 52 บทท่ี 6 พ้ืนฐานการออกแบบกราฟิก 52 ความหมายของการออกแบบกราฟิก 54 หน้าท่ีของงานออกแบบกราฟิก องคป์ ระกอบงานกราฟิก โปรแกรมออกแบบกราฟกิ เบ้ืองต้น บทท่ี 7 หลักการออกแบบกราฟิก ความสมดุล ความเปน็ เอกภาพ สดั ส่วน จงั หวะลลี า

สารบัญ (ต่อ) 54 55 การตัดกนั 55 การรวมตวั 56 การใช้รปู ทรง 57 การใช้กรอบ เลเยอร์ 60 60 บทท่ี 8 ตวั อักษรในงานออกแบบกราฟกิ 63 ความหมายของงานอักษร 65 บทบาทของฟอนต์ ตวั อกั ษรกบั งานเอกสาร 68 ขอ้ ควรระวงั ในการใช้ตวั อกั ษร 69 บทที่ 9 ฮารด์ แวรแ์ ละซอฟต์แวร์สาหรบั คอมพวิ เตอรก์ ราฟกิ 80 ฮารด์ แวรส์ าหรบั คอมพวิ เตอร์กราฟิก 84 ซอฟต์แวรส์ าหรบั งานคอมพวิ เตอรก์ ราฟิก 86 87 บทท่ี 10 คอมพิวเตอรก์ ราฟิกกับการประยุกตใ์ ช้งาน 88 งานออกแบบส่ือสิง่ พิมพ์ 89 งานออกแบบตวั อกั ษร 90 งานอินฟอร์เมชันดีไซน์ งานอนิ เตอร์แอค็ ทีฟกราฟิก 94 งานออกแบบเว็บไซต์ 94 งานออกแบบมลั ตมิ เี ดีย งานแอนเิ มชนั งานโฆษณา งานภาพยนตร์

สารบญั รปู หน้า 1 รูปท่ี 3 รปู ท่ี 1 ภาพกราฟิกแบบ 2 มติ ิ (ซ้าย) และภาพกราฟิกแบบ 3 มิติ (ขวา) 4 รปู ที่ 2 ระบบ SAGE (Semi - Automatic Ground Environment) รปู ที่ 3 แผ่นพับประชาสัมพันธห์ ลักสูตรของคณะเทคโนโลยีสารสนเทศและการสื่อสาร 5 5 มหาวทิ ยาลัยพะเยา 6 รูปที่ 4 แผนทแ่ี สดงที่จดั งาน วทิ ยาศาสตรว์ ิจัย คร้ังที่ 5 มหาวิทยาลัยพะเยา 6 รปู ท่ี 5 การออกแบบภายในห้องน้าแบบ 3 มิติ 7 รูปที่ 6 ภาพกราฟิกประกอบการเรยี นการสอนเรื่องการทางานของเคร่ืองยนต์ 2 จงั หวะ 7 รปู ที่ 7 การจาลองสถานการณ์เพ่ือทดสอบความเสียหายของรถยนต์กรณีพุง่ ชนวัตถุ 8 รูปท่ี 8 ฉากและตัวละครในภาพยนตร์เรื่อง จรู าสสิค พาร์ค 9 รปู ที่ 9 ฉากและตวั ละครในเกมส์ GiG online 10 รปู ที่ 10 เปรยี บเทียบการแสดงผลภาพทีม่ คี ่าความละเอียด 72 ppi (ซ้าย) และ 300 ppi (ขวา) 10 รูปท่ี 11 หนว่ ยประมวลผลกลาง 11 รูปที่ 12 หน่วยความจาหลัก 11 รปู ที่ 13 หนว่ ยความจาสารอง 12 รปู ที่ 14 การด์ แสดงผล หรอื การด์ จอ 12 รปู ท่ี 15 จอภาพรปู แบบต่างๆ 13 รปู ที่ 16 กล้องดิจิตอล 13 รปู ที่ 17 เครือ่ งกราดภาพหรือสแกนเนอร์ 14 รปู ที่ 18 เครอ่ื งพมิ พ์ท่ีใช้ในงานทั่วไป (ซา้ ย) และ พล็อตเตอร์ (ขวา) 15 รปู ท่ี 19 กระดานกราฟิก 15 รูปท่ี 20 การแสดงภาพแบบราสเตอร์ เมื่อทาการขยายภาพ 16 รูปที่ 21 การแสดงภาพแบบเวคเตอร์ เม่ือทาการขยายภาพ 16 รูปท่ี 22 ตวั อยา่ งการสร้างภาพกราฟิกแบบเวคเตอร์ รปู ท่ี 23 ตัวอย่างการสร้างภาพกราฟิกแบบราสเตอร์ รปู ที่ 24 ภาพกราฟิกแบบราสเตอร์ (ซ้าย) และภาพกราฟิกแบบเวคเตอร์ (ขวา)

สารบัญรปู (ต่อ) หน้า 18 รูปที่ 19 รูปท่ี 25 จอภาพโมโนโครม (ซ้าย) และจอภาพสี (ขวา) 20 รูปที่ 26 ภาพศลิ ป์โดยคอมพิวเตอรก์ ราฟิก ออกแบบโดย Steven Wilson 21 รูปที่ 27 ภาพเคล่ือนไหว 2 มิติ โดยใช้คอมพวิ เตอร์ ในการ์ตนู เรือ่ ง Happy tree friends 21 รูปที่ 28 คอมพวิ เตอร์กราฟิก 2 มิติ กับการออกแบบบ้าน 22 รปู ที่ 29 คอมพิวเตอร์กราฟิก 2 มิติ กับกราฟและแผนภาพ 22 รูปที่ 30 แกน X, Y และ Z 23 รปู ที่ 31 งานแอนเิ มชนั 3 มิติ ในการต์ นู เรอ่ื ง Up 23 รปู ท่ี 32 การออกแบบภายในบ้านด้วยโปรแกรม 3 มติ ิ 24 รูปที่ 33 รปู แบบโครงสรา้ ง 3 มิตลิ ายเส้น (Mesh Object) 29 รปู ท่ี 34 รูปแสดง Vertex, Edge, Faces 30 รปู ท่ี 35 ระบบสี RGB 31 รูปที่ 36 รหัสสีมาตรฐานในภาษาอังกฤษ และรหัสสใี นเลขฐานสิบหก 32 รูปที่ 37 Web Safe RGB 33 รูปที่ 38 ระบบสี CMYK 34 รูปท่ี 39 สีPANTONE 35 รปู ที่ 40 ระบบสี HSB 37 รูปท่ี 41 ระบบสี LAB 38 รูปที่ 42 วรรณะสี 38 รูปท่ี 43 วงลอ้ สี 39 รูปที่ 44 Monochrome หรอื เอกรงค์ 39 รปู ท่ี 45 Complementary หรอื สตี ัดกัน 40 รปู ที่ 46 Triad หรอื สแี บบ 3 เส้า 41 รูปท่ี 47 Analogic หรอื สขี ้างเคยี ง 42 รูปท่ี 48 การออกแบบกราฟิกในปูายสัญลักษณ์จราจรทางหลวง รูปที่ 49 การออกแบบกราฟิกในหนา้ ปกซดี ีเพลงของกล่มุ ศิลปิน Wings

สารบญั รูป (ตอ่ ) 42 43 รปู ที่ 50 การออกแบบอินโฟกราฟกิ (Infographic) เชิญชวนบริจาคโลหติ โดย CreativeMove 43 รูปที่ 51 การออกแบบกราฟิกโดยใช้จุด 45 รูปที่ 52 เสน้ แบบต่างๆ ที่ให้ความรสู้ ึกแตกตา่ งกัน 45 รูปที่ 53 รปู ร่าง(Shape) และ รูปทรง(Form) 46 รปู ท่ี 54 แสดงน้าหนกั สี 46 รูปท่ี 55 ลกั ษณะพ้ืนผวิ ท่ีแตกต่างกัน 47 รูปที่ 56 การออกแบบกราฟิกท่ใี ชพ้ น้ื ที่วา่ ง ในโฆษณาเครอ่ื งดมื่ โค้ก 48 รูปที่ 57 สีทีบ่ ่งบอกถึงอารมณแ์ ละภาพลักษณ์กับประยุกต์ใช้ออกแบบโลโก้ 49 รูปที่ 58 ส่วนประกอบโปรแกรม Paint 51 รูปที่ 59 การเตรียมพนื้ ท่ีในโปรแกรม Paint 52 รปู ที่ 60 ความสมดุลที่เหมือนกัน จากหนา้ ปกหนังสอื Wordsplay 52 รปู ที่ 61 ความสมดลุ ที่ตา่ งกันจากโปสเตอร์ของ United States Library 53 รูปที่ 62 ความเปน็ เอกภาพในการออกแบบกราฟิก ออกแบบโดย JUSTIN M. MALLER 53 รปู ที่ 63 สดั สว่ นตา่ งๆ ของรา่ งกายมนุษย์ 54 รปู ที่ 64 การออกแบบรถยนต์โดยใช้กฎสดั สว่ นทอง 54 รปู ท่ี 65 จังหวะในการออกแบบกราฟิก ออกแบบบโดย Jurriaan Schrofer 55 รูปท่ี 66 การตัดกนั ในการออกแบบกราฟกิ ออกแบบโดย Takashi Kusui 56 รูปที่ 67 การรวมตัวเพื่อสร้างความรสู้ ึกสมั ผสั ด้านสแี ละลักษณะผิว ออกแบบโดย JR Schmidt 56 รปู ที่ 68 การรปู ทรงเรขาคณิตในการออกแบบกราฟิก ออกแบบโดย Ikko Tanaka 57 รูปที่ 69 กรอบของภาพถ่าย ออกแบบโดย Jeremy Cowart 57 รปู ที่ 70 การตัดต่อรปู ภาพในงานกราฟิก 58 รูปที่ 71 หลักการทางานของเลเยอร์ 58 รปู ที่ 72 การตดั (Cut) และการวาง (Paste)ในงานกราฟกิ 59 รูปที่ 73 แสดงเลเยอร์ท่เี ปน็ ข้อมูลในงานกราฟกิ จาก Bangkok Bicycle campaign 60 รปู ที่ 74 แสดงเลเยอร์ท่สี ัมพันธ์กับเวลา ในโปรแกรมตดั ต่อ Final cut pro 61 รปู ที่ 75 โปสเตอรจ์ ักรยาน โดย CreativeMove 61 รปู ที่ 76 ฟอนต์ 62 รปู ที่ 77 เปรยี บเทียบระหวา่ งฟอนต์ iannnnnPDA กับฟอนต์ can_Rukdeaw01 62 รูปที่ 78 ช่องไฟ (Letter Space, Character space) รปู ท่ี 79 การล้า (Kerning)

สารบัญรูป (ตอ่ ) 63 63 รปู ที่ 80 วรรคคา (Word Space) 64 รูปท่ี 81 ชอ่ งว่างระหว่างบรรทดั (Line Space) 64 รปู ที่ 82 การตัง้ ค่าหนา้ กระดาษในโปรแกรม Microsoft Word 66 รูปท่ี 83 เปรียบเทยี บระหว่างฟอนต์ TH Niramit AS และฟอนต์ BLK THAI-VI28 67 รูปที่ 84 การใช้สัญลกั ษณ์แทนตวั อกั ษรมากเกนิ ไป 69 รูปที่ 85 คอมพวิ เตอร์และอุปกรณ์ในการทางานกราฟกิ 70 รูปท่ี 86 โปรแกรมPhotoshopCS6(ซา้ ย) และโปรแกรม Illustrator CS6(ขวา) 71 รูปที่ 87 การตกแต่งรปู ดว้ ยโปรแกรม Photoshop CS6 71 รูปท่ี 88 แสดงการประกอบกันของพิกเซลเปน็ ภาพขนาดต่างๆ 76 รปู ท่ี 89 พ้ืนท่ีการทางานของโปรแกรม Photoshop 76 รปู ท่ี 90 การสรา้ งเส้นพาธในโปรแกรม Illustrator 77 รปู ที่ 91 การวาดรปู ดว้ ยโปรแกรม Illustrator CS6 80 รูปที่ 92 พน้ื ที่การทางานของโปรแกรม Illustrator 81 รูปท่ี 93 งานออกแบบส่ือส่ิงพิมพ์ 82 รปู ท่ี 94 เลย์เอาตย์ ่อขนาดหรือร่างหยาบย่อขนาด รปู ที่ 95 เลยเ์ อาตห์ ยาบหรือร่างหยาบ 82 รปู ท่ี 96 การพัฒนาการของเลย์เอาต์จากหยาบจนมาเป็นเลย์เอาต์สมบูรณ์ 83 ของนิตยสาร Brandweek 83 รปู ท่ี 97 ตัวอยา่ งดัมมแ่ี บบหยาบ (ซา้ ย) และดัมม่ีแบบสมบูรณ์ (ขวา) 84 รปู ที่ 98 งานกองบรรณาธิการ ของสานกั พิมพ์ Freestyle Magazine 84 รูปที่ 99 งานบรรณาธิการฝุายศิลป์ 84 รูปท่ี 100 งานในโรงพมิ พ์ 85 รปู ท่ี 101 สง่ิ พิมพ์จากโรงพิมพ์ 86 รูปที่ 102 งานออกแบบตัวอกั ษร 87 รปู ที่ 103 ฟอนต์ฟรมี าตรฐาน จากสานกั งานส่งเสรมิ อตุ สาหกรรมซอฟต์แวรแ์ ห่งชาติ 88 รูปที่ 104 งานอินฟอรเ์ มช่นั ดีไซน์ 89 รปู ท่ี 105 งานอนิ เตอรแ์ อ็คทีฟกราฟิก 91 รปู ท่ี 106 งานออกแบบเว็บไซต์ รูปที่ 107 สตอรีบอรด์

สารบัญรปู (ต่อ) 92 92 รูปที่ 108 เคลย์แอนเิ มชัน จากการต์ ูนเร่ือง Frankenweenie 93 รปู ท่ี 109 คทั เอาทแ์ อนิเมชนั 93 รูปที่ 110 กราฟกิ แอนเิ มชัน 94 รปู ท่ี 111 โมเดลแอนิเมชน่ั 94 รปู ที่ 112 แอนิเมชันทเี่ ล่นกบั วัตถุอืน่ ๆ 95 รูปท่ี 113 พิลซิลเลชัน 95 รูปที่ 114 แอนเิ มชันกราฟกิ 96 รูปที่ 115 โปสเตอร์โฆษณา ของผลติ ภณั ฑ์น้ายาบ้วนปาก ลสิ เตอรนี รปู ท่ี 116 งานถา่ ยทาภาพยนตร์ จากภาพยนตร์เร่ืองแฮร์รี่ พอตเตอร์

สารบัญตาราง หนา้ 17 ตารางที่ ตารางที่ 1 การเปรยี บเทียบความแตกต่างของภาพกราฟิกแบบราสเตอร์และแบบเวคเตอร์ 36 44 ตารางที่ 2 จติ วิทยาของสี 48 ตารางที่ 3 เส้นกับอารมณ์ความรสู้ ึก 50 ตารางที่ 4 รูปแบบตัวอักษรและการนาไปใชง้ าน 72 ตารางที่ 5 เครื่องมือต่างๆ ในโปรแกรม Paint 72 ตารางที่ 6 สว่ นประกอบของโปรแกรมPhotoshop และลักษณะการทางาน 73 ตารางที่ 7 คาส่งั ในแถบเมนูและลกั ษณะการทางานโปรแกรม Photoshop 75 ตารางท่ี 8 ไอคอนในกลอ่ งเคร่อื งมือและลักษณะการทางานโปรมแกรม Photoshop 77 ตารางท่ี 9 พาเลตและลกั ษณะการทางานโปรแกรม Photoshop 78 ตารางท่ี 10 ส่วนประกอบของโปรแกรมIllustrator และลักษณะการทางาน 79 ตารางท่ี 11 คาส่งั ในแถบเมนูและลักษณะการทางานโปรแกรม Illustrator ตารางที่ 12 ไอคอนในกลอ่ งเครอ่ื งมือและลักษณะการทางานโปรมแกรม Illustrator

1 บทท่ี 1 ความรู้เบอ้ื งตน้ เกยี่ วกบั คอมพิวเตอร์กราฟกิ ความหมายของกราฟกิ และคอมพิวเตอร์กราฟิก กราฟิก (Graphic) มาจากคาในภาษากรีก 2 คา ได้แก่ Graphikos หมายถึง การเขียนภาพสีและภาพ ขาวดา กับคาว่า Graphein ท่ีหมายถึง การเขียนด้วยตัวหนังสือและการส่ือความหมายโดยการใช้เส้น ซ่ึงต่อมามี ผู้ให้ความหมายของคาว่า “กราฟิก” ไว้หลายประการแต่สามารถท่ีจะสรุปได้ว่า กราฟิก หมายถึง “งานท่ีต้องการ แสดงความจริงหรือความคิดผ่านการส่ือความหมายด้วยเส้น สัญลักษณ์ รูปวาด ภาพถ่าย กราฟ แผนภูมิ การ์ตูน ฯลฯ เพ่ือให้สามารถส่ือความหมายได้ถูกต้องตรงตามท่ีผู้ส่ือสารต้องการ” โดยปกติแล้วงานทางด้านกราฟิกจะ แสดงผลให้เหน็ ในลกั ษณะของภาพท่ีเรียกว่า ภาพกราฟิก 2 ประเภท ได้แก่ ภาพกราฟิกแบบ 2 มิติ (2 Dimension: 2D) เป็นภาพที่คุ้นเคยและพบเห็นโดยท่ัวไป เช่น ภาพถ่าย ภาพวาด ภาพลายเส้น สญั ลักษณ์ โลโก้ กราฟ รวมถงึ การต์ ูนต่างๆ ในโทรทัศน์ ฯลฯ ภาพกราฟิกแบบ 3 มิติ (3 Dimension: 3D) เป็นภาพกราฟิกที่ใช้โปรแกรมสร้างภาพ 3 มิติ โดยเฉพาะ เชน่ โปรแกรม 3Ds Max โปรแกรม Maya ภาพท่ีได้จะมีสีและแสงเงาท่ีเสมือนจริง ซ่ึงเราจะคุ้นเคยกับ ภาพลักษณะน้ใี นภาพยนตร์หรือการต์ ูนเอนเิ มชัน่ 3 มิติ เป็นตน้ รปู ที่ 1 ภาพกราฟิกแบบ 2 มิติ (ซ้าย) และภาพกราฟิกแบบ 3 มติ ิ (ขวา) ท่ีมา http://www.dyllankhawam.com/survey/ คอมพิวเตอร์กราฟิก (Computer Graphics) หมายถึง “การใช้เทคโนโลยีคอมพิวเตอร์ในการจัดการ รูปภาพ โดยการสร้าง ตกแต่งแก้ไข และนาเสนอภาพกราฟิกผ่านจอภาพ หรือพิมพ์ออกมาผ่านเคร่ืองพิมพ์ ที่ สามารถสื่อความหมายได้ตรงตามทผ่ี ู้สื่อสารต้องการ”

2 ประวัติของคอมพิวเตอร์กราฟิก การสร้างภาพกราฟิกในอดีตน้ันสามารถทาได้โดยใช้ ดินสอ ปากกา หมึก สี เขียนบนพื้นผิววัสดุ ตา่ งๆ เช่น ผนงั ถ้า ไมไ้ ผ่ ผา้ หรอื กระดาษ ฯลฯ ต่อมามีการพัฒนาเทคโนโลยีทางด้านคอมพิวเตอร์มาใช้งานใน ด้านต่างๆ คอมพิวเตอร์จึงเร่ิมเข้ามามีบทบาทมากข้ึนในงานกราฟิกจนถึงปัจจุบัน ซ่ึงประวัติความเป็นมาหรือ พฒั นาการของการนาคอมพวิ เตอร์มาใช้ในงานกราฟิก สามารถสรุปได้ดงั นี้ ในระยะเริม่ แรก ปี ค.ศ. 1940 มีการนาคอมพวิ เตอร์มาใช้ในการแสดงผลภาพกราฟิกโดยรูปภาพท่ีสร้าง ข้นึ มานั้นจะเป็นภาพท่ีเกิดจากการใช้ตัวอักษรมาประกอบกันและทาการแสดงผลภาพโดยใช้เครื่องพิมพ์ ต่อมาใน ปี ค.ศ. 1950 สถาบันเทคโนโลยีแห่งแมสซาซูเซสต์ (Massachusetts Institue Technology: MIT] ได้มีการ พัฒนาคอมพิวเตอร์ ให้มีส่วนแสดงผลภาพโดยใช้หลอดภาพ CRT (Cathode Ray Tube) มาใช้แทนเครื่องพิมพ์ เนื่องจากมีความต้องการให้เกิดการติดต่อระหว่างผู้ใช้กับคอมพิวเตอร์ให้มีความเร็วมากยิ่งข้ึน และในปีเดียวกัน นั้น กองทัพอากาศ สหรัฐอเมริกา ได้ทาการพัฒนาระบบ SAGE (Semi - Automatic Ground Environment) (รูปท่ี 2) ท่ีมีความสามารถในการแปลงสัญญาณจากเรดาร์ให้เป็นภาพบนจอคอมพิวเตอร์ ถือว่าเป็นระบบ คอมพิวเตอร์กราฟิกเคร่ืองแรกที่มีการใช้ปากกาแสง (Light Pen) สาหรับการเลือกสัญลักษณ์ บนจอภาพได้ และ หลังจากนน้ั ระหว่างช่วงปี ค.ศ.1960-1970 ได้มีการศึกษาวิจัยเก่ียวกับระบบคอมพิวเตอร์เป็นจานวนมากซ่ึงกลาย มาเปน็ ตน้ แบบของระบบคอมพวิ เตอรก์ ราฟิกสมยั ใหมใ่ นช่วงเวลาต่อมา ดังเช่นในงานวิทยานิพนธ์ปริญญาเอกของ อวี าน ซูเธอร์แลนด์ (Ivan Sutherland) (1963) ท่ีได้พัฒนาระบบการวาดเส้น ท่ีสามารถกาหนดจุดบนจอภาพได้ โดยตรงโดยการใช้ปากกาแสง โดยคอมพิวเตอร์จะสามารถลากเส้นเช่ือมจุดต่างๆ เหล่าน้ีเข้าด้วยกัน กลายเป็น ภาพโครงสร้างรูปหลายเหลี่ยม ระบบนี้ได้กลายเป็นหลักการพ้ืนฐานของโปรแกรมช่วยในการออกแบบระบบงาน ต่างๆ มากมาย เช่น การออกแบบระบบไฟฟูา และการออกแบบเคร่ืองจักร เป็นต้น ต่อมาในปี ค.ศ. 1965 บริษัท ไอบีเอ็ม (IBM) ไดท้ าการผลิตจอภาพในระบบหลอดภาพ CRT ออกมาขายเป็นจานวนมากในราคาถูก ส่งผลให้งาน ในสาขาคอมพวิ เตอร์กราฟิกเร่ิมเป็นที่สนใจของคนท่ัวไป แต่ระบบหลอดภาพ CRT น้ันมีปัญหาบางประการในการ แสดงผลกค็ อื การวาดเส้นตรงระหว่างจุดสองจุดบนจอภาพนน้ั ภาพที่วาดจะจางหายไปจากจออย่างรวดเร็ว ทาให้ ต้องวาดซ้าลงทเี่ ดมิ หลายๆ คร้ังใน 1 วินาที เพ่ือให้มองเห็นว่าเส้นไม่จางหายไป ซ่ึงปัญหานี้ได้ถูกแก้ไขโดย บริษัท เทคโทรนิกส์ (Tektronix) (1968) ที่สามารถผลิตจอภาพแบบเก็บภาพไว้ได้จนกว่าต้องการจะลบ (Storage - Tube CRT) ซึ่งระบบนี้ไม่ต้องการหน่วยความจาและระบบการวาดซ้า จึงทาให้ราคาจอภาพถูกลงมาก และเป็นที่ นิยมกันมากในช่วงเวลา 5 ปี และหลังจากน้ันในช่วงกลางปี ค.ศ. 1970 เป็นช่วงเวลาที่อุปกรณ์ทางคอมพิวเตอร์ เริ่มมีราคาลดลงมาก ทาให้ฮาร์ดแวร์ของระบบคอมพิวเตอร์กราฟิกมีราคาถูกลงตามไปด้วย ผู้ใช้ทั่วไปจึงสามารถ นามาใชใ้ นงานของตนได้ ทาใหก้ ารใชค้ อมพิวเตอร์กราฟิกเร่ิมแพร่หลายไปในงานด้านต่างๆ มากข้นึ

3 รูปท่ี 2 ระบบ SAGE (Semi - Automatic Ground Environment) ทมี่ า http://images.yourdictionary.com/light-pen สาหรับการพัฒนาซอฟต์แวร์ที่ใช้งานทางด้านกราฟิกนั้น ก็ได้มีการพัฒนาควบคู่มากับการพัฒนา ฮาร์ดแวร์ทางด้านคอมพิวเตอร์ การพัฒนาซอฟต์แวร์เร่ิมแรกก็เริ่มมาจากงานของ อีวาน ซูเธอร์แลนด์ ผู้ซึ่งได้ ออกแบบวิธีการหลักๆ รวมท้ังโครงสร้างข้อมูลของระบบคอมพิวเตอร์กราฟิก ต่อมาก็มี สตีเฟน คูน (Steven Coons, 1966) และ ปิแอร์ เบเซอร์ (Pierre Bazier, 1972) ได้ทาการศึกษาเก่ียวกับการสร้างเส้นโค้งและภาพ พน้ื ผิว ถือวา่ เปน็ ต้นแบบของการศึกษาท่ีทาใหป้ จั จุบันเราสามารถสร้างภาพ 3 มิตไิ ด้สมจรงิ มากขึ้น การออกแบบกราฟิกในปัจจุบันมีการพัฒนาซอฟต์แวร์ที่ใช้งานขึ้นมาอย่างมากมาย และสามารถใช้งาน ได้อย่างมีประสิทธิภาพมากย่ิงข้ึนกว่าในอดีต ซ่ึงซอฟต์แวร์คอมพิวเตอร์ที่สนับสนุนงานทางด้านกราฟิกท่ีได้รับ ความนิยม ได้แก่ Adobe Photoshop / Illustrator / PageMaker / CorelDraw / 3D Studio / LightWave 3D / AutoCad ฯลฯ ซึ่งเป็นเคร่ืองมือท่ีมีความสาคัญสาหรับนักออกแบบและศิลปิน ให้สามารถสร้างสรรค์งาน กราฟิกท่ีมคี วามสวยงาม แปลกตา และมบี ทบาทในงานทางด้านต่างๆ ของสังคมในปัจจุบัน ทั้ง งานทางด้านธุรกิจ โรงงานอุตสาหกรรม งานศิลปะ งานด้านการบันเทิง งานโฆษณา งานด้านการศึกษา การวิจัย การฝึกอบรม เป็น ตน้

4 ประโยชนข์ องคอมพวิ เตอรก์ ราฟกิ กับสังคมปัจจบุ นั จากความก้าวหน้าของเทคโนโลยีทางด้านคอมพิวเตอร์และการติดต่อสื่อสารของโลกส่งผลระบบการ ติดต่อส่ือสารและการกระจายข้อมูลข่าวสารในยุคปัจจุบันสามารถทาได้อย่างรวดเร็วและมีประสิทธิภาพมากข้ึน กว่าในอดีต แต่การทาความเข้าใจกับข้อมูลท่ีรับมาน้ันเป็นเรื่องที่ไม่ง่ายนัก เป็นผลเนื่องมาจากท้ังความแตกต่าง ทางดา้ นสงั คม วฒั นธรรม ความเชื่อของแตล่ ะทอ้ งถน่ิ ดังน้ัน การใช้งานกราฟิกเพ่ือการสื่อสาร หรือสื่อความหมาย นั้น ผู้ใช้จาเป็นต้องคานึงถึงเง่ือนไขและปัญหาเหล่านี้ด้วย เพ่ือให้การสื่อความหมายมีความชัดเจนถูกต้อง เกิด ความเขา้ ใจและจนิ ตนาการรว่ มกนั ในทิศทางเดียวกัน คอมพวิ เตอรก์ ราฟิกเข้ามามีบทบาทในงานทางดา้ นต่างๆ ของสงั คมในปัจจบุ นั เช่น 1.3.1 การเลือกใช้ภาพกราฟิกแสดงข้อมูลหรือผลงานแทนด้วยการแสดงด้วยข้อความ ซ่ึงทาให้ง่าย แก่ความเข้าใจ และมีความน่าสนใจ ดังจะเห็นได้จากหลายหน่วยงานของประเทศใช้วิธีนี้ในการแนะนาหน่วยงาน นาเสนอโครงการและแสดงผลงาน เป็นต้น (รูปท่ี 3) รูปท่ี 3 แผน่ พับประชาสัมพันธห์ ลกั สูตรของคณะเทคโนโลยีสารสนเทศและการส่ือสาร มหาวิทยาลัยพะเยา ทมี่ า http://www.ict.up.ac.th/ 1.3.2 ใช้แสดงแผนที่ แผนผัง และภาพของส่ิงต่างๆ ซึ่งภาพเหล่านี้ไม่สามารถแสดงในลักษณะอ่ืนได้ นอกจากการแสดงด้วยภาพกราฟิกเท่านัน้ (รปู ที่ 4)

5 รูปที่ 4 แผนที่แสดงทจ่ี ัดงาน วิทยาศาสตร์วจิ ัย คร้ังท่ี 5 มหาวิทยาลัยพะเยา ทม่ี า http://www.src5.up.ac.th/src5/files/src5_map 1.3.3 การใช้คอมพิวเตอร์กราฟิกในงานการออกแบบทางด้านต่างๆ เช่น ออกแบบบ้าน ออกแบบ ภายในอาคาร รถยนต์ เคร่ืองจักร เคร่ืองแต่งกาย การแต่งหน้า และเคร่ืองมือเคร่ืองใช้อื่นๆ ฯลฯ ซ่ึงสามารถทาได้ รวดเรว็ สวยงาม และประหยัดคา่ ใช้จ่าย (รูปท่ี 5) รปู ที่ 5 การออกแบบภายในห้องนา้ แบบ 3 มติ ิ ท่ีมา http://www.taimediasolution.com/3d-home/pages/44.htm 1.3.4 การนาไปใช้งานทางการด้านเรียนการสอน สาหรับวิชาท่ีต้องการใช้ภาพ แผนผัง หรือแผนท่ี ประกอบในการจัดการเรียนการสอน ตัวอย่างเช่น บทเรียนเก่ียวกับเคร่ืองมืออุตสาหกรรมท่ีมีการใช้ภาพกราฟิก เพื่อแสดงส่วนประกอบและการทางานของเครื่องมือที่มีความสลับซับซอ้ นให้เห็นไดง้ ่าย (รูปที่ 6)

6 รปู ที่ 6 ภาพกราฟิกประกอบการเรียนการสอนเรื่องการทางานของเครื่องยนต์ 2 จังหวะ ทม่ี า http://auto.lannapoly.ac.th/e-learning/engine/content/work%202%20stroke.htm 1.3.5 การประยุกตใ์ ช้คอมพิวเตอร์กราฟิกสาหรับจาลองสถานการณ์เพ่ือหาคาตอบในเชิงพยากรณ์ เช่น ในการทดสอบความเสียหายของรถยนต์ในกรณีท่ีพุ่งเข้าชนกาแพงตามความเร็วที่กาหนด (รูปที่ 7) จะเกิด ความเสียหายในบริเวณไหน และผู้โดยสารจะเป็นอย่างไร ซ่ึงการจาลองสถานการณ์โดยใช้เทคโนโลยีดังกล่าวจะ ช่วยให้ทราบผลการทดสอบอย่างรวดเรว็ ประหยัดคา่ ใช้จ่าย และไมท่ าใหเ้ กิดอันตราย รูปที่ 7 การจาลองสถานการณเ์ พอ่ื ทดสอบความเสียหายของรถยนต์กรณพี ุ่งชนวตั ถุ ทีม่ า http://www.nytimes.com/2007/06/17/automobiles/17CRASH.html?pagewanted=all 1.3.6 คอมพิวเตอร์กราฟิกถูกนามาใช้ในการสร้างภาพนิ่ง ภาพสไลด์ ภาพยนตร์ และรายการวิดีโอ ดงั ท่จี ะพบเหน็ ไดจ้ ากภาพยนตร์แนววทิ ยาศาสตร์หลายเร่ือง (รูปท่ี 8) ท่ีมีการใช้คอมพิวเตอร์กราฟิกสร้างฉากและ ตัวละคร ซึ่งจะทาให้ดสู มจรงิ ไดด้ ีกว่าการสรา้ งดว้ ยวิธีอื่น

7 รูปที่ 8 ฉากและตัวละครในภาพยนตรเ์ ร่ือง จรู าสสคิ พาร์ค ทมี่ า http://www.npss.prn.bc.ca/teachers/andrews/ANIM%2011/NOTES/History.htm 1.3.7 การใช้คอมพิวเตอร์กราฟิกเพื่อสร้างฉากและตัวละครในเกมส์คอมพิวเตอร์ เพื่อทาให้เกมส์มี ความนา่ สนใจและให้ความสนุกมากย่ิงข้นึ (รูปที่ 9) รปู ท่ี 9 ฉากและตัวละครในเกมส์ GiG online ที่มา www.gigonline.in.th

8 บทที่ 2 ระบบคอมพวิ เตอรก์ ับงานกราฟิก 2.1 การเกดิ ภาพบนเครอื่ งคอมพวิ เตอร์ มีคาศพั ทท์ มี่ ีความเก่ียวข้องกบั การเกดิ ภาพบนเคร่ืองคอมพิวเตอร์ ดังนี้ 2.1.1 จุดภาพ หรือ พิกเซล (Pixel) มาจากคาว่า Picture กับคาว่า Element เป็นหน่วยพื้นฐานของ ภาพ คือ จุดสี่เหล่ียมเล็กๆ ที่เรียงต่อกันทาให้เกิดเป็นภาพขึ้น โดยภาพหนึ่งๆ จะประกอบด้วยจุดภาพมากมาย และมคี วามหนาแนน่ แตกตา่ งกันออกไป 2.1.2 ความละเอียดของภาพ (Resolution) เป็นค่าความละเอียดของภาพซ่ึงกาหนดเป็นจุดภาพต่อ นิ้ว (Pixel Per Inch: ppi) หรือ จุดต่อน้ิว (Dot Per Inch: dpi) ที่หมายถึงในพื้นท่ี 1 ตารางนิ้วน้ันจะกาหนดให้มี จานวนจุดภาพกี่จุด ตัวอย่างเช่น ถ้ากาหนดค่าความละเอียดของภาพท่ี 10 ppi หมายความว่าในพ้ืนท่ี 1 ตารางน้ิวของภาพจะประกอบไปด้วยจุดภาพจานวน 100 จุดภาพ (ความกว้าง 10 จุดภาพ x ความยาว 10 จุดภาพ เท่ากับ 100 จุดภาพ) ซ่ึงถ้ากาหนดจานวนจุดภาพมากขึ้นเท่าไหร่ความละเอียดของภาพก็จะมากขึ้นตาม โดยปกติจอภาพสามารถแสดงภาพกราฟิกได้ที่ความละเอียด 72 ถึง 96 ppi ซ่ึงการต้ังความละเอียดของภาพน้ัน จะข้ึนอยู่กับงานท่ีต้องการใช้ เช่น การใช้งานภาพกราฟิกบนเว็บไซต์ท่ีต้องการความรวดเร็วในการแสดงผล ควร กาหนดค่าความละเอยี ดท่ี 72 ppi ส่วนงานท่ีต้องการภาพท่ีมีความละเอียดสูงหรือคุณภาพดี ควรกาหนดค่าความ ละเอยี ดมากกว่า 300 ppi ขนึ้ ไป (รูปท่ี 10) เปน็ ต้น รูปท่ี 10 เปรียบเทียบการแสดงผลภาพท่ีมคี า่ ความละเอยี ด 72 ppi (ซา้ ย) และ 300 ppi (ขวา) ทีม่ า http://www.bestprintingonline.com/resolution.htm 2.1.3 การแสดงผลของอุปกรณ์แสดงผล (Output Devices) คือ การแสดงผลภาพกราฟิกบน ฮาร์ดแวร์ที่เกี่ยวข้องกับการแสดงผลของคอมพิวเตอร์ เช่น จอภาพ (Monitor) หรือเคร่ืองพิมพ์ (Printer) ซึ่งโดย ปกติการพมิ พ์ภาพกราฟิกผ่านเครื่องพมิ พ์น้ัน ควรกาหนดค่าความละเอียดไม่ต่ากว่า 300 ppi เพราะถ้ากาหนดต่า กว่าน้ีจะทาให้ภาพที่พิมพ์ออกมาสูญเสียคุณภาพหรือรายละเอียดไป ภาพจะดูหยาบไม่ละเอียด แต่ถ้ากาหนดให้ ภาพมคี ่าความละเอยี ดสูงกจ็ ะส่งผลใหข้ นาดของภาพมีขนาดใหญ่ ซึ่งจะทาให้โปรแกรมคอมพิวเตอร์กราฟิกที่ใช้ใน การแสดงผลหรือสั่งพิมพ์ทางานได้ช้าลง ดังน้ันจาเป็นจะต้องมีการปรับค่าความละเอียดของภาพให้เหมาะสมกับ งานที่มคี วามแตกตา่ งกัน

9 2.2 อปุ กรณ์คอมพิวเตอร์หลักสาหรบั งานกราฟกิ ระบบคอมพิวเตอร์สาหรับงานด้านกราฟิกนั้นต้องการอุปกรณ์คอมพิวเตอร์หลักที่มีประสิทธิภาพ เพ่ือ การประมวลผลท่ีรวดเร็ว ซงึ่ จะมีองค์ประกอบและคณุ สมบตั ิ ดงั นี้ (เกยี รตพิ งษ์ บุญจิตร, 2552) 2.2.1 หน่วยประมวลผลกลาง (Central Processing Unit: CPU) หรือ ซีพียู เรียกอีกช่ือหนึ่งว่า โปรเซสเซอร์ (Processor) หรือ ชิป (Chip) (รูปท่ี 11) ถือว่าเป็นอุปกรณ์ท่ีมีความสาคัญมากที่สุด เปรียบได้เป็น สมองของคอมพิวเตอร์เลยก็ว่าได้ มีหน้าที่ในการประมวลผลข้อมูลท่ีผู้ใช้ปูอน เข้ามาทางอุปกรณ์นาเข้า (Input Unit) ตามชุดคาส่งั หรือโปรแกรมท่ีผใู้ ช้ต้องการใช้งาน ซึ่งการใช้งานโปรแกรมทางด้านกราฟิกต้องการการคานวณ จานวนมาก หน่วยประมวลผลกลางที่ประมวลผลรวดเร็วจะทาให้การตอบสนองคาส่ังเป็นไปอย่างรวดเร็วตามไป ด้วย รูปที่ 11 หน่วยประมวลผลกลาง 2.2.2 หน่วยความจา (Memory Unit) เป็นอุปกรณ์ท่ีใช้ในการจดจาข้อมูล หรือบันทึกข้อมูลใน ระบบคอมพวิ เตอร์ ซึง่ จะประกอบด้วย หน่วยความจาหลัก (Main Memory Unit) หน่วยความจาท่ีต่อกับหน่วยประมวลผลกลาง ท่ี สามารถเรยี กใชง้ านไดโ้ ดยตรง หนว่ ยความจาชนดิ น้ีจะเก็บข้อมูลและชุดคาส่ังในระหว่างการประมวลผล และถ้ามี การประมวลผลขอ้ มูลตามชดุ คาส่ัง ผลลัพธ์ที่ได้จะถูกนาไปเก็บไว้ท่ีหน่วยความจาหลัก ก่อนจะถูกนาออกไปแสดง ท่อี ปุ กรณแ์ สดงผลต่อไป (รปู ท่ี 12) หน่วยความจาสารอง (Secondary Storage Unit) คือ อุปกรณ์มีหน้าท่ีในการบันทึกหรือ จัดเก็บข้อมูลได้เหมือนกับหน่วยความจาหลัก แต่มีความสามารถบันทึกข้อมูลไว้ในการประมวลผลคร้ังต่อไป ภายหลังได้แม้จะปิดเครื่องคอมพิวเตอร์ โดยข้อมูลท่ีถูกบันทึกไว้จะไม่สูญหายหรือถูกลบท้ิง อุปกรณ์สารอง ข้อมลู ในปัจจบุ นั มีใหเ้ ลอื กอยู่หลายชนดิ หลายขนาด และหลายราคา ตามความตอ้ งการใชง้ าน เช่น Hard disk drive, Floppy Disk Drive, Zip Drive, Thumb Drive, CD-R, CD-RW หรือ DVD เป็นตน้ (รูปท่ี 13) รูปที่ 12 หน่วยความจาหลัก

10 ท่มี า http://www.thaigoodview.com/library/contest2552/type1/tech03/18/ prakopmemory.html External Hard Disk Diskette Zip Drive Thumb Drive CD-Writer DVD-Writer รปู ท่ี 13 หนว่ ยความจาสารอง โปรแกรมสาเรจ็ รูปด้านกราฟิกนั้นประมวลผลกับข้อมูลจานวนมาก จึงควรเลือกอุปกรณ์หน่วยความจา ท่ีมีความจุมาก ถ้าอุปกรณ์หน่วยความจามีความจุน้อยเกินไปทาให้โปรแกรมประมวลผลการทางานช้า หรือไม่ ประมวลผลเลยเนือ่ งจากหน่วยความจาไม่เพยี งพอต่อการประมวลผลข้อมูล 2.2.3 การ์ดแสดงผล หรือการ์ดจอ (Video Card) เป็นแผงวงจรอิเล็กทรอนิกส์ ท่ีทาหน้าที่ในการนา ข้อมูลที่ได้จากการประมวลผลของซีพียูมาแสดงบนจอภาพ ทาให้ผู้ใช้สามารถควบคุมการทางาน ได้อย่างมี ประสิทธิภาพ โดยจอภาพจะเป็นสว่ นทรี่ ับข้อมูลจากการ์ดแสดงผลอีกทีหน่ึง ในงานทางด้านคอมพิวเตอร์กราฟิกท่ี ตอ้ งการแสดงผลภาพกราฟกิ อย่างเสมือนจริงมากท่ีสุดควรจะใช้งานการ์ดจอท่ีมีประสิทธิภาพและมีหน่วยความจา ทเ่ี พยี งพอ ซ่งึ อปุ กรณ์แสดงผลทางจอภาพที่มีความละเอียดสูงจะแสดงจานวนสีมาก และสามารถแสดงภาพได้ทุก รายละเอียดสีของภาพ (รปู ที่ 14) รปู ที่ 14 การด์ แสดงผล หรอื การด์ จอ ทีม่ า http://thn22107.blogspot.com/2013_02_01_archive.html

11 2.2.4 จอภาพ (Monitor) คือ อุปกรณ์ท่ีรับสัญญาณจากการ์ดแสดงผล มาแสดงเป็นภาพ ซ่ึงในงาน คอมพิวเตอร์กราฟกิ ควรจะเป็นจอภาพที่มีความคมชัดและมีความละเอียดสูง ซึ่งจอภาพท่ีมีคุณภาพสามารถแสดง ภาพได้ความคมชดั สมจริง และสน่ั ไหวน้อย หรือไม่สั่นไหว ซ่ึงช่วยรักษาสุขภาพทางตาของผู้ใช้งานได้อย่างดี (รูป ที่ 15) รูปท่ี 15 จอภาพรูปแบบตา่ งๆ 2.3 อุปกรณ์คอมพวิ เตอรเ์ สรมิ สาหรบั งานกราฟิก อุปกรณ์เสริมทชี่ ่วยให้การทางานด้านกราฟิกมีความสะดวก รวดเร็ว และมีประสิทธิภาพมากยิ่งขึ้นมีอยู่ มากมาย เช่น กล้องดิจิตอล (Digital Camera) เคร่ืองกราดภาพหรือเคร่ืองสแกนเนอร์ (Scanner) เคร่ืองพิมพ์ (Printer) และกระดานกราฟิก (Graphic Tablet) เป็นต้น 2.3.1 กล้องดิจิตอล (Digital Camera) เปน็ อปุ กรณ์เสริมที่ใช้สร้างภาพน่ิง หรือภาพวิดีโอ ต่างๆ แล้ว นาเข้ามาจัดการในเคร่ืองคอมพิวเตอร์เพื่อทาการแก้ไข ปรับแต่ง เพิ่มเติม และจัดเก็บไฟล์ภาพแสดงผลออกมา จากยังจอภาพ หรอื พมิ พอ์ อกมาทางเคร่ืองพิมพ์ ปัจจุบันกล้องดิจิตอลได้พัฒนาให้มีความละเอียดของภาพเพิ่มข้ึน สามารถบันทึกเพ่ือจัดเก็บภาพได้รวดเร็วและจัดเก็บได้จานวนมาก (รูปที่ 16) ซ่ึงในงานทางด้านกราฟิกน้ัน จะทา การนาภาพจากกล้องดิจิตอลที่ได้รับการนาเข้าสู่ระบบคอมพิวเตอร์เพื่อทาการปรับปรุงให้เหมาะสมกับงานต่างๆ ได้รวดเร็วโดยใช้โปรแกรมสาเรจ็ รปู ในงานคอมพิวเตอร์กราฟิกที่มีอย่มู ากมายในปจั จุบัน รูปท่ี 16 กลอ้ งดิจิตอล ที่มา http://techglobex.blogspot.com/2011/04/buy-best-digital-camera-for- vacations.html

12 2.3.2 เครื่องกราดภาพ (Scanner) คืออุปกรณ์ท่ีใช้ต่อพ่วงเข้ากับเครื่องคอมพิวเตอร์เพื่อนาเข้าภาพ หรือข้อความเข้าไปในหน่วยความจาของเครื่องคอมพิวเตอร์ด้วยวิธีการกราดแสงผ่านคอมพิวเตอร์ (รูปที่ 17) นา ข้อมูลเข้าหน่วยความจาสามารถนารูปภาพที่ได้มาแก้ไข ปรับแต่ง เพิ่มเติม จัดเก็บ และแสดงผลออกมาทาง จอภาพ หรอื แสดงผลออกมาทางเครื่องพิมพ์ รูปที่ 17 เครือ่ งกราดภาพหรอื สแกนเนอร์ ทีม่ า http://project.cs.hcu.ac.th/SP/cdict/main.php?cpage=search&q=scanner# 2.3.3 เครื่องพิมพ์ (Printer) และเครื่องวาดหรือพล็อตเตอร์ (Plotter) คืออุปกรณ์ท่ีใช้ต่อพ่วงเข้า กับเครื่องคอมพิวเตอร์เพื่อแสดงผลข้อมูลต่างๆ โดยการพิมพ์ข้อมูลที่มีลักษณะข้อความ สี และลายเส้นต่างๆ ลง บนวัสดุทใ่ี ชใ้ นการพมิ พ์ เช่น กระดาษ เปน็ ตน้ โดยพล็อตเตอร์ นน้ั จะเป็นเครื่องพิมพ์ท่ีมีราคาแพงที่สุดในกลุ่มของ เครือ่ งพมิ พ์ ทีใ่ ชใ้ นงานเขยี นแบบของวิศวกร สถาปนิก รวมถึงงานออกแบบแผนท่ีขนาดใหญ่ (รูปท่ี 18) รปู ท่ี 18 เครือ่ งพมิ พ์ทใ่ี ช้ในงานทั่วไป (ซา้ ย) และ พล็อตเตอร์ (ขวา) 2.3.4 กระดานกราฟิก (Graphic Tablet) คืออุปกรณ์ท่ีใช้นาเข้าข้อมูลสู่คอมพิวเตอร์โดยการเขียน หรอื วาดภาพ ลักษณะของอุปกรณไ์ ด้ออกแบบมาให้เหมือนกับกระดานวาดภาพจะมีปากกาไว้ให้ใช้งานและภาพท่ี วาดข้ึนบนกระดานกราฟิกจะปรากฏบนหน้าจอคอมพิวเตอร์ ซึ่งสะดวกสาหรับผู้ใช้งานที่ไม่สะดวกใช้เมาส์ในการ วาดรูปทรี่ ายละเอยี ดมากๆ (รปู ท่ี 19)

13 รูปท่ี 19 กระดานกราฟกิ ท่มี า http://changosalejandro.wordpress.com/topics/

14 บทท่ี 3 หลักการทางานและการแสดงผลของภาพคอมพวิ เตอร์กราฟิก 3.1 หลักการทางาน ภาพกราฟิกท่ีเกิดบนจอคอมพิวเตอร์ จะเกิดจากการทางานของโหมดสี อาร์จีบี (RGB) ซ่ึงประกอบด้วย แม่สี 3 สี ได้แก่ สีแดง (Red) สีเขียว (Green) และ สีน้าเงิน (Blue) โดยอาศัยการยิงประจุไฟฟูาให้เกิดการ เปล่งแสงของแม่สีท้ัง 3 มาผสมกัน เกิดเป็นสีต่างๆ แสดงผลบนจุดสี่เหลี่ยมเล็กๆ ที่เรียงต่อกันไปบนหน้าจอ คอมพิวเตอร์ท่ีเรียกว่า จุดภาพ หรือ พิกเซล (Pixel) จนเกิดเป็นรูปภาพข้ึนมา ซึ่งภาพกราฟิกในคอมพิวเตอร์จะ แบ่งออกเปน็ 2 ประเภท ได้แก่ ภาพกราฟิกแบบราสเตอร์ (Raster) และภาพกราฟิกแบบเวคเตอร์ (Vector) ภาพกราฟิกแบบราสเตอร์ (Raster) เป็นภาพทเี่ กิดจากการเรียงตัวของจุดภาพ (Pixel) หลากหลายสี ใน การสร้างภาพกราฟิกชนิดน้ีจะต้องมีการกาหนดจานวนจุดภาพให้กับภาพที่ต้องการสร้าง ถ้ากาหนดจุดภาพ จานวนน้อยเมื่อทาการขยายภาพให้มีขนาดใหญ่จะทาให้มองเห็นรายละเอียดภาพที่หยาบ เกิดการแตกของภาพ มองเห็นจดุ ภาพทีม่ ีลักษณะสีเ่ หล่ียมชัดเจนมากขนึ้ แต่ถ้ากาหนดจานวนจุดภาพมากข้ึนก็จะทาให้ขนาดของภาพท่ี สร้างมีขนาดใหญ่มากข้ึน (รูปท่ี 20) ดังนั้นการกาหนดขนาดจุดภาพจึงควรกาหนดให้มีความเหมาะสมและความ ต้องการใช้กับงานในแต่ละประเภท ตัวอย่างของภาพกราฟิกแบบราสเตอร์ ได้แก่ ภาพที่ถ่ายได้จากกล้องดิจิตอล เปน็ ต้น รปู ที่ 20 การแสดงภาพแบบราสเตอร์ เมื่อทาการขยายภาพ ภาพกราฟิกแบบเวคเตอร์ (Vector) เป็นภาพที่ประกอบไปด้วยเส้นตรง เส้นโค้ง ท่ีเกิดจากการอ้างอิง ความสัมพันธ์ทางคณิตศาสตร์ ซึ่งภาพที่สร้างขึ้นมาจะมีความเป็นอิสระต่อกัน เม่ือมีการขยายภาพความละเอียด ของภาพจะไม่ลดลง และยังคงความคมชัดไว้เหมือนเดิมไม่เปล่ียนแปลง และมีขนาดภาพท่ีเล็กกว่าภาพกราฟิก แบบราสเตอร์ (รปู ที่ 21) ภาพลกั ษณะน้ี เหมาะกับการสรา้ งภาพกราฟิกที่เป็นสีพ้ืนๆ ไม่มีการไล่โทนสี และนิยมใช้ เพ่ืองานสถาปัตย์ตกแต่งภายใน และการออกแบบต่างๆ เช่น การสร้างภาพการ์ตูน การออกแบบโลโก้ หรือการ ออกแบบอาคาร เปน็ ตน้

15 รูปท่ี 21 การแสดงภาพแบบเวคเตอร์ เม่ือทาการขยายภาพ ท่มี า http://www.sadung.com/?p=718 3.2 การแสดงผลของภาพกราฟิก 3.2.1 การสรา้ งภาพกราฟิกแบบเวคเตอร์ การสรา้ งภาพกราฟิกแบบเวคเตอร์บนจอคอมพิวเตอร์ จะทาได้โดยการสร้างคาสั่งเพื่อลากเส้นเช่ือมต่อ ระหว่างจุดต่างๆ ตามรูปภาพท่ีต้องการสร้าง ซึ่งข้อมูลท่ีเก็บอยู่ในไฟล์ภาพเวคเตอร์จะมีลักษณะเป็นชุดคาส่ังโดย อาศัยหลักการทางคณิตศาสตร์ โดยแต่ละตาแหน่งของจุดจะประกอบไปด้วยพิกัด X และ Y พร้อมข้อมูลทิศทาง ขนาด และสที ตี่ อ้ งการ ตัวอย่างเช่น การสร้างรูปส่ีเหลี่ยม ก็จะมีองค์ประกอบท่ีเป็นเส้นลากผ่านตาแหน่งจุดต่างๆ ทาให้เกิดรูปโครงร่างขึน้ มาและผู้สร้างสามารถท่จี ะกาหนดสีไว้ในพ้ืนที่โครงร่างนัน้ ได้ (รูปที่ 22) (X3, Y3) (X2, Y2) (X3, Y3) (X, Y) (X2, Y2) (X1, Y1) (X4, Y4) (X1, Y1) รปู ท่ี 22 ตวั อยา่ งการสร้างภาพกราฟิกแบบเวคเตอร์ 3.2.2 การสรา้ งภาพกราฟกิ แบบราสเตอร์ การสร้างภาพกราฟิกแบบราสเตอร์ หรือที่เรียกว่าการสร้างภาพบิตแมพ (Bitmap) บนหน้าจอ คอมพวิ เตอรน์ นั้ จะทาการสรา้ งและแสดงผลภาพในรูปแบบของตารางเมตริกซ์ ซ่ึงประกอบด้วยจุดภาพเล็กๆ หรือ พิกเซล (pixel) ทม่ี ีคา่ สตี ่างๆ เรยี งต่อกันไปประกอบกันเป็นรูปภาพข้ึนมา ดังเช่น ภาพตัว U ในท่ีนี้ส่วนท่ีเป็นสีดา จะมีค่าเป็น 1 และส่วนท่ีเป็นสีขาวมีค่าเป็น 0 ดังรูปท่ี 23 ภาพกราฟิกลักษณะนี้มักนิยมใช้ในการแสดงภาพถ่าย

16 หรือภาพวาด เนื่องจากสามารถไล่โทนสีได้เสมือนจริง และความละเอียดของภาพน้ันจะขึ้นอยู่กับขนาดจุดภาพที่ ทาการกาหนดไว้โดยผ้ใู ช้งาน 00000 01010 01010 01010 01010 01010 01110 00000 รูปที่ 23 ตวั อย่างการสรา้ งภาพกราฟกิ แบบราสเตอร์ การเปรียบเทียบความแตกต่างระหว่างภาพกราฟิกแบบราสเตอร์และแบบเวคเตอร์ แสดงใหเ้ หน็ ดังรูปท่ี 24 และตารางท่ี 1 รปู ท่ี 24 ภาพกราฟิกแบบราสเตอร์ (ซ้าย) และภาพกราฟิกแบบเวคเตอร์ (ขวา) ที่มา http://commons.wikimedia.org/wiki/File:Orc_-_Raster_vs_Vector_comparison.png ภาพกราฟิกแบบราสเตอร์ ภาพกราฟกิ แบบเวคเตอร์ 1. ภาพกราฟิกเกดิ จากจุดสเี่ หลยี่ มเลก็ ๆ หลากหลายสี 1. ภาพเกดิ จากการอา้ งองิ ความสมั พนั ธท์ าง (Pixels) มาเรยี งต่อกนั จนกลายเปน็ รปู ภาพ คณติ ศาสตร์หรือการคานวณ โดยองคป์ ระกอบของ ภาพมอี ิสระตอ่ กนั 2. การขยายภาพกราฟิกใหม้ ีขนาดใหญ่ข้ึนจะทาให้ความละเอยี ด 2. การขยายภาพกราฟกิ ให้มีขนาดใหญข่ ้นึ ภาพยังคง ของภาพลดลงทาให้มองเหน็ ภาพเป็นจสุ ีเ่ หลยี่ มเล็ก ความละเอียดคมชดั เหมอื นเดมิ

17 3. การตกแต่งและแกไ้ ขภาพ สามารถทาได้งา่ ยและสวยงาม เชน่ 3. เหมาะกับงานออกแบบต่างๆ เช่น งานสถาปัตย์ การ Retouching ภาพคนแก่ใหห้ นมุ่ ขน้ึ เปน็ ตน้ ออกแบบโลโก้ เป็นตน้ 4. การประมวลผลภพสามารถทาได้รวดเรว็ 4. การประมวลผลภาพจะใชเ้ วลานานเน่ืองจากใช้ คาสงั่ ในการทางาน ตารางที่ 1 การเปรียบเทียบความแตกต่างของภาพกราฟิกแบบราสเตอรแ์ ละแบบเวคเตอร์ ท่มี า http://www.itforsme.net/knc_detail.php?id=592 โดยปกติแล้วระบบการแสดงผลของภาพกราฟิกบนจอคอมพิวเตอร์ มีระบบการแสดงผลอยู่ 2 โหมด ไดแ้ ก่ เท็กซ์โหมด (Text Mode) และ กราฟิกโหมด (Graphic Mode) เทก็ ซโ์ หมด (Text Mode) เป็นระบบการแสดงผลพื้นฐานของจอภาพ ที่แสดงผลในรูปแบบของตัวอักษรหรือข้อความเท่านั้น ไม่ สามารถแสดงผลเป็นรูปภาพต่างๆ ได้ โดยการทางานในโหมดนี้โดยท่ัวไปจะทาการแบ่งจอภาพเป็นแนวนอนเป็น แถวตัวอักษรเท่าๆ กัน 25 แถว โดยแต่ละแถวสามารถแสดงตัวอักษรได้ 80 ตัว ซ่ึงการส่งข้อมูลเพ่ือแสดงผลน้ัน โปรแกรมประยุกต์ (Application Program) ที่ใช้งานในคอมพิวเตอร์จะส่งข้อมูลมายังการ์ดแสดงผลในรูปแบบ ตัวอักษร ซึ่งการ์ดแสดงผลจะมีวงจรท่ีเรียกว่า character generator ทาหน้าท่ี “สร้าง” ภาพของตัวอักษรนั้นๆ ใหป้ รากฏข้นึ บนจอภาพ กราฟิกโหมด (Graphic Mode) เป็นระบบที่ใช้ในการแสดงผลรูปภาพในลักษณะจุดภาพ หรือ พิกเซล (pixel) ในจานวนมาก โดยการ สร้างวงจรอิเล็กทรอนิกส์ขึ้นมา เพื่อใช้สาหรับควบคุมการแสดงผลที่จอภาพคอมพิวเตอร์ ซ่ึงนิยมเรียกระบบน้ีกัน ว่า ระบบกราฟิก ระบบกราฟิกมีหลายประเภท เช่น ซีจีเอ (CGA) อีจีเอ (EGA) วีจีเอ (VGA) เฮอร์คิวลีส (Hercules) ซ่ึงแต่ละประเภทจะมีคุณสมบัติในการแสดงจุดภาพที่แตกต่างกันคือตั้งแต่ขนาด 320 x 200 จุดภาพ ถึง 1024 x 786 จุดภาพ และยังสามารถแสดงค่าสีได้ต้ังแต่ 2 สีจนถึง 256 สี สาหรับจอภาพท่ีแสดงได้ 2 สี จะ ประกอบด้วยสีพื้นซ่ึงเป็นสีมืดและสีสว่าง ซึ่งเป็นสีเขียว สีขาว หรือสีเหลืองอาพัน ดังนั้นสีท่ีสามารถมองเห็นจาก จอภาพชนิดน้ีจึงมีเพียงสีเดียวเท่านั้น จึงนิยมเรียกช่ือจอภาพและระบบกราฟิกชนิดน้ีว่า จอภาพโมโนโครม (Monochrome) ส่วนจอภาพที่สามารถแสดงได้หลายสี เราเรียกว่า จอภาพสี (Color) ไม่ว่าคอมพิวเตอร์จะมี ระบบกราฟิกเป็นชนิดใดก็ตาม ถ้าเปิดเครื่องด้วย DOS คอมพิวเตอร์จะเร่ิมแสดงผลด้วยเท็กซ์โหมดเสมอ การ เปล่ยี นโหมดให้เปน็ กราฟิกจะทาได้ก็โดยการใชค้ าสั่งเฉพาะสาหรับระบบกราฟิกชนิดน้ัน

18 รปู ที่ 25 จอภาพโมโนโครม (ซา้ ย) และจอภาพสี (ขวา) ที่มา http://en.wikipedia.org/wiki/Monochrome_monitor http://komtik4.blogspot.com/2011/07/monitor.html

19 บทท่ี 4 คณุ ลกั ษณะของกราฟกิ และไฟลภ์ าพกราฟิก 4.1 ประเภทและคณุ ลักษณะของงานกราฟิก ประเภทของงานกราฟิก สามารถแบ่งได้กว้างๆ ด้วยการจาแนกตามจานวนมิติของงาน ความหมาย โดยท่ัวไปของมิติ (Dimension) หมายถึง สิ่งท่ีบอกคุณสมบัติของวัตถุ อันได้แก่ ความกว้าง ความยาว และ ความลกึ ในงานกราฟิกเราสามารถแบ่งเป็น 2 ประเภท คือประเภท 2 มิติ และ 3 มิติ โดยงานกราฟิกแบบ 2 มิติ สามารถมองเห็นตามแนวแกน X(ความกว้าง) กับ แกน Y(ความยาว) ซ่ึงต่างจากงานกราฟิก 3 มิติ เพราะ แบบ 3 มติ ิ นัน้ จะมแี กน Z (ความหนาหรอื ความลกึ ) เพิม่ เข้ามา ทาใหเ้ ราเห็นเป็นรูปรา่ งท่ชี ดั เจนยง่ิ ข้ึน 4.1.1 กราฟิกแบบ 2 มิติ กราฟิก 2 มิติ คือ ศิลปะแขนงหนึ่งซึ่งใช้สื่อความหมายด้วยเส้น สัญลักษณ์ รูปวาด ภาพถ่าย ภาพ ลายเส้น กราฟ แผนภูมิ รวมถึงการ์ตูนต่างๆ ในโทรทัศน์ ซ่ึงสามารถส่ือความหมายข้อมูลได้ตามท่ีผู้สื่อสาร ต้องการ โดยมีลักษณะเป็น 2 มิติ คือ มีเฉพาะแนวแกน X(ความกว้าง) กับ แกนY(ความยาว) คอมพิวเตอร์ กราฟกิ 2 มติ ิ สามารถประยุกต์ใช้ในงานด้านต่าง ๆ มากมาย ดงั น้ี ภาพศิลป์ การวาดภาพในปัจจุบันน้ี เราสามารถวาดได้โดยไม่ต้องใช้พู่กันกับจานสี แต่จะใช้คอมพิวเตอร์กราฟิก แทน ภาพท่ีวาดในระบบคอมพิวเตอร์กราฟิก 2 มิติ นี้เราสามารถกาหนดสี แสงเงา รูปแบบลายเส้นท่ีต้องการได้ โดยง่าย นอกจากน้ียังสามารถนางานจากการใช้คอมพิวเตอร์กราฟิก 2 มิติ ไป ประยุกต์ใช้กับงานศิลป์เพ่ือ การตลาดและการประชาสัมพันธ์ได้อีกหลายด้านไม่ว่าจะเป็น ภาพโฆษณา ฉลากบรรจุภัณฑ์ โลโก้สินค้า เป็นต้น ขอ้ ดีของการใชค้ อมพวิ เตอร์วาดภาพกค็ ือ สามารถแกไ้ ข เพิม่ เติมส่วนที่ต้องการ และลบได้งา่ ย รปู ท่ี 26 ภาพศิลป์โดยคอมพิวเตอร์กราฟิก ออกแบบโดย Steven Wilson ทมี่ า: http://illustration-design.blogspot.com/2008/03/steven-wilson-graphic-design.html

20 ภาพเคล่ือนไหว 2 มติ ิ ภาพยนตร์การ์ตูนและภาพยนตร์ที่ใช้เทคนิคพิเศษต่างๆ ในปัจจุบันมีการนาคอมพิวเตอร์กราฟิกเข้ามา ช่วยในการออกแบบและสร้างภาพเคลื่อนไหว 2 มิติ (2D Animation) มากข้ึน ดังรูปท่ี 27 เน่ืองจากเป็นวิธีที่ สะดวก รวดเร็ว และง่ายกว่าวิธีอื่นๆ การใช้คอมพิวเตอร์กราฟิกช่วยให้ภาพที่อยู่ในจินตนาการของมนุษย์สามารถ สื่อออกมาเพ่ือทาให้ปรากฏเป็นจริงได้ ภาพเคล่ือนไหวมีประโยชน์มากท้ังในการสร้างส่ือการเรียนการสอน การ สร้างเกมส์คอมพิวเตอร์ ซึ่งสามารถใช้หลักการทาภาพเคล่ือนไหวในคอมพิวเตอร์กราฟิก 2 มิติมาประยุกต์ได้ ท้ังสิ้น รปู ท่ี 27 ภาพเคล่ือนไหว 2 มติ ิ โดยใชค้ อมพิวเตอร์ ในการต์ ูนเรื่อง Happy tree friends ทมี่ า http://www. http://www.fanpop.com การออกแบบ คอมพิวเตอร์กราฟิกได้ถูกนามาใช้ในการออกแบบมาเป็นเวลานาน โดยมีโปรแกรมสาหรับช่วยในการ ออกแบบทั้งทางวิศวกรรมและสถาปัตยกรรม โปรแกรมเหล่านี้จะช่วยให้ผู้ออกแบบงานต่างๆ ได้สะดวกข้ึน ตัวอย่างเช่น ผอู้ อกแบบบ้านสามารถเขยี นเปน็ แบบลายเส้นแล้วลงสี แสงเงา เพื่อให้บ้านดูคล้ายกับของจริงได้ (รูป ที่ 28) นอกจากนี้แล้วเมื่อผู้ออกแบบกาหนดขนาดของวัตถุแล้ว ผู้ออกแบบยังสามารถย่อหรือขยายภาพน้ัน หรือ ต้องการหมุนภาพไปในมุมต่าง ๆ ได้ด้วย ซ่ึงการแก้ไขแบบบ้านก็ทาได้ง่ายและสะดวกกว่าการออกแบบบน กระดาษ นอกจากนท้ี างดา้ นวิศวกรรมไฟฟาู และอิเล็กทรอนิกส์ คอมพิวเตอร์กราฟิกยังถูกนามาใช้ในการออกแบบ วงจรตา่ งๆ สามารถวาดวงจรบนจอภาพโดยใช้สัญลกั ษณต์ ่างๆ ท่ีระบบจดั เตรียมไว้ให้แล้วมาประกอบกันเป็นวงจร ทต่ี อ้ งการ โดยทผี่ อู้ อกแบบสามารถแก้ไข ตัดตอ่ เพมิ่ เติมวงจรได้โดยสะดวก

21 รปู ท่ี 28 คอมพิวเตอรก์ ราฟกิ 2 มติ ิ กับการออกแบบบ้าน ทม่ี า: http://www.windows7download.com/win7-planeasy2d/screenshot-outvqydv.html กราฟและแผนภาพ คอมพิวเตอร์กราฟิก 2 มิติ ถูกนามาใช้ในการแสดงภาพกราฟและแผนภาพของข้อมูลได้เป็นอย่างดี โปรแกรมทางกราฟิกท่ัวไปสามารถสร้างกราฟได้หลายแบบ เช่น กราฟเส้น กราฟแท่ง และกราฟวงกลม ทาให้ สามารถถา่ ยทอดข้อมลู ออกมาเขา้ ใจงา่ ยและนา่ สนใจ กราฟและแผนภาพทางธุรกิจ เช่น กราฟหรือแผนภาพแสดง การเงิน สถติ ิ และขอ้ มลู ทางเศรษฐกิจ จะเป็นประโยชน์ต่อผู้บริหารหรือผู้จัดการกิจการมาก เนื่องจากสามารถทา ความเข้าใจกับข้อมูลได้ง่ายและรวดเร็วกว่าเดิม ในงานวิจัยต่างๆ เช่น การศึกษาทางฟิสิกส์ กราฟและแผนภาพมี ส่วนช่วยให้นักวิจัยทาความเข้าใจกับข้อมูลได้ง่ายข้ึนเมื่อข้อมูลที่ต้องวิเคราะห์มีจานวนมาก ระบบข้อมูลทาง ภูมิศาสตร์ หรือ GIS (Geographical Information System) ก็เป็นรูปแบบหนึ่งของการแสดงข้อมูลในทานอง เดียวกับกราฟและแผนภาพ ข้อมูลทางภูมิศาสตร์จะถูกเก็บลงในระบบคอมพิวเตอร์ แล้วให้ระบบคอมพิวเตอร์ กราฟกิ จดั การแสดงข้อมูลเหลา่ น้ันในรปู ของแผนที่หรือเส้นทางคมนาคมขนส่ง(รูปท่ี 29) รปู ท่ี 29 คอมพิวเตอรก์ ราฟิก 2 มิติ กบั กราฟและแผนภาพ ทม่ี า: http://www.nidcr.nih.gov/aboutus/visitingnidcr/maps/mapmetro.html 4.1.2 กราฟิกแบบ 3 มติ ิ เป็นงานกราฟิกท่ีใช้โปรแกรมสร้างภาพ 3 มิติโดยเฉพาะ เช่น โปรแกรม 3Ds Max และ โปรแกรม Maya เป็นตน้ โดยคอมพิวเตอร์กราฟกิ 3 มติ ิ แตกต่างจาก 2 มติ ิตรงที่ภาพจากคอมพิวเตอร์กราฟิก 3 มิติจะมี

22 ค่าความลึกท่ีสามารถนามาเปล่ียนแปลง และใช้ซ้า เช่น การเปล่ียนมุมมอง การหาระยะใกล้ไกลจากในภาพ เป็นต้น ในแง่คณิตศาสตร์การคานวณภาพแบบ 3 มิติจะคล้ายคลึงกับภาพ 2 มิติแบบเวคเตอร์ โดยจะใช้ แบบจาลองทางคณิตศาสตร์ชนิดเดียวกันเพียงแต่เพิ่มตัวแปรเพื่อนิยามความลึกหรือแกน Z ลงไป นอกเหนือจากแกน X และ Y ตามปกติ (รูปที่ 30) รปู ที่ 30 แกน X, Y และ Z บทบาทของงานกราฟกิ 3 มิติ ขยายวงกวา้ งมากขนึ้ ในปัจจบุ ัน การออกแบบ 3 มติ ิ เป็นการประยุกต์ ศลิ ปะเชิง 3 มิติ ไปใชง้ านในดา้ นตา่ งๆ ท้งั ในดา้ นสื่อภาพยนตร์เคล่ือนไหวหรือแอนิเมชัน 3 มิติ (รูปท่ี 31) เกม คอมพิวเตอร์ งานสถาปัตยกรรม งานตกแต่งภายใน(รูปท่ี 32) การแพทย์ ตลอดจนการจาลองอ่ืน ๆ ไม่ว่าจะ เป็นทางวทิ ยาศาสตร์ จาลองการขบั รถ การขับเคร่ืองบิน เป็นต้น ทั้งนี้งานกราฟิก 3 มิติ จะมีบทบาทสาคัญมาก ในการนาเสนองานเพ่ือความสวยงาม สร้างความน่าสนใจ สร้างความสมจริง จนอาจทาให้ผู้ดูเสมือนเข้าไปอยู่ ในเหตุการณจ์ ริง รูปที่ 31 งานแอนเิ มชัน 3 มติ ิ ในการต์ ูนเร่ือง Up ทมี่ า http://www.maacghaziabad.in

23 รปู ท่ี 32 การออกแบบภายในบ้านดว้ ยโปรแกรม 3 มิติ ท่ีมา http://www.homedec.in.th ก่อนท่ีจะเร่ิมทางานกราฟกิ 3 มิติ ควรจะเข้าใจพื้นฐานของงานชนดิ นี้ก่อน โดยท่ัวไป พ้ืนฐานของรูป 3 มิติ เป็นรูปแบบโครงสร้าง 3 มิติลายเส้น (Mesh Object) ซ่ึงเกิดจากการประกอบกันของแผ่นสี่เหลี่ยมเล็ก ๆ และแผ่นสามเหลยี่ มเล็ก ๆ มา ประกอบกันจนเป็นวัตถุที่ซับซ้อนมากขึ้น(รูปที่ 33) โดยรูปที่แสดงออกมาจะ มคี วามละเอียดมากนอ้ ย ข้ึนอยู่กบั ขนาดของแผน่ ส่ีเหลีย่ มและแผ่นสามเหลี่ยม ถ้าต้องการให้รูปแสดงออกมามี ความโค้งมน ความละเอียดมาก ๆ แผ่นส่ีเหลี่ยมและแผ่นสามเหล่ียมที่ประกอบขึ้นจะต้องมีขนาดเล็กลง แต่มี ขอ้ เสียคือ การคานวณพนื้ ผดิ จะมีจานวนมากขึน้ ดังนั้น เคร่ืองคอมพวิ เตอรจ์ ะเสยี เวลาในการประมวลผลมาก รูปท่ี 33 รูปแบบโครงสรา้ ง 3 มิติลายเสน้ (Mesh Object) ที่มา http://www.turbosquid.com/3d-models/3d-model-police-car/498842 องค์ประกอบของวัตถุ 3 มติ ิ มดี ังต่อไปน้ี 1) โครงสร้างของวตั ถุท่ปี ระกอบขนึ้ จาก Vertex, Edge, Faces (รปู ที่ 34) 2) จดุ อา้ งอิงวัตถุ (Pivot Point) 3) ชื่อของวัตถุ 4) สี 5) คุณสมบัติพืน้ ผิวของวตั ถุ (Material)

24 รูปท่ี 34 รูปแสดง Vertex, Edge, Faces การสร้างโมเดล 3 มิติ จะเป็นการนาวัตถุรูปทรงพื้นฐาน เช่น กล่องส่ีเหลี่ยม (Box), วัตถุทรงกลม (Sphere) เป็นต้น ซึ่งโปรแกรมสร้างงาน 3 มิติ จะทางานกับแกน 3 แกน คือมีแกน x, y และ z ดังนั้น ผู้ท่ี เร่ิมตน้ ใช้งานโปรแกรมลกั ษณะน้เี ปน็ ครัง้ แรก จะต้องทาความคุ้นเคยกับหน้าจอของโปรแกรม และดูให้ออกว่า ขณะนี้ กาลังทางานกบั แกนใด หลงั จากนั้น กท็ าการปรบั แต่ง เปล่ยี นแปลงรูปทรงของวัตถุจนกระท่ังกลายเป็น รูปทรงที่ต้องการ โดยจุดสาคัญท่ีสุดของการขึ้นโมเดลคือ การเลือกใช้รูปทรงพื้นฐานท่ีมีโครงร่างคล้ายกับ รปู ทรงใหม่ทจ่ี ะสร้าง เพื่อช่วยให้ข้ึนโมเดลได้ง่าย ทงั้ นี้ งาน 3 มิติมักผสมผสานงานแบบ 2 มิติท้ังแบบเวคเตอร์ และภาพราสเตอร์เข้าด้วยกัน เช่น การขึ้นโครงสร้างในแบบ 3 มิติ แล้วใช้การกาหนดลวดลายหรือปรับ รายละเอียดพื้นผิวด้วยภาพ 2 มิติ เพ่ือให้เกิดความสมจริง ในงานคอมพิวเตอร์กราฟิก 3 มิติ จึงมีการพัฒนา ระบบจาลองต่าง ๆ เช่นระบบคานวณการเคล่ือนที่ของวัตถุตามหลักฟิสิกส์ เช่น การเคลื่อนที่ภายใต้แรงโน้ม ถ่วง แรงลม แรงเสียดทาน ฯลฯ และยังเปิดโอกาสให้ผู้ใช้สามารถปรับแต่งให้แตกต่างจากความเป็นจริงหรือ เหนือธรรมชาติได้อย่างอิสระ ตลอดจนระบบอ่ืน ๆ เช่นระบบสีท่ีใช้การคานวณการสะท้อนแสง ซึ่งก็สามารถ ปรบั แต่งใหต้ รงกบั ความต้องการของผูใ้ ชไ้ ด้อกี ดว้ ย 4.2 ชนดิ ของไฟลภ์ าพกราฟกิ สาหรับผู้ท่ีเริ่มต้นทากราฟิกอาจยังไม่คุ้นเคยกับนามสกุลต่าง ๆ ของไฟล์ภาพ และอาจจะสงสัยว่า ทาไมนามสกุลไฟล์ถึงไม่เหมือนกัน และแต่ละนามสกุลไฟล์แตกต่างกันอย่างไร เหมาะสาหรับการใช้งานแบบ ไหน จึงเป็นท่ีมาของการศึกษาไฟล์ภาพชนิดต่างๆ เพื่อจะทาให้สามารถเลือกนาไปใช้งานได้อย่างถูกต้อง เหมาะสมต่อไป โดยสามารถจาแนกชนิดของไฟล์ภาพกราฟิกตามหมวดหมู่ประเภทไฟล์กราฟิกคือ กราฟิก ไฟล์ประเภทบิตแมป (Bitmap) หรือราสเตอร์ (Raster) และ กราฟิกไฟลป์ ระเภทเวคเตอร์ (Vector) ดังน้ี 4.2.1 ชนิดของกราฟิกไฟล์ประเภทบิตแมป (Bitmap) หรือราสเตอร์ (Raster) กราฟิกแบบบติ แมป(Bitmap) หรอื แบบราสเตอร์ (Raster) นั้นเป็นภาพกราฟิกทเ่ี กิดจากการเรียงตัว กันของจุดส่ีเหล่ียมเล็กๆ หลากหลายสี ซ่ึงเรียกจุดส่ีเหลี่ยมนี้ว่าพิกเซล พิกเซลเป็นองค์ประกอบพ้ืนฐานของ ภาพบิตแมป เพราะเป็นหน่วยยอ่ ยทเ่ี ล็กที่สุด แล้วรวมกันทาให้เกิดภาพ โดยพิกเซลมีความสาคัญต่อการสร้าง กราฟิกมาก เพราะทุกๆ ส่วนของงานภาพกราฟิกเกิดจากหน่วยพิกเซลเล็กๆ มารวมกันจนเป็นภาพใหญ่ สามารถสังเกตได้โดยการขยายขนาดภาพ กล่าวคือ ภาพเหล่าน้ียิ่งซูม(ขยาย)ภาพจะยิ่งแตก แต่ข้อดีของ ภาพกราฟิกแบบบิตแมป(Bitmap)หรือราสเตอร์(Raster) คือ สามารถแก้ไขปรับแต่งสีตกแต่งภาพได้ง่ายและ ละเอียด โปรแกรมที่นักออกแบบนิยมใช้ คือ Adobe Photoshop โดยส่ิงที่ควรคานึงในการสร้างภาพกราฟิก นนั้ ผู้ออกแบบจะตอ้ งกาหนดจานวนของพกิ เซลใหก้ ับภาพท่ตี ้องการสรา้ ง ถ้ากาหนดจานวนพิกเซลน้อยเกินไป เมื่อขยายภาพให้มีขนาดใหญ่ข้ึนจะทาให้มองเห็นภาพเป็นจุดส่ีเหล่ียมเล็ก ๆ ไม่คมชัด แต่ถ้ากาหนดจานวน

25 พิกเซลมากไปก็จะทาให้แฟูมภาพ(ไฟล์)มีขนาดใหญ่ ซ่ึงอาจทาให้เกิดปัญหาในการทางาน ดังน้ันการกาหนด จานวนพิกเซลควรกาหนดให้เหมาะสมกับงานท่ีสร้างด้วย ไฟล์ภาพกราฟิกประเภทน้ีมีหลายชนิด ขึ้นอยู่กับ ลกั ษณะการใชง้ าน โดยชนิดของกราฟิกประเภทบติ แมปท่นี ิยมใช้และควรรู้จกั มี 6 ชนิดดงั ตอ่ ไปนี้ JPEG มาจากคาว่า Joint Photographic Experts Group นามสกุลของไฟล์รูปแบบน้ีคือ .jpg หรือ .jpeg เป็นไฟล์ที่ถูกสร้างข้ึนมาเพ่ือบีบอัดข้อมูลภาพเพ่ือให้มีขนาดกะทัดรัด นิยมนาใช้งานในระบบอินเทอร์เน็ต เพราะ ไฟล์มีขนาดเล็ก สามารถดาวน์โหลดได้รวดเร็ว โดยให้รายละเอียดของภาพสูง เพราะ JPEG สามารถเก็บภาพสีได้ สูงถึง 16.7 ล้านสี ภาพจึงมีความคมชัดสูงและมีสีสันมาก เนื่องจากเป็นไฟล์ท่ีได้รับความนิยมมาก จึงสามารถ เรียกดูไฟล์ภาพสกุลน้ีได้ในโปรแกรมแสดงภาพกราฟิกทุกตัว แต่ข้อด้อยของไฟล์ภาพชนิดนี้คือ ไม่สามารถทา ให้พื้นทขี่ องภาพเป็นแบบโปร่งใสได้ (Transparent/Opacity) TIFF มาจากคาว่า Tagged Image File Format ของไฟล์รูปแบบน้ีคือ .tif เป็นไฟล์กราฟิกท่ีสร้างมาเพื่อ โปรแกรมประเภทจัดหน้าหนังสือ มีรูปแบบที่ใช้เก็บภาพพร้อมรายละเอียดต่างๆ เช่น เลเยอร์ (Layer) และ โหมดภาพต่างๆ ตลอดจนข้อมูลประกอบอ่ืนๆ ตามต้นฉบับเดิมของภาพ เหมาะสมต่อการเก็บบันทึกภาพ ต้นฉบับ และภาพสาหรับใช้ประกอบการสร้างส่ือส่ิงพิมพ์ ข้อดีของไฟล์TIFF คือ สามารถใช้ได้กับโปรแกรม กราฟิกทุกประเภท และสามารถใช้ได้ในระบบคอมพิวเตอร์หลายๆ ระบบ เช่น ระบบ PC และ Macintosh เป็น ต้น อย่างไรกต็ าม ไฟลภ์ าพชนดิ น้ีจะมีขนาดใหญ่ เพราะตอ้ งเก็บรายละเอยี ดความคมชัดไว้สูง GIF มาจากคาว่า Graphics Interchange Format นามสกุลไฟล์คือ .gif เป็นไฟล์กราฟิกมาตรฐานสาหรับ ระบบอินเทอร์เน็ต เพราะไฟล์ท่ีมีขนาดเล็ก แต่จานวนสีและความละเอียดของภาพไม่สูงมากนักคือ แสดงผลสีได้ เพียง 256 สี แต่จุดเด่นของไฟล์ชนิดน้ีคือสามารถมีพื้นแบบโปร่งใส (Transparent/Opacity) นอกจากนี้ยัง สามารถนาเสนอภาพแบบภาพเคลื่อนไหว (GIF Animation) โดยนาเอาไฟล์ภาพหลายๆ ไฟล์มารวมกันและ นาเสนอภาพเหลา่ นนั้ โดยอาศัยหลักการหน่วงเวลา จนทาใหเ้ กิดลักษณะภาพเคลื่อนไหว PNG มาจากคาว่า Portable Network Graphics นามสุกลของไฟล์รูปแบบน้ีคือ .png เป็นกราฟิกไฟล์ รูปแบบล่าสุดในการนาเสนอภาพบนระบบอินเทอร์เน็ต มีความคมชัดสูง เป็นการรวมเอาคุณสมบัติท่ีโดดเด่น ของ JPEG กับ GIF มาใช้ คือสามารถเลือกระดับสีได้ถึง 16.7 ล้านสี และโปร่งใสได้(Transparent/Opacity) อย่างไรก็ตามไฟลภ์ าพPNG ไมส่ นบั สนุนภาพเคลื่อนไหว เพราะไม่สามารถเกบ็ ภาพหลายๆภาพไว้ด้วยกันได้ PDF มาจากคาวา่ Portable Document Format นามสุกลของไฟล์รูปแบบน้ีคือ .pdf ไฟล์ PDF เป็นไฟล์ เอกสารของ Adobe Acrobat ใช้ในการแสดงเอกสารในรูปแบบของกราฟิก ซ่ึงจะต้องใช้ โปรแกรม Adobe Acrobat Reader ในการอ่าน โดยผู้ใช้สามารถบันทึกไฟล์กราฟิกหรือเอกสารทุกประเภทให้เป็นไฟล์ PDF ได้

26 ซึ่งจะคงลกั ษณะเดิมของเอกสารไว้ ไม่ว่าจะเปิดที่ใด ปัจจุบันในวงการสิ่งพิมพ์เริ่มหันมาสนใจรูปแบบไฟล์ PDF กนั มากขึ้น เพราะสามารถแกไ้ ขตัวอักษรไดโ้ ดยการใช้โปรแกรม Adobe Acrobat Professional แต่ข้อเสียคือ ต้องอ่านไฟล์ชนดิ นีด้ ้วย โปรแกรม Adobe Acrobat Reader เทา่ นั้น PSD เป็นไฟล์กราฟิกของโปรแกรมตกแต่งรูปภาพของ Adobe Photoshop นามสุกลของไฟล์รูปแบบน้ีคือ .psd ไฟล์ PSD นี้จะใช้กับโปรแกรม Adobe Photoshop เพื่อการแก้ไขรูปภาพ มีการแบ่งเลเยอร์ (Layer) เพ่ือ ง่ายแก่การแก้ไขในภายหลัง และสามารถบันทึกกราฟิกแบบเวคเตอร์ (Vector) ลงในไฟล์ได้ แต่มีขนาดไฟล์ที่ใหญ่ เพราะตอ้ งเก็บรายละเอียดคุณสมบัติต่าง ๆ อันเป็นคุณสมบัติพิเศษของโปรแกรม เช่น เลเยอร์ (Layer), แชนแนล (Channel), โหมดสี(Color Mode) และ สไตล์(Style) เปน็ ตน้ 4.2.2 ชนิดของกราฟกิ ไฟล์ประเภทเวคเตอร์ (Vector) ภาพแบบเวคเตอร์(Vector) คือภาพท่ีเกิดจากเส้นโค้ง, เส้นตรง และคุณสมบัติสีของเส้นน้ันๆที่เกิด จากการคานวณทางคณิตศาสตร์ กล่าวคือ ภาพท่ีวาดแบบเวคเตอร์จะเกิดจากการกาหนดคุณสมบัติไว้ว่าภาพ เกิดจากเส้นตรง หรือเส้นโค้งท่ีเอียงกี่องศา เก็บค่ารหัสสีอะไรไว้ เพ่ือสร้างออบเจ็กต์(Object) ในการสร้าง ออบเจ็กต์ (Object) คือการรวมตัวกันของรูปทรงพื้นฐาน(Primitive Shapes) ไม่ว่าจะเป็น ส่ีเหลี่ยมจัตุรัส สี่เหล่ียมผืนผ้า วงกลม วงรี ห้าเหลี่ยม หกเหล่ียม เส้นตรง เส้นโค้ง เป็นต้น โดยจากรูปทรงพ้ืนฐานเหล่าน้ีจะ สามารถใช้ในการสร้างออบเจ็กต์ท่ีซับซ้อนข้ึน กราฟิกแบบเวคเตอร์สามารถสร้างรูปภาพโดยการรวมเอา ออบเจ็กต์หลายๆ ชนิดมาผสมกันเราสามารถผสมออบเจ็กต์ต่างชนิดกัน (เช่น วงกลมและเส้นตรง) เพื่อสร้าง ภาพที่แตกต่างกัน โดยเม่ือขยายภาพจะเป็นการคูณจานวนเท่าลงไปท่ีคุณสมบัติภาพทางคณิตศาสตร์ ดังนั้น ข้อดีของภาพกราฟิกแบบเวคเตอร์ (Vector) คือเม่ือทาการขยายภาพท่ีวาดภาพจะยังคงความละเอียดและ คมชัดเสมอ นอกจากน้ีแฟูมภาพ(ไฟล์)ยังมีขนาดเล็กกว่าแบบราสเตอร์(Raster)อีกด้วย ซึ่งภาพกราฟิกแบบ เวคเตอร์(Vector) มกั นิยมใช้เพ่ืองานสถาปตั ย์ตกแต่งภายใน และการออกแบบต่าง ๆ เช่นการออกแบบอาคาร การออกแบบรถยนต์ การสร้างโลโก้ การสร้างการ์ตูน และงานสื่อส่ิงพิมพ์ ชนิดของกราฟิกประเภทเวคเตอร์ สามารถจาแนกได้ดงั ต่อไปนี้ EPS มาจากคาว่า Encapsulated PostScript นามสกุลของไฟล์รูปแบบน้ีคือ.eps เป็นไฟล์ท่ีถูกสร้างขึ้นมา เพื่อใช้ในงานออกแบบส่ือส่ิงพิมพ์ (Desktop Publishing) เป็นไฟล์เวคเตอร์ (Vector) มาตรฐาน ใช้งานได้กับ โปรแกรมหลายโปรแกรม สามารถทาการแยกสีเพ่ืองานพิมพ์ได้ นอกจากนี้ยังใช้ในการบันทึกไฟล์เวคเตอร์ (Vector) จากโปรแกรมหนึ่งเพ่ือนาไปโหลดใช้งานในอีกโปรแกรมหนึ่งอีกด้วย ซึ่งไฟล์ชนิดนี้จะมีขนาดใหญ่กว่า ไฟล์เวคเตอร์ (Vector) ชนิดอืน่ ๆ SVG มาจากคาว่า Scalable Vector Graphics นามสกุลของไฟล์รูปแบบน้ีคือ.svg เป็นไฟล์ภาพรูปแบบ เวคเตอร์ ท่ีเก็บข้อมูลแบบ XML ภาพจะมีความละเอียดสูงและคมชัด สามารถแสดงท้ังในรูปแบบของการไล่ ระดับสี ภาพเคลื่อนไหว นอกจากน้ียังสามารถนาไฟล์มาแก้ไขใน Adobe Illustrator ได้ภายหลัง แต่มีข้อเสียคือ จะมีไฟลข์ นาดใหญ่

27 SWF มาจากคาว่า Shockwave Flash นามสกุลของไฟล์รูปแบบน้ีคือ.swf เป็นไฟล์เวคเตอร์(Vector) ของ โปรแกรม Adobe Flashท่ีออกแบบมาให้ไฟล์มีขนาดกะทัดรัดสาหรับนาเสนอบนเว็บไซต์ คุณภาพของไฟล์มี ความละเอยี ดทส่ี งู และเหมาะกบั การแสดงภาพเคล่อื นไหวหรือแอนิเมชนั และเกมสบ์ นระบบอินเทอรเ์ นต็ AI เป็นไฟล์กราฟิกของโปรแกรมวาดรูปของ Adobe Illustrator นามสุกลของไฟล์รูปแบบนี้คือ .ai เป็น ไฟล์พ้ืนฐานของโปรแกรม Adobe Illustrator เช่น เลเยอร์ สี เอฟเฟ็กต์ ฯลฯ เพื่อเราจะสามารถเปล่ียนแปลง แก้ไขภาพได้แต่มีข้อเสียคือ ใช้กับโปรแกรม Adobe Illustrator ได้อย่างเดียวเท่านั้น (ถ้าจะนาไปใช้ในโปรแกรม อ่นื ตอ้ งต้องบันทึกเป็นฟอร์แมตอนื่ ก่อน) FLA เป็นไฟล์กราฟิกของโปรแกรมของ Adobe Flash นามสุกลของไฟล์รูปแบบนี้คือ .fla จะใช้ไฟล์น้ีกับ โปรแกรม Adobe Flash เพ่ือแก้ไขงานภาพเวคเตอร์ท่ีสร้างด้วยโปรแกรมดังกล่าว ไม่ว่าจะเป็นแอนิเมชัน อินเตอรแ์ อกทีฟในเว็บเพจ และเกมส์ เป็นตน้ DWG มาจากคาว่า Drawing file นามสุกลของไฟล์รูปแบบน้ีคือ .dwg คือ drawing file ของโปรแกรม AutoCAD เปน็ ซอฟต์แวรช์ ว่ ยออกแบบดว้ ยคอมพวิ เตอร์ ของบริษัท Autodesk ที่สามารถรองรับการทางานทั้งใน 2 มติ ิ และ 3 มิติ ใชใ้ นการออกแบบบ้าน หรืออาคารตา่ งๆ

28 บทท่ี 5 หลักการใชส้ ีและแสงในคอมพิวเตอร์ สีและแสงมีความสาคัญอย่างมากต่องานกราฟิก สีและแสงทาให้ภาพหรือสิ่งต่าง ๆ มีความสดใส สวยงาม และน่าสนใจ อย่างไรก็ตาม ในการใช้สีและแสงเพ่ือส่ือความหมายในงานกราฟิก ควรจะศึกษาอย่าง ละเอียดถ่องแท้ เพ่ือให้มีความรู้ความเข้าใจในการนาสีและแสงไปใช้ประกอบในงานกราฟิก ส่งผลให้งานน้ัน สามารถตอบสนองได้ตรงตามจุดประสงค์มากท่ีสุด โดยทั่วไปแล้ว ประโยชน์หลักของสีคือทาให้เกิดความน่าสนใจ มากกวา่ ภาพขาว-ดา เพราะช่วยทาใหภ้ าพมลี กั ษณะเหมอื นจริง ทั้งยังทาให้เกิดความเข้าใจและสามารถจดจาภาพ ไดด้ ี สีทีเ่ รามองเห็นรอบๆ ตัวน้ัน เกิดข้ึนได้จากการท่ีตาของเรารับแสงที่สะท้อนมาจากวัตถุเหล่านั้น ซึ่งความยาว ของคล่ืนแสงท่ีแตกต่างกัน จะส่งผลให้เรามองเห็นสีท่ีแตกต่างกันด้วย สาหรับงานคอมพิวเตอร์กราฟิกนั้นจะมี การผสมสีท่ีเกิดจากแสงแสดงบนจอภาพ หรือการผสมหมึกสีพิมพ์ออกมาทางเครื่องพิมพ์ การใช้สีและแสงกับงาน กราฟิกในคอมพิวเตอร์น้ันจึงมีรายละเอียดหลายประการซ่ึงเป็นลักษณะเฉพาะ ไม่เพียงแต่ศึกษาเรื่องสีเท่านั้น แต่นักออกแบบกราฟิกที่ดีจะต้องรู้จักการเลือกการใช้สีและมีเทคนิคการใช้สีเพ่ือส่ืออารมณ์ความรู้สึก การศึกษา หลักการใช้สีและแสงในงานออกแบบกราฟิกจึงเป็นส่ิงสาคัญมาก ในบทนี้จะกล่าวถึงโหมดสี 4 ประเภทด้วยกัน คือ RBG, CMYK, HSB และ LAB 5.1 ประเภทของสใี นคอมพิวเตอร์ 5.1.1 RGB ตามหลักการมองเห็นสีของเครื่องคอมพิวเตอร์ RGB ย่อมาจาก Red (สีแดง), Green (สีเขียว) และ Blue (สนี า้ เงิน) โดยการใชส้ ดั สว่ นของสี 3 สตี ่างกัน จะทาให้เกดิ สีต่างๆ ได้อกี มากมาย (รปู ที3่ 5) รูปที่ 35 ระบบสี RGB เมื่อนามาผสมกันทาให้เกิดสีต่างๆ บนจอคอมพิวเตอร์ ซ่ึงใกล้เคียงกับสีที่ตาเรามองเห็นปกติ สีท่ีได้ จากการผสมสขี น้ึ อยกู่ ับความเขม้ ของสี โดยถา้ สีมคี วามเข้มข้นมาก เมื่อนามาผสมกันจะทาให้เกิดเป็นสีขาว จึง เรยี กระบบสีนวี้ า่ การผสมสีแบบบวก (Additive) ซงึ่ โดยปกติจะนาไปใชใ้ นจอภาพต่างๆ สาหรับการกาหนดค่า สี RGBนั้น สามารถเลือกได้ถึง 16 ล้านสี (ข้อมูลอ้างอิงจากกระทรวงศึกษาธิการ หลักสูตรการศึกษาด้าน

29 เทคโนโลยสี ารสนเทศ ฉบบั ปี 2545) โดยจะสามารถเลอื กเฉดสีได้ด้วยลักษณะของชดุ รหัสตัวเลข 0-9 และ A-F ปนกันไปจนครบ 6 ตัวอักษร เช่น 000000 = สีดา FFFFFF = สีขาว FF0000 = สีแดง เป็นต้น ดังนั้น ผู้ใช้สี สามารถกาหนดสไี ดต้ ่างๆ มากมาย โดยใชต้ วั อกั ษรปะปนกนั ไปมากกว่า 16 ลา้ นรูปแบบ ซึ่งชุดรหัสดังกล่าวจะ ถูกแปลงเป็นสีต่างๆ ด้วยกฎการใช้ กล่าวคือ จะใช้ตัวเลขใดๆ ก็ได้ 0-9 จานวนไม่เกิน 6 ตัว สามารถมีอักษร ภาษาองั กฤษผสมด้วยได้ ซึ่งจะใชไ้ ด้ตัง้ แต่ A-B-C-D-E-F เทา่ นนั้ นับตัง้ แตต่ วั G ขึ้นไปจะไมส่ ามารถประเมินผล ได้ สีทใี่ ช้ในเว็บไซต์ ตามมาตรฐานของสี มหี ลักการอ้างองิ ถึงในลกั ษณะสองแบบ คือ อ้างอิงตามช่ือสีมาตรฐาน ในภาษาอังกฤษ และรหัสสใี นเลขฐานสบิ หก (รูปท่ี36) รปู ท่ี 36 รหสั สีมาตรฐานในภาษาองั กฤษ และรหสั สีในเลขฐานสบิ หก หลงั จากการพฒั นาเทคโนโลยีทางคอมพิวเตอร์อย่างต่อเน่ือง ทาให้คอมพิวเตอร์ส่วนใหญ่ในปัจจุบัน สามารถแสดงผลสีอย่างน้อย 256 สี จึงเป็นผลให้ตัวสีท่ีปลอดภัยสาหรับเว็บไซต์(Web Safe RGB)ถูกสร้างขึ้น ซึ่งคือจานสี 216 สีที่ยังอยู่ในช่วงของสีที่เป็นไปได้สาหรับคอมพิวเตอร์ท่ีสนับสนุน 256 สี สี Web Safe RGB ท้ัง216 สีจงึ ประกอบแบบสีท่ปี ลอดภยั สาหรบั เวบ็ ไซตด์ งั ในรูปที่ 37 ดังนั้น หากเราจะสร้างภาพกราฟิกสาหรับ แสดงผลบนเวบ็ ก็ควรใช้โหมดสนี ีเ้ พ่อื ปูองกนั การเกิดความผิดเพ้ยี นของสี

30 รูปท่ี 37 Web Safe RGB ทีม่ า http://www.lynda.com/hexh.html 5.1.2 CMYK ตามหลักการแสดงสีของเคร่ืองพิมพ์ CMYK ย่อมาจาก Cyan (สีฟูาอมเขียว(, Magenta (สีม่วงแดง(, Yellow (สีเหลือง(และ Key (สีดา ((รูปท่ี 38) การผสมสีจะเกิดจากการผสมของเม็ดสีเหล่าน้ีในปริมาณต่างๆ คิดเป็น % 100 จนถึง 90-80-70-60-50-40-30-20-10 ของปริมาณเม็ดสี ซึ่งกาหนดเป็น %นามาใช้ใน การพิมพ์สีต่าง ๆ เป็นระบบสีที่ใช้กับเคร่ืองพิมพ์ท่ีพิมพ์ออกทางกระดาษหรือวัสดุผิวเรียบอ่ืนๆ และเป็น แมแ่ บบสีมาตรฐานทใ่ี ชใ้ นการพิมพ์แบบ Offset จงึ เปน็ เหตุให้การส่ิงพมิ พ์สเี ราใช้คาตดิ ปากกันบอ่ ยๆวา่ พิมพ์\" \" สี 4

31 รูปที่ 38 ระบบสี CMYK เมื่อนามาผสมกันจะเกิดสีเป็นสีดาแต่จะไม่ดาสนิทเน่ืองจากหมึกพิมพ์มีความไม่บริสุทธิ์ จึงเป็นการ ผสมสีแบบลบ )Subtractive) หลักการเกิดสีของระบบน้ีคือ หมึกสีหนึ่งจะดูดกลืนแสงจากสีหน่ึงแล้วสะท้อน กลับออกมาเป็นสีต่างๆ เช่น สีฟูาดูดกลืนแสงของสีม่วงแล้วสะท้อนออกมาเป็นสีน้าเงิน ซึ่งจะสังเกตได้ว่าสีที่ สะท้อนออกมาจะเป็นสีหลักของระบบ RGB การเกิดสีนี้ในระบบน้ีจึงตรงข้ามกับการเกิดสีในระบบ RGB ข้อ สาคัญท่ีควรทาความเข้าใจคือ โดยทั่วไปหากเป็นสีท่ีต้องการพิมพ์ออกมา ไม่ว่าจะพิมพ์ในรูปแบบใดก็ตาม จะต้องใช้ค่าสี CMYK ซ่ึงในปัจจุบันยังมีผู้มีความเข้าใจในส่วนนี้น้อยมาก นักออกแบบมือสมัครเล่น เวลา ต้องการจะทางานประเภทสิ่งพิมพ์ กม็ ักตง้ั ค่าสีเปน็ RGB เพราะคดิ ว่าค่าสีดังกล่าวสีสดกว่า แต่เมื่อสั่งพิมพ์แล้ว กลับทาใหค้ า่ สีที่ปรากฏออกมาผิดเพ้ียน จะมากหรือน้อยก็ขึ้นอยู่กับสีท่ีเลือก เช่น เลือกสีแดง อาจจะได้สีชมพู เลือกสีม่วง อาจจะได้สีน้าเงิน เป็นต้น ดังนั้นผู้ท่ีใช้โหมดสีควรจะทาความเข้าใจการใช้โหมดสีของงานให้มาก เพือ่ งานทอี่ อกมาจะได้ค่าสที ตี่ รงกบั ความต้องการ CMYK จะใช้หลักการเลือกสีรูปแบบเดียวกับ RGB แต่ว่าค่าสีจะถูกตัดออกไปเป็นจานวนมาก ทาให้มี ค่าสีอยู่เพียงประมาณพันกว่าสีเท่านั้น โดยท่ีค่าสีของ CMYK จะตัดค่าสีที่ตาเรามองไม่เห็น หรือไม่สามารถ แยกแยะออกด้วยสายตาของมนุษย์ เพราะความใกล้เคียงกันมากเกินไปของสี เช่น ในกรณีของใบไม้ ท่ีเรา อาจจะมองว่าเป็นสีเขียว แต่ถ้าจะให้ระบุสีในใบไม้เดียวกันให้ใกล้เคียงที่สุด อาจจะได้คาตอบที่เป็น สีเขียว, เขยี วแก,่ เขยี วแก่กวา่ , เขียวอ่อน, เขยี วอมเหลือง ฯลฯ อย่างหาข้อสรุปไม่ได้ เพราะในสายตาคนเรามักจะมอง รูปแบบสหี ลกั ๆ เท่านัน้ ดังนนั้ สโี หมด CMYK จึงจะตดั คา่ สที ีห่ า่ งกนั ไมม่ ากออกไป สี PANTONE คือค่าสีพิเศษที่เคร่ืองพิมพ์ CMYK ท่ัวไปจะสามารถพิมพ์ได้ ซึ่งจะต้องส่ังเฉพาะสีใดสีนั้น มาใช้พิมพ์เลย PANTONE เป็นบริษัทท่ีได้รับความนิยมและยอมรับมากท่ีสุดในปัจจุบัน บริษัทน้ีมีผลิตภัณฑ์อยู่ หลายประเภทด้วยกัน อย่างไรก็ตาม PANTONE ท่ีนิยมใช้กันท่ัวไป ซึ่งก็คือ PANTONE SOLID COLOR หรือ เรยี กอกี อยา่ งหน่ึงวา่ PANTONE SPOT COLOR (รปู ท่ี 39)

32 รปู ท่ี 39 สีPANTONE ท่มี า http://creativeprintingpc.blogspot.com/

33 5.1.3 HSB ตามหลักการมองเห็นสขี องสายตามนุษย์ HSB ยอ่ มาจาก Hue(เนื้อสี), Saturation(ความอ่ิมตัวของสี) และ Brightness(ความสว่างของสี) (รูปที่ 40) เป็นระบบสีแบบจาลองการมองเห็นของสายตามนุษย์ เป็น เกณฑข์ องสใี นแบบมาตรฐาน Red, Green, และ Blue (RGB) ซง่ึ แบ่งออกเป็น 3 สว่ น คือ Hue คือสีของวัตถุที่สะท้อนออกมาจากวัตถุแล้วเข้าสู่สายตาของเรา ทาให้เราสามารถมองเห็นวัตถุ เป็นสีได้ ซึ่งแต่ละสีจะแตกต่างกันตามความยาวของคลื่นแสงท่ีมากระทบวัตถุและสะท้อนกลับมาท่ีตาของเรา ซึ่งมักเรียกสีตามชื่อสี เช่น สีเขียว สีแดง สีเหลือง เป็นต้น ค่า Hue จะบอกค่าสีเป็นองศาจาก 0 องศาหมุนไป ถงึ 360 องศา Saturation คือ ความสดหรอื ความอิ่มตัวของสี หรือ คือสัดส่วนของสีเทาที่มีอยู่ในสีน้ัน โดยค่าความ สดของสีจะเริ่มที่ 0% ถึง 100% ถ้ากาหนด Saturation ที่ 0% สีจะมีความสดน้อย แต่ถ้ากาหนดที่ 100% สี จะมีความสดมาก (ไม่มีสีเทาเลย หรือคือสีท่ีมีความอิ่มตัวเต็มท่ี) Saturation เป็นการแสดงแบบสัมพัทธ์ของ แสงทีม่ องเห็นจากแหลง่ กาเนิด การเพิ่ม Saturation สจี ะมคี วามบรสิ ุทธิ์มากขึน้ Brightness คือระดับความสว่างของสี โดยค่าความสว่างของสีจะเริ่มที่ 0% ถึง 100% ถ้ากาหนดท่ี 0% ความสว่างจะน้อยซ่ึงจะเป็นสีดา แต่ถ้ากาหนดที่ 100% สีจะมีความสว่างมากที่สุด Brightness เป็นการ แสดงความสัมพนั ธข์ องความหนาแน่น จากพลังงานของแหล่งกาเนิดท่ีมองเห็นได้ และสามารถค่าเป็นพลังงาน รวม หรือเป็นความสูงของคลื่นที่มีความหนาแน่นสูงในสีแบบ RGB ความสูงของคล่ืนของสีแดง เขียว และน้า เงนิ มชี ่วงจากร้อยละ ถึง 0 จาก 10 ของความสดใสเต็มท่ี ในระดับนี้สามารถนาเสนอโดยเลขฐาน 100 ถึง 0 ถงึ 00 จาก 16 อเลขฐานหรื 255FF รปู ที่ 40 ระบบสี HSB

34 5.1.4 LAB ตามมาตรฐานของ CIE (Commission Internationale d’Eclarirage) เป็นค่าสีท่ีถูกกาหนดข้ึนให้ เป็นมาตรฐานการวัดสีทุกรูปแบบ ครอบคลุมทุกสีใน RGB และ CMYK (รูปท่ี 41) และใช้กับสีที่เกิดจาก อุปกรณ์ทุกอย่าง ไม่ว่าจะเป็นจอคอมพิวเตอร์, เครื่องพิมพ์, เคร่ืองสแกน และอื่นๆ จึงเป็นระบบสีที่ไม่ข้ึนกับ อุปกรณ์ใด ๆ (Device Independent) เป็นโหมดสีท่ีมีความเหมือนจริงที่สุด สาหรับงานพิมพ์ท่ีเป็น Photo CD หรือภาพที่ต้องการใช้งานระหว่าง ระบบคอมพิวเตอร์ท่ีแตกต่างกัน เช่น Windows ไปยัง Mac โดยแบ่งออกเป็น 3 สว่ นคือ “L” หรือ Luminance เปน็ การกาหนดความสวา่ งซ่ึงมีค่าต้ังแต่ 0 ถึง 100 ถ้ากาหนดที่ 0 จะกลายเป็น สีดา แต่ถ้ากาหนดท่ี 100 จะกลายเป็นสีขาว, “A” เป็นค่าของสีที่ไล่จากสีเขียวไปสีแดง และ“B” เป็นค่าของสีท่ี ไลจ่ ากสีน้าเงินไปสีเหลือง รูปท่ี 41 ระบบสี LAB ที่มา http://www.thyon.com/blog/gamut-lets-get-techni-colour 5.2 เทคนิคการนาสไี ปใช้ในงานกราฟิก นอกจากรู้จักการผสมสีแล้ว เราควรรู้จักกับจิตวิทยาของสีที่จะมีผลต่ออารมณ์ของผู้พบเห็น และสีต่าง ๆ ใหค้ วามรู้สึกอยา่ งไร ตามรายละเอียดต่อไปน้ี

35 สี การแสดงอารมณ์ ความรสู้ กึ สีแดง แสดงถึงความต่ืนเต้น กระตุ้นสมอง อบอุ่น ร้อนแรง เช่ือม่ันในตัวเอง มีชีวิตชีวา ความรัก สเี ขยี ว กามารมณ์ การหา้ ม อนั ตราย ก้าวรา้ ว และรุนแรง สเี หลือง แสดงถึงความร่มเย็น เคารพตัวเอง ธรรมชาติ สิ่งแวดล้อม การเกษตร การเพาะปลูก การเกิด ใหม่ การงอกงาม เจรญิ เตบิ โต ความปลอดภยั ผ่อนคลาย สนี า้ เงิน แสดงถึงความสดใส เบิกบาน เรยี กรอ้ งความสนใจ รุ่งเรืองความม่ังค่ัง ฐานันดรศักดิ์ ความเจิด สมี ่วง จา้ และปญั ญา การพัฒนา การคาดหวัง สีฟาู สีทอง แสดงถึงความสุขุม หนักแน่น ความสูงศักด์ิ มีสมาธิ ความสัมพันธ์กับเพื่อน ความพอใจ สีขาว ความร้สู ึกเปน็ เจ้าของ ความเยน็ หดหู่ ทอ้ งฟาู ทะเล โลก สีดา แสดงถงึ พลงั อานาจ ความผูกพัน ความเศรา้ หมอง ความผิดหวงั จากความรกั ปลอบโยน สีชมพู แสดงถงึ ความสว่าง ความปลอดโปรง่ อสิ ระ เสรีภาพ ความคิดสรา้ งสรรค์ จนิ ตนาการ แสดงถงึ คณุ คา่ ราคา ส่งิ ของหายาก ความสาคัญ ความสูงสง่ สงู ศกั ด์ิ ความศรทั ธาสงู สุด แสดงถงึ ความสะอาด บรสิ ทุ ธ์ิ ความว่างเปลา่ ปราศจากกเิ ลส การแต่งงาน ความเชื่อถือ ความดี งาม ความศรทั ธา ความห่วงใย การเสียสละ ความออ่ นโยน จรงิ ใจ ความอ่อนแอ ยอมแพ้ แสดงถงึ ความมืด ความลึกลับ สิน้ หวัง ความตาย ความช่ัวร้าย ความชิงชัง ทาลายล้าง ความลุ่ม หลงเมามวั ความอดทน สงา่ กลา้ หาญ เข้มแขง็ และเสียสละ แสดงถึงความอบอุ่น อ่อนโยนอ่อนหวาน นุ่มนวล ความเอ้ืออาทร ปลอบประโลม เอาใจใส่ดูแล ความปรารถนาดี เป็นมติ ร ตารางที่ 2 จิตวทิ ยาของสี ความรู้สึกทางจิตวิทยาเก่ียวกับสีท่ีกล่าวมาจะเป็นความรู้สึกท่ีเป็นสากล เป็นส่วนใหญ่ในโลก แต่ นอกจากท่ีกล่าวมาแล้ว ในบางพ้ืนท่ีหรือบางวัฒนธรรม อิทธิพลของสีจะแตกต่างกันออกไปตามประสบการณ์ ของแตล่ ะบคุ คล วัฒนธรรม ประเพณี ขนบธรรมเนียม หรือค่านิยมของแต่ละกลุ่มชน นอกจากแต่ละสีจะสร้าง ความรู้สึกด้วยตนเองแล้ว เมื่อนามาใช้ร่วมกันเรายังสามารถแบ่งสีออกเป็น 2 วรรณะ เพ่ือสร้างอารมณ์ท่ี แตกตา่ งกันออกไปเม่ือใชง้ านรว่ มกนั ได้อกี คอื สีท่ีอยใู่ นวรรณะร้อน (Warm Tone Color) ได้แก่ สีเหลืองส้ม สี ส้ม สีแดง และสีม่วงแดง สีกลุ่มน้ีเมื่อใช้ในงานจะรู้สึกอบอุ่น ร้อนแรง สนุกสนาน และสีที่อยู่ในวรรณะเย็น )Cool Tone Color) ไดแ้ ก่ สีเขยี ว สีฟาู สีม่วงคราม สกี ลุม่ น้เี ม่ือใชง้ านจะไดค้ วามรู้สกึ สดช่นื เย็นสบาย

36 รูปท่ี 42 วรรณะสี เรายงั สามารถแจกแจงสีเป็นวงล้อสีด้วย วงล้อสีเป็นกฎธรรมชาติของสี ที่มีความประสานกลมกลืนและมี ความสมดลุ คา่ น้าหนักอ่อน-แก่ของสี ความเป็นสีที่แตกต่างกันของน้าหนักอ่อนไปจนเข้ม วงล้อสีมีบทบาทสาคัญ มากในการสร้างสรรค์งานทางด้านศิลปะ เพราะมีส่วนในการแสดงออกเร่ืองน้าหนักอ่อน-แก่ของสีท่ีมีความจัด ความเป็นสี มีลักษณะผิวที่เป็นบริเวณของวงสี และเม่ือลงลึกถึงแต่ละสีในวงจร จะสามารถแบ่งออกได้เป็น 3 ระดับคือ สขี ัน้ ตน้ (Primary Colors) หรอื แม่สี อนั ประกอบด้วยสแี ดง สเี หลอื ง และสนี ้าเงิน สีข้ันท่ีสอง (Secondary Colors) คือ สีที่เกิดจากการผสมกันของแม่สี เช่น สีแดงสผสมกับสีเหลือง เป็นสีส้ม สีเหลอื งผสมกับสีน้าเงนิ เป็นสีเขียว และสนี า้ เงนิ ผสมกับสีแดงเป็นสมี ว่ ง สีข้ันท่ีสาม (Tertiary Colors) คือสีที่เกิดจากการผสมแม่สีกับสีข้ันท่ีสอง จะได้สีใหม่ที่อยู่ระหว่างแม่สี กับสขี ้ันที่สองนัน่ เอง รูปที่ 43 วงลอ้ สี

37 เทคนิคการนาสีไปใช้งานกราฟิกมีอยู่มากมายหลายวิธี แต่ทุกวิธีจะชี้ไปที่วัตถุประสงค์หลัก ๆ คือ ใช้สี เพ่ิมความโดดเด่นให้กับจุดเด่นในภาพ และใช้สีตกแต่งส่วนอ่ืน ๆ ของภาพให้ได้ภาพรวมออกมาในอารมณ์ท่ี ต้องการ โดยเทคนิคการเลือกสีจะมีสูตรสาเร็จให้เลือกใช้งานอยู่บ้าง คือ วิธีโยงความสัมพันธ์จากวงล้อสี ดังน้ัน ก่อนจะทางานทุกครั้งควรเลือกสีหลัก ๆ สาหรับใช้ในการทางานก่อน เทคนิคการเลือกใช้สีแบบสูตรสาเร็จจะมีอยู่ หลายรูปแบบ แตแ่ บบทนี่ ิยมให้งานกันเป็นหลักจะมีอยู่ 4 รูปแบบ คอื 5.2.1 Monochrome หรือเอกรงค์ จะเปน็ การใช้สีท่ีไปในโทนเดียวกันทั้งหมด เชน่ จุดเดน่ เปน็ สีนา้ เงิน สีสว่ นทีเ่ หลือจะเป็นสที ี่ใกล้เคียงกับ สีนา้ เงนิ โดยใชว้ ิธลี ดนา้ หนักความเข้มของสีน้าเงนิ ลงไป(รปู ท่ี 44) เพ่ือสร้างความกลมกลืน ในการใช้สีเอกรงคจ์ ะ ไม่มกี ารใชส้ ีตรงขา้ ม แต่จะใช้ในวรรณะของโครงสนี ้ันเท่านนั้ และไม่ควรเกนิ 5 สี ท่ีเรียงกันตอ่ จากสีท่ีเลือกในวงสี รูปท่ี 44 Monochrome หรือเอกรงค์ 5.2.2 Complementary หรือสีตัดกัน คือ สีที่ตัดกันหรือสีตรงกันข้าม เป็นสีที่อยู่ตรงข้ามกันในวงสี เช่น สีฟูาจะตรงข้ามกับสีส้ม หรือสีแดงจะ ตรงข้ามกับสเี ขยี ว (รูปที่ 45) สามารถนามาใช้งานได้หลายอย่าง และก็สามารถส่งผลได้ทั้งดีและไม่ดี หากไม่รู้หลัก พ้ืนฐานในการใช้งาน การใช้สีตรงข้ามหรือสีตัดกัน ไม่ควรใช้ในพ้ืนท่ีปริมาณเท่ากันในงาน หรือใช้มากเกินไป เพราะจะทาให้ภาพดูขัดแยง้ กันมากเกนิ ไป ดูรุนแรง สบั สน น่าเบอื่ จืดชืด ควรใช้สีใดสีหน่ึงจานวน70 - 80% ส่วน สีท่ีตรงข้ามกันให้ใช้ประมาณ 20-30% บนพื้นท่ีของงานโดยรวม จะทาให้ความตรงข้ามกันของพื้นที่น้อย กลายเป็นจดุ เดน่ ของภาพ กลายเป็นภาพท่ีงดงามและดูมชี วี ิตมากข้ึน

38 รูปที่ 45 Complementary หรอื สีตัดกนั 5.2.3 Triad หรอื สีแบบสามเส้า คือ การเลือกสีสามสีท่รี ะยะห่างเท่ากันเป็นสามเหลี่ยมด้านเท่ามาใช้งาน การใช้สแี บบ 3 เส้า เป็นการใช้ แม่สมี าตดั กันทาใหม้ ีความเด่นของท้งั 3 สี (รปู ท่ี 46) รูปท่ี 46 Triad หรือสีแบบ 3 เส้า 5.2.4 Analogic หรือสขี ้างเคียงกนั คือ การเลือกสีใดสหี น่ึงข้ึนมาใช้งานพร้อมกบั สีท่ีอยู่ตดิ กันอีกข้างละสี หรือสสี ามสอี ยู่ตดิ กันในวงจรสี (รูป ที่ 47)

39 รปู ที่ 47 Analogic หรือสขี า้ งเคยี ง บทที่ 6 พืน้ ฐานการออกแบบกราฟิก 6.1 ความหมายของการออกแบบกราฟิก การออกแบบกราฟิก คือ การสร้างสรรค์สิ่งใหม่ และการปรับปรุงเปล่ียนแปลงของเดิมให้ดีขึ้น ด้วย การใชห้ ลกั การจดั องคป์ ระกอบทางศลิ ปะ โดยมีเครอ่ื งมอื สาคัญคอื โปรแกรมออกแบบคอมพวิ เตอร์กราฟิก 6.2 หนา้ ทข่ี องงานออกแบบกราฟิก

40 เราสามารถจาแนกหน้าท่ีหลักๆ ของงานออกแบบกราฟิกไดเ้ ป็น 3 ลักษณะ 6.2.1 เพ่อื บอกเลา่ เรอ่ื งราวหรือรายละเอยี ดส่งิ ต่างๆ (To Inform) งานกราฟิก ทาหน้าที่บอกกล่าวหรือชี้แจงข่าวสาร เรื่องราว เหตุการณ์ หรือส่ิงอื่นใดให้ผู้อ่ืนได้รับ ทราบ เช่น สัญลักษณ์บนท้องถนน ท่ีช่วยแจ้งให้ทราบว่าทางข้างหน้าจะมีลักษณะอย่างไร บอกตาแหน่ง ระยะทาง และบอกถึงกฎจราจรตา่ งๆ เปน็ ต้น โดยการออกแบบกราฟกิ จะช่วยลดความสับสนในการใช้เส้นทาง บนทอ้ งถนน (รปู ที่ 48) รปู ท่ี 48 การออกแบบกราฟิกในป้ายสัญลักษณจ์ ราจรทางหลวง ท่มี า http://nteachcar.igetweb.com/articles/41932359/ 6.2.2 เพื่อแสดงถงึ ลักษณะของบคุ คลหรือสง่ิ ใดสิ่งหน่งึ (To Identify) งานออกแบบกราฟิกเก่ียวข้องกับการส่ือสารบุคลิกของส่ิงน้ันๆ ออกมาอย่างมีเอกลักษณ์ เช่น การ ออกแบบหน้าปกซีดีเพลงประเภทเพลงร็อก อาจมีลักษณะสีท่ีให้อารมณ์จริงจัง ดุดัน ตามแนวเพลงและบุคลิก ของศิลปนิ (รปู ท่ี 49)