E-Book โปรแกรมกราฟิก 2204-2105

หนว่ ยการเรียนรทู้ ่ี 1 ทฤษฎคี อมพวิ เตอรก์ ราฟกิ ส์

แนวคดิ
ปัจจุบันการออกแบบกราฟิกเพื่อประยุกต์ใช้สำหรับงานต่างๆ โดยใช้คอมพิวเตอร์เป็นน

เครื่องมือในการสร้างสรรค์ผลงานทีม่ ีความหลากหลายและสะดวกรวดเร็วและมีประสทิ ธภิ าพมากขึน้
ทำใหผ้ ลงานทีใ่ ชค้ อมพวิ เตอรก์ ราฟิกส์เปน็ ที่ยอมรบั และมกี ารใช้งานกนั อย่างแพรห่ ลาย

สาระการเรียนรู้
1. ความหมายของคอมพิวเตอรก์ ราฟกิ ส์
2. การออกแบบ (Design)
3. ประเภทของโปรแกรมสำหรบั งานกราฟกิ ส์
4. คณุ ค่าของงานกราฟกิ
5. การประยกุ ต์ใชค้ อมพิวเตอรก์ ราฟิกสใ์ นงานดา้ นต่างๆ และโปรแกรมท่ีเกีย่ วขอ้ ง

ผลการเรยี นรู้ที่คาดหวงั
1. อธบิ ายความหมายของคอมพิวเตอรก์ ราฟิกสไ์ ด้
2. ออกแบบได้ (Design) ได้
3. บอกประเภทของโปรแกรมสำหรับงานกราฟกิ ได้
4. บอกคุณคา่ ของงานกราฟิก
5. ประยกุ ต์ใชค้ อมพิวเตอร์กราฟิกสใ์ นงานดา้ นตา่ งๆ และโปรแกรมท่เี กยี่ วข้อง

แบบประเมนิ ผลก่อนเรยี นหน่วยท่ี 1

คำสั่ง จงเลือกคำตอบที่ถกู ตอ้ งเพียงขอ้ เดยี ว

1. ปัจจบุ ันนิยมใช้คอมพิวเตอรก์ ราฟกิ สใ์ นงานดา้ นใดบา้ ง

ก. ด้านบันเทิง ข. ดา้ นการศึกษา

ค. ดา้ นการแพทย์ ง. ถกู ทกุ ขอ้

2. เหตุใดจงึ มกี ารนำคอมพวิ เตอร์กราฟิกส์มาใชใ้ นการประกอบ

ก. เพอ่ื ลดต้นทนุ ในการออกแบบ

ข. เพ่อื เพิ่มความสมจรงิ

ค. เพอื่ ความสะดวกสบาย

ง. ถกู ทุกข้อ

3. ปัจจบุ ันมีโปรแกรมเพ่อื เลือกใช้ในการออกแบบหลากหลายนนั้ เปน็ คำกล่าวทถ่ี กู ต้องหรอื ไม่

ก. ถูกต้อง เพราะปัจจุบันมีเพียงโปรแกรมเดียวเท่านนั้ คอื

ข. ถูกตอ้ ง เพราะปัจจุบนั มีการพฒั นาโปรแกรมอย่างหลากหลาย

ค. ไม่ถกู ตอ้ ง เพราะโปรแกรมเพอ่ื การออกแบบเป็นโปรแกรมท่ีมลี ิขสิทธิ์ราคาสงู

ง. ไม่มขี ้อใดถูก

4. “กราฟิกมี 2 ประเภท คือ กราฟิกวาดภาพและกราฟิกนำเสนอ” ข้อความดังกล่าวถูกต้อง

หรอื ไมเ่ พราะเหตุใด

ก. ถกู ตอ้ ง เน่อื งจากปัจจุบันกราฟิกมีการพฒั นาเพิ่มข้ึนมากกวา่ 2 ประเภท

ข. ไมถ่ ูกตอ้ ง เนื่องจากกราฟกิ เปน็ การนำเสนอด้วยภาพจึงไมม่ ีประเภทของกราฟิก

ค. ข้อความดงั กล่าวถูกต้อง

ง. ไมถ่ กู ตอ้ ง เน่ืองจากกราฟิกถูกแบง่ ออกเป็นลกั ษณะของงานมากกว่าจะแบง่ เปน็ ประเภท

5. ข้อใดเปน็ การแสดงขอ้ มูลกราฟกิ

ก. ภาพแอนิเมชนั ข. ภาพวาดและตดั ต่อดว้ ยคอมพิวเตอร์

ค. การหมุนภาพในทศิ ทางต่างๆ ง. ถกู ทกุ ขอ้

6. ข้อใดเป็นโปรแกรมกราฟกิ ในปจั จบุ นั

ก. Microsoft Word ข. Microsoft Paint

ค. Adobe Photoshop ง. ถกู ทุกข้อ

7. ข้อใดไม่ใชค่ ุณสมบัตขิ องคอมพิวเตอรก์ ราฟิกสใ์ นปัจจบุ ัน
ก. สามารถแสดงกลิ่นใหผ้ ้ใู ชร้ ับร้ไู ด้
ข. การทำภาพแบบสามมติ ิ
ค. การทำภาพแบบสองมิติ
ง. การตดั ตอ่ แตง่ เติมรูปภาพ

8. ขอ้ ใดเปน้ ลักษณะทดี่ ีในการใชส้ ีในงานออกแบบ
ก. การใชส้ ีฉดู ฉาดเสมอ
ข. การเลอื กใชส้ ีทเ่ี หมาะสมกับภาพ
ค. การใช้สีออ่ นสลับเขม้ เสมอ
ง. การสร้างแมส่ ใี หมใ่ นการสร้างภาพเสมอ

9. ขอ้ ใดหมายถงึ ความหมายของคำว่า
ก. การถา่ ยทอดความรเู้ พื่อการสือ่ สาร
ข. โปรแกรมกราฟกิ ชนดิ หน่ึง
ค. ศาสตรแ์ หง่ ความคิดเพ่ือให้เกิดความพงึ พอใจ
ง. เรขภาพคอมพิวเตอร์

10. คอมพวิ เตอร์กราฟิกส์ถกู นำมาใช้เพื่ออะไร
ก. เพอ่ื การสอ่ื สารเกดิ ความเขา้ ใจตรงกัน
ข. เพือ่ ความสวยงามมากย่ิงขึ้น
ค. เพอื่ ใหเ้ กิดความสมจรงิ มากยงิ่ ขน้ึ
ง. ถกู ทกุ ข้อ

ความหมายของคอมพวิ เตอร์กราฟิกส์

คอมพิวเตอร์กราฟิกส์ (Computer Graphics) หรือใน

ศัพท์คอมพิว เตอร์และเทคโ นโ ลยี สารสนเทศ ฉบับ

ราชบัณฑิตยสถานว่า เรขภาพคอมพิวเตอร์ เป็นสาขาหนึ่งใน

แขนงวิทยาการคอมพิวเตอร์ซึ่งมีเรื่องเกี่ยวกับการทำให้เครื่อง

คอมพิวเตอร์ แสดงภาพบนจอภาพได้ เช่น การหมุนภาพใหด้ ูทิศ รปู ภาพสนุ ัขวง่ิ บนน้ำ
ทางต่างๆ กัน, เติมสีแต่งภาพ, ตัดต่อภาพเคลื่อนย้ายตำแหน่ง โดยใช้โปรแกรมกราฟกิ ช่วย
ภาพ รวมไปถึง การสร้างภาพเคลื่อนไหวแอนิเมชัน (แบบ
สร้างภาพ

การ์ตูน) กราฟิก (Graphic) คำว่า กราฟิก มีที่มาจากภาษากรีก 2 คำ คือGraphikos แปลว่า การ

สร้างภาพ “การวาดเขียน และเขียนภาพ" หรือ Graphein แปลว่า “การเขียน” ปัจจุบันมีการนำ

กราฟกิ มาประยุกตใ์ ชใ้ นงานต่างๆ เชน่ การสร้างแผนภาพ, การสรา้ งงานนำเสนอข้อมูล, แผ่นพับ, ใบ

โฆษณา ตลอดจนรูปภาพต่างๆ ที่พบในชีวิตประจำวัน เช่น ปกหนังสือนิตยสารวารสาร, รูปภาพบน

ผลติ ภัณฑ์ หรือหนังสือพิมพ์, เว็บไซต์ ตลอดจนข้อความต่างๆ เปน็ ตน้

รปู ภาพธรรมชาตทิ ่ีสร้างจากโปรแกรมกราฟกิ เว็บไซต์เฟซบ๊กุ มีการจดั วางข้อความให้ดูนา่ สนใจ

ผลติ ภณั ฑ์ยาสฟี ันท่ีมีการพฒั นารปู ภาพกราฟิก ขนมขบเค้ยี วตราปอ๊ กกีส้ ำหรับวนั ฮลั โลวนี (รสฝกั ทอง)

การออกแบบ (Design)

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

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

รูปภาพธงชาติไทยและการแปรอักษร ต้องใช้เทคนิคทางคอมพิวเตอร์เข้ามาช่วยสร้างสื่อ
กราฟกิ ในการอธิบายดว้ ยภาพประกอบขอ้ มูล เพือ่ ให้เกิดความเข้าใจตรงกนั

ตัวอย่างสื่อกราฟิก เช่น สัญลักษณ์ (Symbol), ตราสัญลักษณ์ (Logo), แผนภาพ (Chart),
กราฟ (Graph)

ตัวอยา่ งภาพตราสญั ลกั ษณ์

ประเภทของโปรแกรมสำหรับงานกราฟิก

โปรแกรมสำหรับงานกราฟิกเป็นการใชค้ วามสามารถของคอมพิวเตอร์ในการผลิตงานกราฟิก
ปจั จุบันมีการผลิตโปรแกรมสำหรับใชท้ ำงานดา้ นกราฟกิ จำนวนมาก แบ่งเป็น 2 ประเภทดงั น้ี

1. กราฟิกวาดภาพ
2. กราฟกิ นำเสนอ

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

รูปภาพแสดงโปรแกรมประมวลผลคำซ่ึงมีหลากหลายโปรแกรม

1. กราฟิกวาดภาพ
ปจั จบุ นั โปรแกรมกราฟิกวาดภาพมีการพัฒนาอยา่ งรวดเรว็ ไปตาม
อุปกรณ์คอมพิวเตอร์ ทำให้โปรแกรมมีหลากหลายโปรแกรม หลายรุ่น แต่
โดยรวมแล้วโปรแกรมกราฟิกวาดภาพควรมีความสามารถในการวาดภาพ
รูปทรงอิสระ เลือกบางส่วนในรูปภาพ, ใส่ข้อความ, ใส่รูปทรง, ใส่สี
ตลอดจนการเลือกบันทึกไฟล์รูปภาพที่เป็นนามสกุลของรูปภาพได้
หลากหลายนามสกุลเพื่อนำไปใช้งาน ตัวอย่างโปรแกรมกราฟิกวาดภาพ
เช่น Microsoft Paint, Adobe Photoshop, CorelDRAW เป็นตน้

โปรแกรม Microsoft Paint โปรแกรม Adobe Photoshop

จากรูปภาพทางซา้ ยคอื โปรแกรมไมโครซอฟต์เพนต์ (Microsoft Paint) ซึ่งเปน็ โปรแกรมท่ีมา
พรอ้ มกบั ไมโครซอฟต์วนิ โดวส์ (Microsoft Windows) ทกุ ร่นุ ในภาพเป็นโปรแกรมไมโครซอฟต์เพนต์
จากไมโครซอฟต์ วินโดวส์เซเว่น (Microsoft Windows7) และรูปภาพทางขวาคือโปรแกรม Adobe
Photoshop ซึ่งเป็นโปรแกรมที่ต้องติดตั้งเพิ่ม ในภาพเป็นโปรแกรม Adobe Photoshop Creative
Suite 4

2. กราฟิกนำเสนอ
โปรแกรมประเภทนี้ใชน้ ำเสนอข้อมลู หรอื ผลงานในรปู กราฟกิ โดย
โปรแกรมสามารถใสข่ อ้ มูลในรูปแบบตา่ งๆ และมีการเก็บข้อมลู เปน็ ภาพนงิ่
สามารถจดั เรยี งลำดับเพอื่ นำมาแสดงหรอื นำเสนอได้งา่ ย ตัวอยา่ งโปรแกรม
ประเภทนี้เชน่ โปรแกรมไมโครซอฟต์เพาเวอร์พอยต์ (Microsoft PowerPoint),
โคเรลพรเี ซนเทชั่น (Cord Presentation), อควาซอฟตส์ ไลด์โชว์ สตูดิโอ
(AquaSofSlideShow Studio) เป็นต้น

โปรแกรม Microsoft PowerPoint2010 (Windows) โปรแกรม Microsoft PowerPoint2011 (Mac)

Graphic Presentation Program ห รื อ
โปรแกรมการนำเสนอข้อมูล คือโปรแกรมสำหรับ
จัดเตรียมเครื่องมอื ที่จำเป็นต้องใช้ในการนำเสนอขอ้ มลู
เพอื่ ใหผ้ ู้ใช้สามารถใช้งานได้สะดวกรวดเร็วข้ึน เพิ่มความสามารถในการนำเสนอข้อมูลแบบส่ือประสม
เชน่ ข้อความ (Text) กราฟิก (Graphic) เสียง (Sound) วดิ ีโอ (Video) หรือจดุ เช่ือมโยง (Hyperlink)
นอกจากนี้ยังสามารถทำงานร่วมกับโปรแกรมอื่น ๆ ได้ เช่น ความสามารถในการดึงข้อมูลจาก
โปรแกรมประมวลผลคำหรอื โปรแกรมอ่ืนท่ีเกีย่ วข้องกับงานนำเสนอเข้ามาใชง้ านร่วมกนั

รปู ภาพตวั อยา่ งโปรแกรมทมี่ ีการนำเสนอเป็นลกั ษณ์ของภาพน่ิง

คุณค่าของงานกราฟิก

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

1. เพ่ิมประสทิ ธิภาพในการสอื่ สาร
2. จดจำงา่ ย และนา่ สนใจ
3. งานนำเสนอนา่ ติดตาม และเขา้ ใจงา่ ย
4. เป็นสือ่ กลาง เพ่อื ให้เกิดการเรียนรู้
5. เกิดความคิดสร้างสรรคใ์ นส่งิ ใหม่
จดุ ประสงคข์ องกราฟิกนนั้ คือสื่อสารให้มคี วามเขา้ ใจตรงกนั สังเกตไดจ้ ากตัวอักษรที่สามารถ
นำมารวมกันเป็นข้อความเพื่อสื่อสาร ภาษาที่สามารถนำมาสร้างเป็นข้อความได้ก็มีหลายภาษา
แตกต่างกนั เม่อื นำมาใชส้ อ่ื สารต้องสามารถทำใหผ้ ู้รบั สารเขา้ ใจได้ตรงกนั กับผ้สู ง่ สาร

รปู ภาพแสดงกราฟิกเพอ่ื การสือ่ สาร

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

รปู ภาพหลกั ศลิ าจารกึ และรูปภาพโฆษณาในสมัยก่อน รูปภาพแสดงรายการอาหารพรอ้ มบอกจำนวนกโิ ล
แคลอรแี ละการโฆษณาในปจั จุบนั

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

Walt Disney Logo สรา้ งตราสญั ลกั ษณไ์ ดน้ า่ สนใจ และปา้ ยท่ีต้องใช้โปรแกรมกราฟกิ ในการออกแบบ

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

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

รูปภาพแสดงงานกราฟิกเปน็ สอื่ กลาง และเพอื่ ให้เกดิ การเรยี นรู้

5. เกดิ ความคดิ สร้างสรรค์ในสง่ิ ใหม่
งานกราฟิกที่มีความคิดแปลกใหม่ ย่อมนา่ สนใจกว่างานกราฟิกที่มแี ต่ความคิดเดิม ซึ่งการทำ
ให้งานมคี วามสร้างสรรค์ต้องเรมิ่ คดิ จากสง่ิ ท่วี า่ งเปล่า หรอื ส่ิงท่ีไม่เคยมีมาก่อน เพราะหากคิดในส่ิงท่ีมี
มาก่อนอยู่แล้วจะทำให้ไม่สามารถสร้างงานสิ่งใหม่ได้ ดังนั้นหากการออกแบบภาพกราฟิก ยึดติดกับ
ความเป็นไทยมากจนเกินไป อาจไม่สร้างสรรค์งานใหม่ๆ ได้ จึงต้องคิดหรือผสมผสาน สิ่งแปลกใหม่
เพือ่ ใหภ้ าพน้นั ดแู ปลกใหม่ น่าสนใจได้

รปู ภาพแสดงคอมพิวเตอร์กราฟกิ ส์ทม่ี ีความคดิ สร้างสรรคใ์ นสิ่งใหม่

การประยกุ ตใ์ ช้คอมพิวเตอรก์ ราฟิก ในงานดา้ นต่างๆ และโปรแกรมทีเ่ กี่ยวข้อง

การประยกุ ต์ใชค้ อมพวิ เตอรก์ ราฟิกสใ์ นงานด้านตา่ งๆ สามารถแบ่งได้ดงั นี้
1. การประยกุ ตด์ ้านการออกแบบ
2. การประยกุ ตต์ ้านสงิ่ พิมพ์
3. การประยุกตด์ า้ นการแพทย์
4. การประยกุ ตด์ ้านบันเทิง
5. การประยุกต์ด้านการศกึ ษา
6. การประยกุ ตด์ า้ นอนื่ ๆ
ในช่วงอายุที่แตกต่างกันมักจะพบงานกราฟิกที่แตกต่างกัน เช่น ในเด็กจะพบงานกราฟิกท่ี
เกี่ยวกับการ์ตูน เกม โดยงานกราฟิกบนเว็บไซต์ กราฟิกในภาพยนตร์ โฆษณาต่าง ๆ ก็เป็นการ
ประยุกตใ์ ช้คอมพวิ เตอรก์ ราฟิกส์เช่นเดยี วกนั

1. การประยุกตด์ ้านการออกแบบ
งานออกแบบทั่วไป เช่น การออกแบบบ้าน

เครื่องยนต์ รถยนต์ ผลิตภัณฑ์ต่างๆ เป็นงานที่ต้องรอบคอบ
สิ้นเปลืองแรงงานและเวลา ปัจจุบันได้นำคอมพิวเตอร์มา
ช่วยออกแบบเรียกว่าโปรแกรม CAD (Computer Aided
Design) เช่น โปรแกรมออโต้แคต (AUTOCAD) และ คอมพิวเตอร์ช่วยการผลิตทางอุตสาหกรรม
เรียกว่า (CAM (Computer Aided Manufacturing) ซึ่งอำนวยความสะดวกในการออกแบบ และ
เพ่ือปรับปรุงแกไ้ ขชิ้นสว่ นต่าง ๆ บนจอภาพ

รูปภาพการออกแบบโดยใช้ไมโ่ ปรแกรมคอมพิวเตอร์

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

รปู ภาพแสดงการออกแบบโดยใช้โปรแกรมคอมพวิ เตอร์

โปรแกรมท่ีเกี่ยวข้องกับสิ่งพิมพ์ ได้แก่ โปรแกรม Microsoft Office Publisher, Adobe
Page Maker, Adobe Illustrator, Adobe Photoshop, QuakeXPress

รปู ภาพตัวอย่างโปรแกรมท่ีเกย่ี วขอ้ งกับส่งิ พมิ พ์

3. การประยุกตด์ ้านการแพทย์
อเิ มจโปรเซสซิง (Image Processing) หมายถงึ การแสดงภาพท่ีเกิดจากการถ่ายรูปหรือจาก
การสแกนภาพให้ปรากฏบนจอภาพคอมพิวเตอร์ วิธีการทางอิเมจโปรเซสซิงจะต่างกับวิธีการของ
คอมพิวเตอร์กราฟิก คือ ในระบบคอมพิวเตอร์กราฟิก ตัวคอมพิวเตอร์เองจะเป็นตัวที่สร้างภาพ แต่
เทคนิคทางอิเมจโปรเซสซิงนั้นใช้คอมพิวเตอร์สาหรับการจัดรูปแบบของสีและแสงเงาที่มีอยู่แล้วใน
ภาพให้เป็นข้อมูลทางดิจิทัลแล้วอาจมีวิธีการทำให้ภาพที่รับเข้ามานั้นมีความชัดเจนมากขึ้นก่อน
จากนั้นก็จัดการกับข้อมูลดิจิทัลนี้ให้เป็นภาพส่งออกไปที่จอภาพของคอมพิวเตอร์อีกที วิธีการนี้มี
ประโยชน์ในการแสดงภาพของวัตถุที่ไม่สามารถจะเห็นได้โดยตรง เช่น ภาพถ่ายดาวเทียม ภาพจาก
ทวี สี แกนของหุ่นยนต์อตุ สาหกรรม
เทคนิคของอิเมจโปรเซสซิงประยุกต์ใช้กับการแพทย์ได้ เช่น การตรวจเลือดหัวใจ อวัยวะ
ภายใน การรกั ษาโรคมะเรง็ โดยฉายรังสเี อกซ์ เปน็ ตน้ โดยแสดงขอ้ มลู บนจอภาพเรียกว่า “เอกซเรยโ์ ท
โมกราฟี” (X - Ray Tomography) ซึ่งรังสีนี้จะเกิดปฏิกิริยาต่อฟิล์มถ่ายรูปหรือกระดาษอัดรูปได้
เชน่ เดยี วกบั แสงสวา่ งธรรมดา

ตัวอยา่ งรูปภาพ X-Ray Tomography

นอกจากนี้ยังนำคอมพิวเตอร์มาช่วยการบริหารงานในโรงพยาบาล เช่น การจองเตียงคนไข้
คุมสตอ๊ กยา ระเบียนคนไข้ เช่น Smart Hospital เปน็ ตน้

ตัวอย่างโปรแกรมทน่ี ำคอมพิวเตอร์มาช่วยการบริหารงานในโรงพยาบาล
ในส่วนของการออกแบบหน้าจอ (E/ser interface : UT) ตดิ ต่อกบั ผใู้ ช้โปรแกรม

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

ในอดีตภาพยนตร์เป็นการบันทึกภาพด้วยฟิล์มแล้วสวย
เป็นภาพเคลื่อนไหว ซึ่งผ่านกระบวนการตัดต่อจนรบภาพนั้น
สามารถบอกเรื่องราวได้ เทคโนโลยีภาพยนตร์ในสมัยใหม่มีการ
พัฒนาเป็นภาพยนตร์สามมิติ โดยให้ผู้ชมสวมแว่นตาพิเศษเพื่อให้
เหน็ มิตคิ วามลึกสมจริงมากขน้ึ

รูปภาพตวั อยา่ งโปสเตอรภ์ าพยนตร์

โปรแกรมที่เกี่ยวข้องกับการตัดต่อวิดีโอ ได้แก่ โปรแกรม iMovie, Windows Live Movie,
Corel Video Studio

การ์ตูน คือภาพเคลื่อนไหวเรียกว่า แอนิเมชัน ในการสร้างการ์ตูนจำเป็นต้องมีโครงเรื่อง
(Story Board) ของการ์ตูนเรื่องนั้นๆ โดยการสร้างการ์ตูนจะใช้วิธีการวาดรูปภาพทีละภาพลงบน
เฟรม หรือกำหนดให้คอมพิวเตอร์วาดภาพบนเฟรมแบบอัตโนมัติ จากนั้นนำภาพที่วาดมาเรียงต่อกนั
และเปิดด้วยความเร็วที่ต้องการ โดยความเร็วของการ์ตูนที่นิยมใช้กันเป็นความเร็ว 12 FPS (frame
Per Second)

FPS (frame Per Second) คอื การแสดงการเคลื่อนไหวของ
ระบบฟิลม์ วดิ โี อและดิจิทลั อตั ราการแสดงภาพตอ่ วินาทีในโปรแกรม
Flash เวอรช์ ัน 8 ลงมาจะตัง้ ค่าเร่มิ ตน้ ที่ 12 fps (12 ภาพต่อวนิ าที)
แต่หากใช้เวอร์ชัน CS ขึ้นไปจะมีค่าเริ่มต้นที่ 24 fps (24 ภาพต่อวินาที) ซึ่งเป็นภาพแบบความเร็ว
เทา่ กบั ภาพยนตรใ์ นโรงภาพยนตร์

รปู ภาพแสดงการต์ นู ญี่ป่นุ ท่ีมลี ักษณะเปน็ แอนเิ มชนั

โปรแกรมทีเ่ ก่ียวข้องกบั การสร้างรูปภาพเคลื่อนไหว ได้แก่ โปรแกรม Adobe Flash, Swish
Max ซึง่ โปรแกรมเหลา่ น้สี ามารถนำมาประยกุ ตใ์ ช้ในการสรา้ งเวบ็ ไซต์ไดด้ ว้ ย

รปู ภาพแสดงโปรแกรมท่ีเกยี่ วขอ้ งกบั การสรา้ งรปู ภาพเคลอื่ นไหว

เกมคอมพวิ เตอรท์ ่วั ไปมกั ใช้รูปภาพกราฟิกท่ีดนู ่าสนใจ
โดยปัจจุบันจะพบเกมในลักษณะสามมิติ มากกว่าสองมิติ ซึ่งมี
การใช้เสียง ข้อความ วิดีโอรวมไปถึงอินเทอร์เน็ตในเกม
ออนไลน์ทำให้เกมคอมพิวเตอรม์ ีการโต้ตอบกบั ผเู้ ลน่ อีกฝ่ังของ
เครื่องคอมพิวเตอร์ ได้รวดเร็ว ซึ่งเรียกว่า ระบบมัลติมีเดีย (Multimedia System) คือมีการนำ
ข้อมูลหลายอยา่ งมาผสมผสานกนั แล้ว ให้ผู้เล่น เป็นผู้ควบคุมตัวละครได้ตามใจชอบ ในสมัยก่อนเกม
มักจะใชส้ ีจำนวน 8 บติ และ 16 บติ ปัจจบุ นั มีการ เปล่ยี นมาใช้สีจานวน 24 บิต 32 บิต และ 64 บิต
ส่งผลใหภ้ าพกราฟิกท่ีแสดงในเกมมีสสี ันมากข้ึน ทำใหเ้ กมดูสมจริงและสวยงาม ในตา่ งประเทศมีการ
จดั ลำดับเกมทเี่ หมาะสมกบั อายขุ องผ้เู ล่นเกมด้วย

ตัวอยา่ งเกมคอมพิวเตอร์ที่ใชร้ ปู ภาพกราฟิกทด่ี นู า่ สนใจ

เกมในปจั จุบนั เนน้ ความสวยงามของกราฟิกในเกมเพ่ือทำให้ผู้เล่นเกมเกิดความสนใจ และให้
ความสำคัญของเน้ือเรอ่ื งในเกมเปน็ เร่ืองรอง

เกมมารโิ อเป็นเกมทม่ี กี ารพฒั นากราฟิกจากสองมติ ิ เปน็ สองจดุ หา้ มติ ิ และสามมติ ิ

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

โปรแกรมที่เกี่ยวข้องกับการสร้างเกม ได้แก่ โปรแกรม RPG Maker, The 3DGameMaker,
XN4 Game Studio Creators

รูปภาพตวั อยา่ งโปรแกรมท่ีเกีย่ วขอ้ งกบั การสร้างเกม

5. การประยกุ ต์ด้านการศกึ ษา
ด้านการศึกษาที่มีการนำคอมพิวเตอร์มาใช้ในงานช่วยสอนเรียกว่า คอมพิวเตอร์ช่วยสอน
หรือ CAI (Computer Aided Instruction) ในสาขาวิชาต่างๆ เช่น ดนตรี กีฬา คอมพิวเตอร์ หรือ
การเรียนรู้ภาษาต่างๆ การใช้คอมพิวเตอร์ชว่ ยสอนมีข้อดีคือสามารถทบทวนเนื้อหาในสว่ นท่ีไมเ่ ข้าใจ
ก็ย้อนกลับมาดูบทเรียนก่อนหน้าได้ แต่ข้อเสียคือไม่มีผู้ชี้แนะหากมีข้อสงสัยในเนื้อหาที่เรียนจะ ไม่
สามารถสอบถามได้ ขั้นตอนในการใช้คอมพิวเตอร์ช่วยสอนนั้นสามารถมีข้อสอบเพื่อทดสอบ เรื่องที่
เรยี นแตล่ ะบทวา่ ผเู้ รยี นมีความเขา้ ใจในเนื้อหาที่เรียนมากน้อยเพียงใด หากผเู้ รยี นไดค้ ะแนนนอ้ ย ก็ให้
กลบั ไปเรยี นร้เู น้อื หาบทเดมิ แลว้ กลับมาทำข้อสอบใหม่จนได้คะแนนทีด่ ขี ึน้

รูปภาพตัวอยา่ งวชิ าที่มีในคอมพวิ เตอรช์ ว่ ยสอน

โปรแกรมที่เกี่ยวข้องกับการประยุกต์ด้านการศึกษา ได้แก่ โปรแกรม Authorware,
Camtasia Studio, ToolBook

รูปภาพโปรแกรมทเี่ กี่ยวขอ้ งกบั การประยกุ ตด์ ้านการศึกษา

6. การประยุกตด์ ้านอ่นื ๆ
ในชีวิตประจำวันยังมีกราฟิกอีกมากท่ีแฝงไปกับสื่ออื่นที่อาจไม่รู้ตัว เช่น การนำไปประยุกต์
ในงานออกแบบลวดลายบนผา้ แผนท่ี กราฟและแผนภาพ ภาพศิลปจ์ ากคอมพวิ เตอรก์ ราฟกิ

ภาพที่ได้จากเครื่องสแกน (Scanner) การจําลอง
สถานการณ์ รายการวิดโี อ ระบบสร้างภาพความจริง
เสมือน รวมไปถึงการใช้กราฟิกในด้านลบ เช่น ตัด
ต่อภาพเพื่อทำให้เสื่อมเสียชื่อเสียง,เว็บไซต์ลามก
เว็บไซตโ์ ฆษณาหลอกลวง ซึง่ ผรู้ ับสื่อต้องพิจารณาถึง
แหล่งท่มี าวา่ มีความน่าเชื่อถอื หรอื ไม่

รูปภาพแสดงการประยกุ ตก์ ราฟิกนด้านอนื่ ๆ

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

แบบประเมนิ ผลหลงั เรียนหนว่ ยที่ 1

คำส่งั จงเลอื กคำตอบที่ถกู ตอ้ งเพยี งข้อเดยี ว

1. คำวา่ ทฤษฎีคอมพวิ เตอร์กราฟิกส์ ถกู บัญญัตไิ ว้ในศัพท์คอมพิวเตอร์และเทคโนโลยสี ารสนเทศ ฉบับ

ราชบณั ฑิตยสถานวา่ ขอ้ ใด

ก. เรขภาพคอมพวิ เตอร์ ข. แอนิเมชนั คอมพิวเตอร์

ค. กราฟิกสค์ อมพวิ เตอร์ ง. ดีไซนค์ อมพิวเตอร์

2. ข้อใดคือทมี่ าของคำวา่ กราฟกิ (Graphic)

ก. Graphikos + Chic ข. Graphikos + Graphein

ค. Graphikos + GrapChic ง. Grap + Chic

3. ขอ้ ใดหมายถึงส่อื กราฟิก

ก. โปรแกรมภาพกราฟิก

ข. ศาสตรแ์ หง่ ความคดิ เพือ่ ให้เกดิ ความพอใจด้านต่างๆ

ค. ตราสญั ลักษณท์ อ่ี อกแบบเพือ่ ความสวยงาม

ง. การอธบิ ายดว้ ยภาพประกอบข้อมลู

4. กราฟิกถกู แบ่งออกเป็นกป่ี ระเภท อะไรบ้าง

ก. 2 ประเภท คอื กราฟิกวาดภาพและกราฟิกแอนเิ มชนั

ข. 2 ประเภท คอื กราฟกิ ดไี ซนแ์ ละกราฟกิ แอนิเมชนั

ค. 2 ประเภท คือ กราฟิกวาดภาพและกราฟกิ นำเสนอ

ง. 2 ประเภท คือ กราฟกิ ดไี ซนแ์ ละกราฟกิ นำเสนอ

5. ขอ้ ใดคอื ประเภทกราฟกิ ที่ได้จากการใชโ้ ปรแกรมไมโครซอฟต์เพนต์

ก. กราฟกิ ดีไซน์ ข. กราฟกิ นำเสนอ

ค. กราฟกิ วาดภาพ ง. กราฟกิ แอนเิ มชัน

6. “โปรแกรมอะโดบโี ฟโตช็อป (Adobe Photoshop) คือโปรแกรมกราฟิกท่ีมาพรอ้ มกับไมโครซอฟต์

วนิ โดวส"์ ข้อความดังกลา่ วถกู ต้องหรอื ไม่ เพราะเหตใุ ด

ก. ถกู ตอ้ ง เนื่องจากปัจจุบันไมโครซอฟต์ วินโดวส์เซเวน่ มโี ปรแกรมนอ้ี ยดู่ ว้ ย

ข. ถกู ต้อง เน่อื งจากโปรแกรมอะโดบีโฟโตชอ็ ปถูกแปลงเป็นโปรแกรมเพื่อนำเสนอในปจั จุบัน

ค. ไม่ถกู ต้อง เนือ่ งจากโปรแกรมอะโดบีโฟโตขอปเปน็ โปรแกรมทีต่ ้องติดตงั้ เพ่ิม

ง. ขอ้ ก. และ ข. ถกู
7 ขอ้ ใดคอื ลักษณะของ “ขอ้ มูลแบบส่ือประสม” (Multimedia Data)

ก. ประกอบด้วยภาพ กราฟิก และเสยี ง
ข. ประกอบดว้ ยเสยี ง วดิ ีโอ และจดุ เชื่อมโยง
ค. ประกอบด้วยขอ้ ความ กราฟกิ และภาพ
ง. ถกู ทุกข้อ
8. ขอ้ ใดเปน็ สาเหตใุ ห้มกี ารใช้ข้อความร่วมกับภาพกราฟิก
ก. เพือ่ ความสวยงามมากขึ้น
ข. ส่อื สารให้มีความเขา้ ใจตรงกนั
ค. เพื่อใหค้ รบองค์ประกอบของลกั ษณะส่ือประสม
ง. ไมม่ ีข้อใดถกู
9. ขอ้ ความใดตอ่ ไปน้ีเปน็ ลกั ษณะของภาพกราฟิกทีด่ ี
ก. มีตัวอักษรประกอบเพื่อความชัดเจนและครบถ้วนในองค์ประกอบกราฟิก
ข. ตัวอกั ษรควรเปน็ ภาษาอังกฤษเทา่ นั้นเพอื่ ความเป็นสากล
ค. เลือกข้อมูลสอ่ื ประสมที่เหมาะสม โทนสีดสู บายตาและเป็นเอกลกั ษณ์
ง. ควรเนน้ ภาพแอนิเมชันเพ่ือสอดคล้องกบั สิง่ ที่ต้องการสอ่ื สาร
10. “กราฟกิ ที่ใหม่และแตกต่างจะช่วยเสรมิ การเรยี นรู้ได"้ ถูกตอ้ งหรอื ไม่ เพราะเหตุใด
ก. ถกู ต้อง เพราะกราฟิกแบบใหม่อาจจะดงึ ดูดความสนใจได้มากขึน้
ข. ถูกต้อง เพราะกราฟกิ แบบใหม่อาจพฒั นาจากรูปแบบเดมิ เพ่อื ความเข้าใจมากข้นึ
ค. ไม่ถกู ต้อง เพราะกราฟกิ แบบใหม่จะทำลายวัฒนธรรมแบบเก่าไป
ง. ขอ้ ก. และ ข. ถูก

ใบงานที่ 1.1

คำสั่ง จัดหารายละเอียด โปรแกรมสำหรับงานกราฟิกที่น่าสนใจ กำหนดให้ห้ามทำโปรแกรมซ้ำกนั
เมื่อจัดทำเรียบร้อยแล้วให้นำเสนอโปรแกรมละ 5-10 นาที ผู้ที่ฟังการนำเสนอให้จด
รายละเอยี ดของการนำเสนอ และซักถามเพิ่มเตมิ ในกรณที ่ีมขี ้อสงสยั

หวั ขอ้ รายละเอียดโปรแกรมสำหรับงานกราฟกิ ทนี่ ่าสนใจมดี ังน้ี
1. ช่ือโปรแกรมกราฟกิ
2 รุ่นของโปรแกรม
3 ขนาดไฟล์
4 ประวัตคิ วามเปน็ มาของโปรแกรม และบรษิ ทั ที่สรา้ งโปรแกรมกราฟิก
5 ความต้องการของโปรแกรมขนั้ ตำ่
6. ความสามารถของโปรแกรมพ้นื ฐาน
7. แหลง่ ข้อมูลอ้างอิง
8. ผู้จดั ทำ

ตัวอย่างใบงานท่ี 1

ชื่อโปรแกรมกราฟกิ : Adobe Photoshop รุ่นของโปรแกรม: Extended ขนาดไฟล์: 979.9 MB
CS5

ประวตั ิความเป็นมาของโปรแกรม รวมไปถงึ บรษิ ัทท่สี ร้างโปรแกรมกราฟกิ :

โปรแกรม Photoshop เวอรช์ นั แรกนัน้ เร่มิ ตน้ สร้างขึน้ ในปี ค.ศ. 1990 จากบริษัท Adobe และได้รับการพัฒนา
มาเรื่อยๆ จากเวอร์ชัน 2, 2.5, 3, 4, 5, 5.5 เวอร์ชัน 6, 7, CS จนถึงเวอร์ชั่นล่าสุดในปัจจุบัน ที่เรียกกันว่า
เวอร์ชัน CS5 Extend โดยได้ทำการเพิ่มประสิทธิภาพการจัดการกับภาพกราฟิกข้ึนเรื่อยๆ จากเดิมที่เน้นใช้งาน
เพื่อการสรา้ งภาพสิ่งพิมพ์ ก็หันมาเน้นเกี่ยวกับการจัดการภาพกราฟิกที่ใช้บนเว็บมากยิ่งขึ้น และนอกจากนี้แล้ว
ยงั ไดส้ ร้างโปรแกรม Image Ready ซึ่งเปน็ โปรแกรมทใี่ ชส้ รา้ งภาพเคลอ่ื นไหวควบคมู่ ากับโปรแกรม Photoshop
อีกดว้ ย เพอ่ื เพม่ิ ความสามารถเกยี่ วกบั การทำภาพกราฟิกท่ีใช้สำหรับการทำเวบ็ ไซต์โดยเฉพาะ
ความต้องการของโปรแกรมขน้ั ตำ่ :

• Windows ซพี ียขู น้ั ต่ำ Intel® Pentium 4 or AMD Athlon 64 processor

• Microsoft® Windows® XP with Service Pack 3; Windows Vista® Home Premium,
Business, Ultimate, or Enterprise with Service Pack 1 (Service Pack 2 recommended); or
Windows 7

• แรม 1GB หรอื สงู กวา่

• พน้ื ทีว่ า่ งของฮารด์ ดสิ ก์ 1GB สำหรับลงโปรแกรม

• หน้าจอขนาด 1024x768 (ขนาดของจอที่เหมาะสมคือ 1280x800) และมีการ์ดจอเป็น OpenGL
graphics, 16-bit color, และ 256MB of VRAM

• ไดรฟ์ DVD-ROM

• อินเทอร์เน็ตความเรว็ สงู สำหรับอพั เดตโปรแกรม
ความสามารถของโปรแกรมพ้นื ฐาน:

1. ตกแตง่ หรอื แก้ไขรปู ภาพ ตัดต่อภาพบางสว่ น หรอื ที่เรียกว่า crop ภาพ
2. เปลี่ยนแปลงสขี องภาพ จากสีหนึง่ เป็นอกี สีหนึ่งได้
3. สามารถลากเส้นแบบฟรีสไตล์ หรือใสร่ ปู ภาพ สเ่ี หลีย่ ม วงกลม หรือสร้างภาพไดอ้ ย่างอสิ ระ
4. มกี ารแบ่งชน้ั ของภาพเปน็ Layer สามารถเคล่ือนย้ายภาพไดเ้ ป็นอิสระตอ่ กนั
5. การทำ cloning ภาพ หรอื การทา่ ภาพซ้ำในรูปภาพเดียวกนั
6. เพ่มิ เตมิ ขอ้ ความ ใส่ effect ของข้อความได้
7. Brush หรอื แปรงทาสี ท่ีสามารถเลือกรูปแบบสำเรจ็ รปู ในการสร้างภาพได้
8. สามารถสร้างภาพเคล่อื นไหวและสนบั สนุนรปู ภาพสามมติ ิ

9. มี Plug-In ทส่ี ามารถไปหาดาวนโ์ หลดมาเสริมโปรแกรมได้

แหล่งขอ้ มลู อ้างอิง:

1 http://www adobe cm
2 http://www thainextstep.com
3 http://www.it-guides.com

ผู้จดั ทำ:

ชือ่ -นามสกุลของผู้จัดทำ หากมีการทำเป็นกล่มุ ใหเ้ ขยี นชื่อกล่มุ หรอื เลขที่กล่มุ

ใบงานท่ี 1.2

คำสั่ง ค้นคว้าหารูปภาพที่เกี่ยวข้องกับคอมพิวเตอร์กราฟิก การประยุกต์การใช้งานคอมพิวเตอร์ใน
งานดา้ นต่างๆ น้นั มอี ยู่ 5 หวั ขอ้ คือ
1. การประยุกต์ตา้ นการออกแบบ
2. การประยุกต์ดา้ นสิ่งพมิ พ์
3. การประยกุ ต์ด้านการแพทย์
4. การประยุกต์ด้านบันเทงิ
5. การประยุกต์ด้านอื่นๆ กำหนดให้หาหัวข้อละ 3 รูปภาพ โดยหาจากหนังสือพิมพ์ นิตยสาร

วารสาร หรอื ในอนิ เทอร์เนต็ เม่ือหารูปภาพไดแ้ ลว้ ให้เขียนว่ารูปภาพนน้ั เป็นรูปภาพการประยุกต์ด้าน
ใด และอธบิ ายพอสังเขป

หน่วยการเรียนรูท้ ี่ 2 หลกั การทำงานและการแสดงผลของภาพคอมพิวเตอรก์ ราฟิก

แนวคิด
การแสดงผลของภาพคอมพิวเตอร์กราฟิกส์มีความสำคัญกับงานที่สร้างเป็นอย่างมาก

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

สาระการเรียนรู้
1.ประเภทของภาพกราฟิก
2. ระบบสี (Color Model)
3. ชนิดของไฟลร์ ปู ภาพ
4. ความละเอียดรปู ภาพ (Resolution)
5.การจดั เตรียมรปู ภาพเพ่ือนำมาใช้งาน
6.การติดตั้งโปรแกรม Adobe Photoshop CS4
7. การปรับร่นุ โปรแกรมผ่านอินเทอรเ์ น็ต

ผลการเรยี นรทู้ ่คี าดหวัง
1. บอกประเภทของภาพกราฟิกได้
2. อธิบายระบบสี (Color Model) ได้
3 บอกชนิดของไฟลร์ ูปภาพได้
4. อธิบายความละเอียดรูปภาพ (Resolution) ได้
5. จดั เตรยี มรปู ภาพเพ่ือนำมาใช้งานได้
6. ติดตงั้ โปรแกรม Adobe Photoshop CS4 ได้
7 ปรบั รุ่นโปรแกรมผา่ นอินเทอรเ์ น็ตได้

แบบประเมินผลกอ่ นเรยี นหน่วยท่ี 2

คำสงั่ จงเลอื กคำตอบท่ถี กู ต้องเพยี งข้อเดียว
1. ขอ้ ใดคือความหมายของคำวา่ เวกเตอรก์ ราฟิกส์ (Vector Graphics)

ก. ภาพทเี่ กิดขน้ึ เกิดจากการกำหนดพกิ ดั และการคานวณค่าบนระนาบหนงึ่ มติ ิ
ข. ภาพท่เี กิดขนึ้ เกดิ จากการกำหนดพกิ ดั และการคำนวณค่าบนระนาบสองมติ ิ
ค. ภาพท่ีเกดิ ขน้ึ เกดิ จากการกำหนดพิกัดและการคำนวณค่าบนระนาบท่ีมีมิติ
ง. ภาพที่เกดิ ขึ้นเกดิ จากการกาหนดพิกัดและการคานวณคา่ บนระนาบท่ีไมม่ ีมิติ
2. ข้อใดคือความหมายของคำว่า ราสเตอรก์ ราฟิกส์ (Raster Graphics)
ก. รปู ภาพที่ประกอบข้ึนดว้ ยจุดสี (Pixel) ต่างๆ
ข. รูปภาพทป่ี ระกอบขึน้ ดว้ ยเวกเตอร์กราฟิกส์ (Vector Graphics) ตา่ งๆ
ค. รปู ภาพทปี่ ระกอบขึ้นด้วยโปรแกรมกราฟิกตา่ งๆ
ง. รูปภาพท่ีประกอบขึน้ ด้วยไฟลน์ ามสกลุ รปู ภาพหลายๆ ไฟล์
3. ขอ้ ใดคือลักษณะของภาพแบบ Resolution Dependent
ก. เมอื่ ขยายภาพมีลักษณะเป็นตารางเล็กๆ
ข. เมื่อเพ่ิมความละเอียดจะทำใหภ้ าพมีขนาดใหญ่
ค. ส่วนใหญ่เป็นไฟลส์ กุล EPD
ง. ขอ้ ก. และ ข. ถกู
4. โมเดลใดมแี นวคดิ มาจากการผสมแสงสหี ลกั 3 สีเข้าดว้ ยกนั
ก. โมเดลซีเอม็ วายเค
ข. โมเดลอารจ์ บี ี
ค. โมเดลแอลเอบี
ง. ไมม่ ขี ้อใดถูก
5. นกั วิทยาศาสตรท์ า่ นใดเปน็ ผู้คิดคน้ ผลกึ ปริซึม
ก. เซอร์ไอแซก นิวตนั
ข. จอห์น สมิธ
ค. กาลเิ ลโอ
ง. โทมัส แอลวา เอดสิ นั
6. ข้อใดเป็นรูปภาพกราฟิกท่ีนยิ มนำมาใช้ในการแทรกภาพลงในเอกสาร
ก. ไฟลท์ มี่ นี ามสกลุ เป็น JPEG

ข. ไฟลท์ ่มี ีนามสกุลเป็น GIF
ค. ไฟล์ท่ีมีนามสกุลเป็น PNG
ง. ถกู ทุกขอ้
7. ขอ้ ใดส่ือให้เหน็ ถงึ ความสำคัญของการมองเห็นของรูปภาพกบั การมองเหน็ ของมนษุ ย์
ก. สิบปากวา่ ไม่เท่าตาเห็น
ข. ตาบอดไดแ้ ว่น
ค. คำพดู พนั คำกไ็ มเ่ ท่ากับรูปภาพเพียงภาพเดียว
ง. ขอ้ ก. และ ค. ถูก
8. ขอ้ ใดคือปัญหาทอี่ าจตามมาเมอื่ นำภาพจากเว็บเพจอ่ืนมาใช้งาน
ก. ไฟลภ์ าพมีการขยายตัวเม่อื เวลาผ่านไป
ข. สีของภาพที่ผิดเพยี้ น
ค. ความสมบรู ณ์ของภาพ
ง. ลขิ สทิ ธิข์ องภาพ
9. โปรแกรมใดแสดงภาพแบบ Bitmap
ก. Illustrator
ข. Adobe PhotoShop
ค. AutoCAD
ง. Freehand
10. เหตุใดจงึ นยิ มใช้ฟอร์แมตที่มีการบบี อัดภาพสำหรับงานแสดงผลในเว็บเพจ
ก. เพอื่ เพม่ิ มิติของภาพ
ข. เพอ่ื ลดขนาดของภาพ
ค. เพื่อเพม่ิ คุณภาพของภาพ
ง. เพ่ือเพ่ิมความละเอยี ดของภาพ

ประเภทของภาพกราฟกิ

ภาพกราฟิกสามารถแบ่งได้ออกเป็น 2 ประเภท คือ เวกเตอร์กราฟิกส์ (Vector Graphics)
และ ราสเตอร์กราฟิกส์ (Raster Graphics) การเลือกชนิดรูปภาพที่เหมาะสมกับประเภทของ
ภาพกราฟิก เปน็ สง่ิ สำคัญหนึ่งทจ่ี ะทำให้ผลงานดนู ่าสนใจ

รปู ภาพแสดงภาพแบบ Vector Graphics รูปภาพแสดงภาพแบบ Raster Graphics

1. เวกเตอร์กราฟิกส์ (Vector Graphics)
รูปภาพในลักษณะเวกเตอรก์ ราฟกิ สเ์ ป็นรปู ภาพที่ถูกสรา้ ง
โดยโปรแกรมคอมพวิ เตอร์ โดยภาพทีเ่ กิดขึน้ เกดิ จากการกำหนดพิs
กดั มมุ ระยะทางและการคำนวณค่าบนระนาบสองมิติ ตามทฤษฎี
เวกเตอร์ ในทางคณิตศาสตร์ ในการกอ่ ให้เกิดเป็นเส้น หรือรูปภาพ
ข้อดีคอื สามารถย่อขยายได้ โดยคณุ ภาพไมเ่ ปล่ียนแปลง ข้อเสยี คอื
ภาพไมเ่ หมือนภาพจริงเปน็ ได้เพยี งภาพวาด หรือใกลเ้ คียงภาพถ่ายเท่านัน้ ข้อมลู ภาพพวกน้ีได้แก่ไฟล์

สกลุ EPD, WMF, CDR, AI, CGM, DRW, PLT และฟอนต์แบบ TrueType
ต่างๆ เป็นต้น โดยมีโปรแกรมประเภท วาดรูป (Drawing Program) เช่น
CorelDraw หรือ AutoCAD เป็นโปรแกรมสร้างขณะที่บนแมคอินทอชใช้
Illustrator และ Freehand ในบางครั้งภาพเวกเตอร์กราฟิกยังอาจ
หมายถึงกราฟิกสามมติ ิอกี ด้วย

รูปภาพแสดงตัวอยา่ งเวกเตอรก์ ราฟกิ ส์ รูปภาพแสดงภาพแบบ Vector Graphics

ตวั อยา่ งโปรแกรมท่ใี ชส้ รา้ งเวกเตอรก์ ราฟกิ ส์ Vector Graphics

2. ราสเตอร์กราฟิกส์ (Raster Graphics)
Raster Graphics หรือ Bitmap เปน็ ภาพแบบ Resolution Dependent
เป็นรูปภาพท่ปี ระกอบข้ึนดว้ ยจดุ สี (Pixel) ต่างๆ ท่ีมีจำนวนคงท่ี ซึง่ หาก
ขยายภาพ Bitmap จะเห็นวา่ มีลักษณะ เป็นตารางเล็กๆ ซึ่งแตล่ ะบติ คือ
ส่วนหน่ึงของข้อมูลคอมพิวเตอร์ เนือ่ งจาก Bitmap มีค่า Pixel จำนวนคง
ท่ีจึงทำให้มีข้อจำกัดในเรือ่ งการขยายขนาดภาพการเปล่ยี นขนาดภาพทำ
โดยเพิ่มหรือลด Pixel จากที่มีอยู่เดิม เมื่อขยายภาพให้ใหญ่ขึ้น ความ
ละเอียดของภาพกลับเท่าเดิม และถ้าเพิ่มค่าความละเอียดมากขึ้น ก็จะทำให้ไฟล์มีขนาดใหญ่และ
เปลืองเนื้อที่หน่วยความจำมากขึ้นภาพที่ขยายใหญ่ขึน้ จะมองเห็นเป็น ตารางสี่เหลี่ยมเรียงต่อกัน ทำ
ให้ขาดความสวยงาม

รูปภาพตัวอยา่ งราสเตอรก์ ราฟิกส์ (Raster Graphics)

ภาพแบบ Bitmap จึงเหมาะสำหรับงานกราฟิกในแบบที่ต้องการให้แสงเงาในรายละเอียด
เป็นไฟล์ที่เหมาะกับการทำงานกับภาพเหมือนจริงประเภทภาพถ่าย เนื่องจาก Bitmap มี Channel
พเิ ศษเรยี กวา่ Alpha Channel ซึ่งเป็น 32 bits หรือ true color คอื สสี มจรงิ เชน่ ภาพท่ีนำมาใช้กับ

โปรแกรม Adobe Photoshop จะเป็นภาพเหมือนภาพถ่าย เพราะ
ไฟล์ที่ได้จาก Adobe Photoshop เป็น Bitmap ในขณะที่ไฟล์ที่สร้าง
จาก Illustrator จะเหมือนการ์ตูนหรือภาพเขียนเพราะเป็นไฟล์แบบ
Vector และภาพแบบ Bitmap ยังเหมาะสำหรบั ภาพท่ีต้องการระบาย
สี สร้างสหี รือกำหนดสีทีต่ อ้ งการความละเอยี ดและสวยงาม
ไฟลภ์ าพแบบ Bitmap คือไฟลท์ มี่ นี ามสกุล .BMP, .PCX, .TIF, .GIF, .JPG, .MSP, .PCD เป็น
ต้น สำหรับโปรแกรมที่ใช้สร้างกราฟิกประเภทนี้คือ โปรแกรม Paint, Paint.net, gimp, Adobe
Photoshop, CorelDraw เป็นตน้

รปู ภาพตัวอยา่ งราสเตอร์กราฟกิ ส์ (Raster Graphics)

รูปภาพตัวอยา่ งโปรแกรมสร้างภาพแบบราสเตอรก์ ราฟิกส์

ความแตกต่างระหว่างกราฟิกแบบ Raster และ Vector

Raster Vector

1. องคป์ ระกอบภาพประกอบข้ึนด้วยจุดตา่ งๆ 1. ใช้สมการทางคณิตศาสตรเ์ ป็นตวั สร้างภาพ

โดยรวมเอา Object (เชน่ วงกลม เส้นตรง)

ตา่ งชนดิ มาผสมกัน

2. ภาพมีจำนวนพิกเซลคงทจ่ี งึ ต้องการคา่ ความ 2. สามารถยอ่ และขยายขนาดไดม้ ากกว่าโดย

ละเอียดมากขึน้ เมื่อขยายภาพ โดยจะ สัดสว่ นลักษณะของภาพ และความละเอยี ด

คำนวนค่าสที ลี ะพกิ เซลทำให้ภาพแตกเมอ่ื ไมเ่ ปล่ียนแปลง

ขยายภาพใหใ้ หญ่

3. เหมาะสำหรับงานกราฟิกในแบบต้องการให้ 3. เหมาะสำหรับงานจำพวกวาง Layout งาน

แสงเงาในรายละเอียด พมิ พ์ตัวอักษร Line Art หรอื Illustration

4. แสดงภาพบนจอทันที เม่ือรับคำสั่งยา้ ย 4. คอมพวิ เตอร์จะใช้เวลาในการแสดงภาพ

ขอ้ มลู จากหนว่ ยความจำที่เก็บไปยัง มากกวา่ เนื่องจากต้องทำตามคำสั่งทม่ี ี

หน่วยความจำของจอภาพ จำนวนมากกวา่

รปู ภาพแสดงความแตกต่างระหว่างกราฟิกแบบ Vector และ Raster

ระบบสี (Color Model)

ระบบสี คอื ระบบจําลองซ่ึงสร้างข้นึ เพ่ืออธบิ ายสที ่ีมนุษยส์ ามารถมองเหน็ โดยแยกสีออก
เปน็ องค์ประกอบพ้นื ฐานต่างๆ ดังนี้

1. โมเดลอารจ์ บี ี (Model RGB)
โมเดลนีไ้ ดแ้ นวคิดมาจากการผสมแสงสีหลกั 3 สเี ข้าด้วยกัน คือ แดง (Red) เขยี ว (Green)
และนำ้ เงนิ (Blue) จะทำให้เกิดสตี า่ งๆ ได้จำนวนมาก โดยข้ึนกบั สดั ส่วนความเขม้ ของสีหลกั แตล่ ะสี
ทีม่ คี ่าให้ตงั้ แต่ 0-255 (ในระบบสีที่ใช้ข้อมลู แบบ 8 บติ ) และเม่ือสหี ลักท้ังสามท่ีมีความเข้มข้น สงู สุด
มาผสมกนั ก็จะไดส้ ีขาว ซ่ึงลักษณะเชน่ นีเ้ รยี กว่า การผสมสีแบบบวก (additive color system)

WHITE

Model RGB: สตี า่ งๆ เกดิ จากการผสมของแสงสหี ลกั 3 สี คือ
สแี ดง (Red) สีเขยี ว (Green) และสนี ้ำเงนิ (Blue)

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

Model RGB: สตี ่างๆ เกิดจากการผสมของสี 3 สี ซึ่งเป็นสีแสง
จากรูปภาพเปน็ การแสดงผลบนระบบปฏบิ ตั ิการ Windows 7

2. โมเดลซีเอ็มวายเค (Model CMYK)
โมเดลน้เี กดิ ข้นึ จากระบบการพมิ พ์แบบแยกสี โดยภาพจะถูกแยกออกเปน็ แมพ่ ิมพ์ของสหี ลัก
เพยี ง 4 สี คือ ฟ้า (Cyan) ม่วงแดง (Magenta) เหลอื ง (Yellow) และดำ (Black) เม่ือพิมพส์ เี หลา่ นี้
ซ้อนกันก็จะได้ภาพบนหน้ากระดาษตามตน้ ฉบบั ค่าของสหี ลักในโมเดลน้ีอยู่ในรูปเปอร์เซ็นตข์ อง
น้ำหนกั หมกึ พมิ พ์ต้ังแต่ 0-100%

Model CMYK: สตี า่ งๆ เกิดจากการผสมของสีหลกั คือ สีฟ้า (C) สมี ว่ งแดง (M) และสเี หลอื ง (Y)
ซึ่ง 3 สีนี้ไม่สามารถแสดงผลเป็นสดี ำ (K) ได้ จงึ ต้องเพ่มิ สดี ำเพ่ือใหส้ ามารถพิมพ์งานสขี าวดำได้

รปู ภาพที่เกดิ จากการพิมพ์ 4 สี ตอ้ งใช้ระบบ CMYK

3. โมเดลแอลเอบี (Modes LAB)
เปน็ ค่าสีท่ีถูกกำหนดขน้ึ โดย CIE (Commission Internationaled Ecclairage) ใหเ้ ป็น
มาตรฐาน การวดั สที กุ รูปแบบ ครอบคลุมทุกสีใน RGB และ CMYK และใชก้ ับสีทีเ่ กิดจากอปุ กรณ์ทกุ
อย่าง เช่น Monitor, Printer, Scanner สว่ นประกอบของโหมดสีได้แก่

รปู ภาพประกอบ Model LAB

Luminance Model (L) คือ ความสวา่ ง
A หมายถึง ส่วนประกอบท่ีแสดงการไลส่ ีจากสีเขียวไปยงั สแี ดง
B หมายถงึ ส่วนประกอบทแ่ี สดงการไล่สจี ากสีน้ำเงนิ ไปถึงสีเหลือง

รูปภาพแสดงอุปกรณ์ทเี่ ก่ียวขอ้ งกบั Model LAB

4. โมเดลเอชเอสบี (Model HSB)
Model HSB คือหลกั การมองเห็นสดี ้วยสายตาของมนุษย์ เปน็ พืน้ ฐานการมองเหน็ สตี ามปกติ

จาก สายตามนุษย์ Model HSB จะประกอบขนึ้ ดว้ ยลกั ษณะของสี 3 ลกั ษณะ

รปู ภาพแสดง Model HSB

1) Hue เปน็ สีท่สี ะท้อนมาจากสขี องวตั ถุซ่ึงแตกต่างกนั ตามความยาวของคลนื่ แสงท่มี า
กระทบ วัตถุ และสะท้อนกลับมาทีต่ าของเรา Hue ถูกวดั โดยตำแหน่งบน Standard Color Wheel
ซง่ึ ถกู แทนด้วยองศาคือ 0 ถึง 360 องศา แตโ่ ดยการใช้ทั่วไปแลว้ จะเปน็ การเรียกสีนน้ั เลย เช่น สแี ดง
สีมว่ ง สเี หลือง

2) Saturation เป็นคา่ ของความเขม้ ข้นและความจางของสี Saturation คือสัดส่วนของสี
Hue ทมี่ ีอยู่ในสีเทา วดั ค่าเป็นเปอร์เซน็ ต์ ดงั นี้ คือจาก 0% (สเี ทา) จนถงึ 100% (full saturation สี
ท่มี ีความอม่ิ ตัวเต็มท่)ี

3) Brightness เป็นคา่ ของความสวา่ งและความมดื ของสี ซ่ึงถกู กำหนดค่าเปน็ เปอรเ์ ซน็ ต์
จาก 0% (สีดำ) ถึง 100% (สีขาว)

รปู ภาพการทำงานของดวงตามนษุ ย์ ซง่ึ ถกู จำลองดว้ ย Model HSB

ความรพู้ ืน้ ฐานเก่ียวกับแสงและสีจากดวงอาทติ ย์
มนุษย์สามารถรสู้ ึกและสัมผัสถึงพลงั งานจากดวงอาทิตย์ได้ 2 รปู แบบ คือ
1) รังสีของแสงสว่าง (Visible Light) ที่สามารถรับรู้ได้ผ่านการมองเห็น ดวงตามนุษย์

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

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

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

เซอร์ไอแซก นิวตัน ผูพ้ ฒั นาทฤษฎสี ีโดยอ้างอิงจากผลสังเกตการณว์ ่า ปริซมึ สามเหล่ียม
สามารถแยกแสงสีขาวออกมาเป็นหลาย ๆ สีใต้ ซ่ึงเปน็ ท่มี าของสเปกตรมั แสงท่ีมองเห็น

รปู ภาพแสดงหญงิ สาวทใี่ สช่ ุดสีทง้ั 7 สี (สรี ้งุ ) ทท่ี ำให้ความรู้สกึ แตกตา่ งกนั

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

2.1 รงั สีเหนอื ม่วง หรอื รงั สีอัลตราไวโอเลต (Ultraviolet)
2.2 รังสใี ตแ้ ดง หรือรงั สีอนิ ฟราเรด (Infrared)

รูปภาพแสดงรงั สเี หนอื มว่ งและรังสใี ต้แดง ท่ีดวงตาของมนุษยไ์ มส่ ามารถมองเห็นได้

ชนิดของไฟลร์ ปู ภาพ

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

ภาพที่เกิดขึ้นจากคอมพิวเตอร์ หรือคอมพิวเตอร์กราฟิกสตางๆ สามารถสร้างความน่าสนใจ
ในเอกสารได้ดีกว่าข้อความ ปัจจุบันได้มีการน่ารูปภาพที่เกิดขึ้นจากคอมพิวเตอร์มาประยุกต์ใช้ ใน
งานด้านตา่ งๆ เช่น โลโกบ้ ริษทั รูปภาพกราฟกิ แผนท่ี แผนผัง กราฟ ซ่งึ การแสดงผลด้วยภาพย่อมสื่อ
ความหมายได้ดี และมีความน่าสนใจมากกว่าข้อความ
สำหรับงานแสดงผลในเว็บเพจหรือบนจอ คอมพิวเตอร์
นั้น นิยมใช้ฟอร์แมตที่มีการบีบอัดเพื่อลดขนาด ของ
ข้อมูล ปัจจุบันรูปภาพกราฟิกที่นิยมนำมาใช้แทรกภาพ
ลงในเอกสารมี 3 ประเภท ได้แก่ ไฟล์ที่มีนามสกุลเป็น
GIF,JPEG และ PNG

1.GIF (Graphics Interchange Format)
ฟอรแ์ มต GIF ถูกพฒั นาขึ้นโดยมจี ดุ มุ่งหมายในการแสดงผลออนไลน์ (อนิ เทอรเ์ นต็ ) , เป็น
หลกั รองรับภาพทมี่ ีจำนวนสีสงู สุด 256 อัลการิทมึ การบีบอดั ข้อมูลของไฟลแ์ บบ GIF น้นั ไม่มกี าร
ลดทอนคุณภาพของภาพลงแต่อย่างใด (lossless) เหมาะสำหรบั ใช้จดั เกบ็ ภาพการ์ตนู ตราสัญลักษณ์
ต่างๆ ท่ีมีความละเอียดของสีสันนอ้ ย แสดงผลได้เร็ว รวมท้ังสนบั สนนุ การแสดง ภาพเคลอื่ นไหวได้
ทำให้เปน็ ภาพชนดิ พ้นื โปร่งใส (Transparency) จึงมคี วามน่าสนใจมากขึ้น มีความสามารถในการ
แสดงผลแบบหยาบ และค่อยๆ ขยายไปสลู่ ะเอียด (Interlace)

ตัวอยา่ งรปู ภาพฟอร์แมต GIF

2. JPEG (Joint Photographic Experts Group)
เปน็ ฟอร์แมตทสี่ ามารถบีบอดั ขอ้ มูลไดส้ ูงสดุ เพราะยอมให้มกี ารสญู เสียข้อมลู สีของภาพไป
บา้ ง (lossy) ทง้ั นี้สามารถกำหนดความสมดุลระหว่างการบบี อัดกบั คณุ ภาพของภาพได้ ไฟล์แบบ
JPEG รองรบั สีจำนวน 16.7 ล้านสที ำใหภ้ าพมีความคมชัดสงู
ไฟล์ JPEG หรือ JPG (Joint Photographic Experts Group) มีนามสกุลเป็น *.jpg เป็น
ไฟล์ชนิดบีบอัด ขอ้ มลู ทมี่ ีขนาดเลก็ มาก เน่ืองจากไฟล์ชนิดน้ีผ่านการบบี อดั ข้อมลู มาก จึงใชเ้ วลาใน
การคลายภาพกลบั มาเพื่อแสดงผลนานกว่าไฟล์ GIF มีระบบการแสดงภาพแบบหยาบแล้วคอ่ ยๆ
ละเอียดชดั เจนขน้ึ แบบ Progressive มีจุดออ่ นที่ไม่สามารถทำพ้นื โปรง่ ใสได้ จึงควรเลือกใชใ้ ห้
เหมาะสม

ตวั อย่างรูปภาพฟอรแ์ มต JPEG

3. PNG (Portable Network Graphics)
ไฟล์ PNG (Portable Network Graphic) ถกู พัฒนาขึน้ เพ่ือเป็นอีกทางเลือกหน่ึงของ
ฟอรแ์ มต GIF (เน่อื งจากฟอร์แมต GIF เปน็ ลขิ สทิ ธ์ขิ อง Compu-Serve ซ่ึงในอดีตคือผู้ให้บรกิ าร
ออนไลน์รายหน่งึ ในสหรัฐอเมรกิ า) ฟอร์แมต PNG รองรบั สีจำนวน 16.7 ล้านสี และกำลงั เป็นท่ี
แพร่หลายในอินเทอร์เน็ต มากข้ึน สำหรบั การบนั ทกึ ไฟล์ภาพเพื่อนำไปใชใ้ นงานสิ่งพิมพ์ หรอื บนั ทกึ ไว้
เพอื่ นำกลับมาตกแตง่ ต่อไปในอนาคตน้ัน ควรใช้ฟอรแ์ มตท่ีสามารถรักษาข้อมูลสีของภาพไวไ้ ดโ้ ดยไม่
ขาดตกบกพร่อง เชน่ ฟอรแ์ มต TIFF หรอื แมก้ ระท่ังฟอร์แมตเฉพาะของโปรแกรม Photoshop คือ
PSD

ตัวอยา่ งไฟลภ์ าพนามสกุล PNG

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

ถา้ ภาพมีขนาดความกวา้ งใหญก่ ว่าเนอ้ื ที่ทตี่ ้องการ ควรปรับขนาดของภาพด้วยโปรแกรม
ตกแตง่ ภาพ ให้มีขนาดภาพเท่าท่ตี ้องการ จะได้ขนาดไฟล์ท่เี ล็กลง

ตารางประเภทไฟล์ และนามสกุลไฟล์รปู ภาพกราฟกิ

ประเภทไฟล์ นามสกลุ
Microsoft Windows Metafile .emf, .wmf
Windows Bitmap .bmp, .dib, .rle
Computer Graphics Metafile .cgm
Graphics Interchange Format .gif
Joint Photographic Experts Group .jpg
Portable Network Graphics .png
Macintosh PICT .pct
Tagged Image File Format .tif
Vector Markup Language .vml
Microsoft Windows Media .avi, .asf, .asx, .rmi, .wma, .wax, .wav

ความละเอียดรปู ภาพ (Resolution)

Resolution คือค่าความละเอียดของภาพ โดยปกตจิ ะมขี นาดวดั เปน็ จดุ ต่อนิ้ว (dpi)
Resolution มากหรือน้อยข้นึ อยู่กับ display ท่ีภาพนั้นแสดง เชน่ มีภาพขนาด 1600 x 1200 pixel
จอคอมพวิ เตอร์จะมคี วามละเอยี ดประมาณ 72 dpi ถ้าจะใชค้ อมพิวเตอร์ท่สี ามารถแสดงภาพนี้ไดท้ ้ัง
ภาพตอ้ งใชจ้ อภาพขนาดกวา้ ง 1600/72 น้วิ x สงู 1200/72 น้วิ ประมาณ 23 x 17 น้ิว เหตผุ ลที่
จอภาพใช้ Resolution 72 dpi เพราะขดี จำกดั ด้านฮารด์ แวรเ์ ร่ืองจากจอภาพใช้การเปล่งแสงในการ
แสดงสี หากใชค้ า่ มากกวา่ นีจ้ ะต้องใชต้ น้ ทุนและความร้อนสงู ขึ้นมาก

ในขณะทง่ี านด้านการพิมพ์ท่ีต้องใช้ Resolution สูงเพราะขนาดหยดหมึกของเคร่อื งพมิ พ์ ใน
ปจั จบุ ันมขี นาดที่เล็กมากๆ ดังน้ันในระยะทาง 1 นิ้วถา้ เราใชจ้ ำนวนเมด็ สีน้อย (dpiนอ้ ย) ภาพที่ได้ ก็
จะหยาบกวา่ ภาพทใ่ี ช้จำนวนเม็ดสมี ากในระยะทาง 1 น้ิวเท่ากนั (dpi มาก)

การตง้ั คา่ Resolution หรือการตัง้ คา่ ความละเอยี ดของงานน้ัน ตอ้ งตั้งให้เหมาะกับงาน คือ
ถา้ จะนำภาพท่ีทำไปใชใ้ นสื่อไหนกต็ ้ังตามความเหมาะสมดังน้ี

งานสง่ิ พมิ พ์ ตัง้ คา่ Resolution = 300 dpi
งานเว็บไซต์ ต้งั ค่า Resolution = 72 dpi
งานแอนิเมชัน ตง้ั คา่ Resolution = 72 dpi
การต้งั ค่า Resolution นอ้ ยกวา่ มาตรฐานจะทำให้ภาพที่ออกมาแตกและเบลอ หากตั้ง
มากกวา่ มาตรฐานจะทำใหเ้ ปลอื ง RAM ในการทำงานยง่ิ งานทม่ี เี ลเยอร์มาก (จำนวนชนั้ ของภาพ
มาก) จะทำให้ เครอื่ งคอมพวิ เตอร์ทำงานได้ชา้ ลง อีกทั้งไม่ไดท้ ำให้ภาพชดั ขนึ้

การจัดเตรียมรูปภาพเพ่อื นำมาใช้งาน

รูปภาพเปน็ ส่วนประกอบทสี่ ำคัญอยา่ งหนึ่งของงาน เพราะตอ้ งทำใหง้ านท่สี ร้างจากรูปภาพ
เดิม น้ันดูน่าสนใจข้ึน โดยปกตแิ ลว้ รปู ภาพท่ีนยิ มนำมาประกอบงานทีน่ ิยมใช้กันมากในปัจจุบันมี
ด้วยกนั 2 นามสกุล คือ ไฟล์นามสกลุ JPG (JPEG) และ GIF

ตวั อยา่ งรูปภาพทีม่ อี ย่ใู น Windows7 ซง่ึ เปน็ ไฟลน์ ามสกลุ JPG

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

การจดั เตรียมรปู ภาพทีน่ ำมาใชง้ านนัน้ สามารถจดั เตรยี มได้หลายวิธี ซงึ่ การจัดหารปู ภาพ
ตอ้ งทำกอ่ นการสร้างงานนำเสนอ และบันทึกในตำแหนง่ ที่ง่ายตอ่ การจดจำ การจัดเตรยี มรปู ภาพ เพ่ือ
นำมาใช้ โดยท่ัวไปสามารถทำได้ดงั นี้

1. สรา้ งรปู ภาพโดยโปรแกรมกราฟิกตา่ งๆ เชน่ Photoshop, Corel Draw เปน็ ต้น ในการ
สร้างแฟ้มข้อมูลรปู ภาพ ซงึ่ จะได้ภาพท่ีตรงกบั ความต้องการ แต่ใช้เวลาในการสรา้ งภาพมากขึ้น

2. เลือกรปู ภาพจากชุดภาพสำเร็จรูป ท่ีมีการวางจำหน่ายในลกั ษณะคลังรูปภาพสำหรบั ทำ
เว็บเพจ (Web ClipArt) ซง่ึ สะดวกรวดเร็วและงา่ ยต่อการใชง้ าน แต่อาจจะไดภ้ าพที่ไมต่ รงกบั ความ
ต้องการมาก

รปู ภาพแสดงการเลือกรูปภาพจากคลงั รปู ภาพซ่งึ สะดวกรวดเรว็ และง่ายต่อการใชง้ าน

3. นำรูปภาพจากโปรแกรมอ่ืน หรอื เวบ็ เพจอืน่ มาใชง้ าน ซึ่งสะดวกรวดเร็วตอ่ การใช้งาน
เชน่ กัน แตอ่ าจเกิดปญั หาดา้ นลขิ สิทธ์ิของภาพ

4. รูปทไ่ี ดจ้ ากการใช้กล้องดจิ ิทลั ถ่ายภาพด้วยตนเอง หรอื รูปภาพทไ่ี ด้มาจากการสแกน โดย
ใชเ้ ครอื่ งสแกนจะได้รปู ภาพท่ีตรงกบั ความต้องการ

รปู ภาพแสดงอุปกรณก์ ลอ้ งดจิ ิทัล และเคร่ืองสแกน

รูปภาพทไ่ี ด้จากกล้องดจิ ทิ ลั และรปู ภาพทไี่ ด้จากเครอ่ื งสแกน

การติดตงั้ โปรแกรม Adobe Photoshop CS4

โปรแกรม Adobe Photoshop CS4 เป็นโปรแกรมที่ใชส้ ร้างภาพกราฟกิ ตดั ต่อ แกไ้ ข
เคลอื่ นย้ายรูปภาพ ในโปรแกรมรุ่นใหม่ยังรองรับรูปภาพที่มลี กั ษณะสามมติ ไิ ด้ การตดิ ต้ังโปรแกรม
Adobe Photoshop CS4 จากแผน่ DVD ลงเครอื่ งคอมพิวเตอรร์ ะบบปฏบิ ตั ิการ Windows 7 ทำได้
ดงั นี้

1. เมือ่ ใสแ่ ผ่น DVD แลว้ ให้ไปที่ Computer

รูปภาพแสดงการเข้า Computer และเลอื ก Drive DVD (ในภาพคอื E:)

2. เลือกท่ี Setup.exe เพื่อติดตั้งโปรแกรมแล้วรอสักครู่

รปู ภาพแสดงการตดิ ตง้ั โปรแกรม