งานนำเสนอกำลังจะดาวน์โหลด โปรดรอ

งานนำเสนอกำลังจะดาวน์โหลด โปรดรอ

วิชาโปรแกรมกราฟิก. หน่วยที่ 1 ความรู้เบื้องต้นเกี่ยวกับคอมพิวเตอร์กราฟิก หน่วยที่ 2 ภาพ 2 มิติ และ 3 มิติ หน่วยที่ 3 การใช้งานโปรแกรม Adobe Photoshop.

งานนำเสนอที่คล้ายกัน


งานนำเสนอเรื่อง: "วิชาโปรแกรมกราฟิก. หน่วยที่ 1 ความรู้เบื้องต้นเกี่ยวกับคอมพิวเตอร์กราฟิก หน่วยที่ 2 ภาพ 2 มิติ และ 3 มิติ หน่วยที่ 3 การใช้งานโปรแกรม Adobe Photoshop."— ใบสำเนางานนำเสนอ:

1 วิชาโปรแกรมกราฟิก

2 หน่วยที่ 1 ความรู้เบื้องต้นเกี่ยวกับคอมพิวเตอร์กราฟิก หน่วยที่ 2 ภาพ 2 มิติ และ 3 มิติ หน่วยที่ 3 การใช้งานโปรแกรม Adobe Photoshop CS6 หน่วยที่ 4 การใช้เครื่องมือ (Tools) พื้นฐาน หน่วยที่ 5 การทำงานกับรูปภาพ หน่วยที่ 6 การวาดภาพและการออกแบบกราฟิก หน่วยที่ 10 การประยุกต์ใช้ Photoshop CS6 หน่วยที่ 9 การใช้ Mask หน่วยที่ 8 การใช้งาน Layer หน่วยที่ 7 การตกแต่งตัวอักษรแบบต่าง ๆ

3 หน่วยการเรียนรู้ที่ 1 ความรู้เบื้องต้นเกี่ยวกับคอมพิวเตอร์กราฟิก แบบทดสอน ก่อนเรียน แบบทดสอน ก่อนเรียน แบบทดสอน หลังเรียน แบบทดสอน หลังเรียน บทเรียน

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

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

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

7 หลักการทำงานและการแสดงผลของภาพคอมพิวเตอร์กราฟิก ภาพที่เกิดบนจอคอมพิวเตอร์ เกิดจากการทำงานของโหมดสี RGB ซึ่ง ประกอบด้วยสีแดง (Red) สีเขียว (Green) และสีน้ำเงิน (Blue) โดยใช้หลักการยิงประจุ ไฟฟ้าให้เกิดการเปล่งแสงของสีทั้ง 3 สีมาผสมกันทำให้เกิดเป็นจุดสีสี่เหลี่ยมเล็ก ๆ ที่ เรียกว่า พิกเซล (Pixel) ซึ่งมาจากคำว่า Picture กับ Element โดยพิกเซลจะมีหลากหลาย สี เมื่อนำมาวางต่อกันจะเกิดเป็นรูปภาพ ซึ่งภาพที่ใช้กับเครื่องคอมพิวเตอร์มี 2 ประเภท คือ แบบ Raster และแบบ Vector

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

9 หลักการใช้สีและแสงในคอมพิวเตอร์ สีที่ใช้งานด้านกราฟิกทั่วไปมี 4 ระบบ คือ 1. RGB 2. CMYK3. HSB4. LAB

10 RGB เป็นระบบสีที่ประกอบด้วยแม่สี 3 สีคือ แดง (Red), เขียว (Green) และสีน้ำเงิน (Blue) เมื่อนำมาผสมกันทำให้เกิดสีต่าง ๆ บน จอคอมพิวเตอร์มากถึง 16.7 ล้านสี ซึ่งใกล้เคียงกับสีที่ตาเรามองเห็นปกติ สีที่ได้จากการผสมสีขึ้นอยู่กับความเข้มของสี โดยถ้าสีมีความเข้มมาก เมื่อ นำมาผสมกันจะทำให้เกิดเป็นสีขาว จึงเรียกระบบสีนี้ว่าแบบ Additive หรือการผสมสีแบบบวก

11 CMYK เป็นระบบสีที่ใช้กับเครื่องพิมพ์ที่พิมพ์ออกทางกระดาษหรือวัสดุผิวเรียบอื่น ๆ ซึ่งประกอบด้วยสีหลัก 4 สีคือ สีฟ้า (Cyan), สีม่วงแดง (Magenta), สีเหลือง (Yellow) และสี ดำ (Black) เมื่อนำมาผสมกันจะเกิดสีเป็นสีดำแต่จะไม่ดำสนิทเนื่องจากหมึกพิมพ์มีความไม่ บริสุทธิ์ จึงเป็นการผสมสีแบบลบ (Subtractive) หลักการเกิดสีของระบบนี้คือ หมึกสีหนึ่ง จะดูดกลืนแสงจากสีหนึ่งแล้วสะท้อนกลับออกมาเป็นสีต่าง ๆ เช่น สีฟ้าดูดกลืนแสงของสี ม่วงแล้วสะท้อนออกมาเป็นสีน้ำเงิน ซึ่งจะสังเกตได้ว่าสีที่สะท้อนออกมาจะเป็นสีหลักของ ระบบ RGB การเกิดสีในระบบนี้จึงตรงข้ามกับการเกิดสีในระบบ RGB ดังภาพ

12 HSB เป็นระบบสีแบบการมองเห็นของสายตามมนุษย์ ซึ่งแบ่งออกเป็น 3 ส่วน คือ Hue คือสีต่าง ๆ ที่สะท้อนออกมาจากวัตถุแล้วเข้าสู่สายตาของ เรา ซึ่งมักเรียกสีตามชื่อสี เช่น สีเขียว สีเหลือง สีแดง เป็นต้น Saturation คือความสดของสี โดยค่าความสดของสีจะเริ่มที่ 0 ถึง 100 ถ้ากำหนดSaturation ที่ 0 สีจะมีความสดน้อย แต่ถ้ากำหนดที่ 100 สีจะมีความสดมาก Brightness คือระดับความสว่างของสี โดยค่าความสว่างของสี จะเริ่มที่ 0 ถึง 100 ถ้ากำหนดที่ 0 ความสว่างจะน้อยซึ่งจะเป็นสีดำ แต่ถ้า กำหนดที่ 100 สีจะมีความสว่างมากที่สุด

13 LAB เป็นระบบสีที่ไม่ขึ้นกับอุปกรณ์ใด ๆ (Device Independent) โดยแบ่ง ออกเป็น 3 ส่วน คือ “L” หรือ Luminance เป็นการกำหนดความสว่างซึ่งมีค่าตั้งแต่ 0 ถึง 100 ถ้ากำหนดที่ 0 จะกลายเป็นสีดำ แต่ถ้ากำหนดที่ 100 จะเป็นสีขาว “A” เป็นค่าของสีที่ไล่จากสีเขียวไปสีแดง “B” เป็นค่าของสีที่ไล่จากสีน้ำเงินไปเหลือง

14 1.คอมพิวเตอร์กราฟิกกับงานด้านการออกแบบ 2.คอมพิวเตอร์กราฟิกกับงานด้านโฆษณา 3. คอมพิวเตอร์กราฟิกกับงานด้านการนำเสนอ 4. คอมพิวเตอร์กราฟิกกับงานด้านเว็บเพจ 5. คอมพิวเตอร์กราฟิกกับงานด้าน Image Retouching

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

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

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

18 4. คอมพิวเตอร์กราฟิกกับงานด้านเว็บเพจ ธุรกิจรับสร้างเว็บเพจให้กับบริษัทหรือ หน่วยงานต่าง ๆ ได้นำคอมพิวเตอร์กราฟิกเข้ามาช่วย ในการสร้างเว็บเพจเพื่อให้เว็บเพจที่สร้างมีความ สวยงามน่าใช้งานยิ่งขึ้น

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

20 แบบทดสอบหลังเรียน หน่วยที่ 1 คำสั่งให้นักศึกษาเลือกกากบาท (X) ทับข้อที่เห็นว่าถูกที่สุดเพียงข้อเดียวลงในกระดาษคำตอบที่แจกให้ 1. กราฟิกหมายถึงข้อใด ก. การสื่อความหมายด้วยการใช้ศิลปะและศาสตร์ข. ภาพวาด ภาพเขียน แผนภาพ ค. ถูกทั้งข้อ ก. และ ข.ง. ถูกข้อ ก. 2. ข้อใดคือความหมายของ “คอมพิวเตอร์กราฟิก” ก. สร้างและจัดการภาพกราฟิกโดยใช้คอมพิวเตอร์ข. สร้างและจัดการภาพกราฟิก ค. การใช้เทคโนโลยีสารสนเทศง. การใช้งานกราฟิกที่ดี 3. ภาพที่มีความละเอียดสูงหรือคุณภาพดี ควรมีความละเอียดเท่าใด ก. 300 X 300 ppiข. 200 X 200 ppi ค. 600 X 600 ppiง. ถูกทุกข้อ

21 4. พิกเซล หมายถึงข้อใด ก. จุดสีดำเล็ก ๆ ที่รวมกันข. จุดมากมายแต่ละภาพสร้างขึ้น ค. จุดสี่เหลี่ยมเล็ก ๆ ที่รวมกัน ง. ถูกทุกข้อ 5. ข้อใดหมายถึงโปรแกรมวาดรูป ก. AutoCAD ข. Adobe Illustrator ค. Dream weaverง. ถูกข้อ ก. และ ข. 6. ภาพบิตแมปเป็นภาพที่มีจำนวนพิกเซลคงที่ หากนำมาขยายภาพ จะมีลักษณะในข้อใด ก. ความละเอียดมากขึ้นข. ความละเอียดคงที่ ค. ความละเอียดไม่เปลี่ยนแปลง ง. ความละเอียดลดลง 7. กระดานกราฟิก (Graphic Tablet) เป็นอุปกรณ์ในข้อใด ก. ช่วยวาดภาพกราฟิกในคอมพิวเตอร์ ข. บอกตำแหน่งของการวาด ค. สร้างตารางกราฟิกง. ถูกข้อ ก. และ ข. 8. ความละเอียดของภาพ หรือ (Resolution) มีหน่วยเป็นอะไร ก. ppiข. dpiค. pciง. ถูกทุกข้อ 9. ข้อใดเป็นไฟล์รูปภาพที่เป็นนามสกุลของ การประมวลผล แบบ Raster ก..EPSข..BMPค..CGMง..DRW 10. การแสดงผลของเครื่องพิมพ์แบบดอตเมทริกซ์ และ เลเซอร์ เป็นการแสดงผลแบบใด ก. แบบ Vectorข. แบบ Raster ค. แบบ Vector และ Rasterง. ไม่มีข้อถูก แบบทดสอบหลังเรียน หน่วยที่ 1

22 หน่วยการเรียนรู้ที่ 2 ภาพ 2 มิติ และ 3 มิติ แบบทดสอน ก่อนเรียน แบบทดสอน ก่อนเรียน แบบทดสอน หลังเรียน แบบทดสอน หลังเรียน บทเรียน

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

24 1. มิติและระบบพิกัดในภาพกราฟิก มิติและระบบพิกัดในกราฟิก เริ่มจาก จุด เส้น ระนาบ รูปทรงปริมาตรและจตุ ภาคซึ่งเป็นแกน x และแกน y ซึ่งทำให้เกิดการหมุนเวียน (Rotation) และทำให้ระบุ ตำแหน่งการเคลื่อนที่ของวัตถุได้อย่างแม่นยำ ระบบพิกัดเชิงขั้น วงกลม สองมิติ ระบบ พิกัดทรงกลม รูปทรงสามมิติ บุริมภาพ ประกอบด้วยสีแดง เขียว น้ำเงิน และความ โปร่งใส ใช้ได้ดีกับภาพบิตแมปที่มีความลึกตั้งแต่ 8 บิตขึ้นไป ชั้นภาพ เกิดจากผลของบุ ริมภาพที่ซ้อนภาพบิตแมปไว้ การสร้างทัศนีย-ภาพ วิธีการสร้างภาพลวงตาสามมิติให้ ปรากฎบนระนาบ 2 มิติ การสร้างขึ้นใหม่ การเปลี่ยนภาพสองมิติให้เป็นสามมิติ

25 2. อุปกรณ์รอบข้างสองมิติ ประกอบด้วย 1. ฮาร์ดแวร์ : องค์ประกอบพื้นฐาน ฮาร์ดแวร์ เป็นองค์ประกอบทางกายภาพ ของระบบคอมพิวเตอร์ รวมไปถึงอุปกรณ์ที่อยู่รอบข้างสำหรับใช้รับข้อมูลโดยมี หลักการและองค์ประกอบพื้นฐานที่สำคัญอยู่ 5 ส่วน คือ 1.1 บัส เป็นสายไฟต่อเชื่อมสัญญาณไฟฟ้าระหว่างส่วนประกอบต่างๆ ภายใน คอมพิวเตอร์ให้ถึงกัน ซึ่งมีการออกแบบไว้บนแผงวงจรหลัก จึงเปรียบเสมือนกับทางด่วนข้อมูลที่ เชื่อมชิ้นส่วนอุปกรณ์ที่อยู่ภายในคอมพิวเตอร์ให้ติดต่อกันได้ 1.2 สัญญาณนาฬิกา ในคอมพิวเตอร์เวลาถือเป็นข้อมูลไม่ต่อเนื่องและถูก ควบคุมด้วยระบบนาฬิกา ซึ่งเป็นวงจรอิเล็กทรอนิกส์ที่ผลิตความถี่ของสัญญาณนาฬิกา โดยจะถูก ส่งไปยังซีพียู แล้วจะมีการส่งต่อข้อมูลไปยังตัวเรจิสเตอร์ที่บรรจุในซีพียู 1.3 ซีพียู เป็นสถานที่รวมของแผงสวิตซ์จำนวนมาก ที่มีหน้าที่เปิดและปิด วงจรไฟฟ้า โดยจะมีการตรวจสอบสถานะคำส่งที่จะกระทำการได้ แล้วจึงส่งคำสั่งไปยัง แอแอลยูเพื่อกระทำการตามคำสั่งนั้น ก่อนจะส่งไปยัง เรจิสเตอร์

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

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

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

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

30 3. ความหมายของ กราฟิก 2 มิติ (2Dimension:2D) คือ เป็นภาพที่คุ้นเคยและพบเห็นโดยทั่วไป เช่น ภาพถ่าย ภาพวาด ภาพลายเส้น สัญลักษณ์ กราฟ รวมถึงการ์ตูนต่าง ๆ ในโทรศัพท์ ดังนั้นคือ ศิลปะแขนงหนึ่งซึ่งใช้สื่อความหมายเพื่อให้สามารถสื่อความหมายข้อมูลได้ ถูกต้องตรงตามที่ผู้สื่อสารต้องการ โดยมีลักษณะเป็น 2 มิติ คือ สามารถ มองเห็นตามแกนแนว X (ความกว้าง)กับ แกน Y(ความยาว)ซึ่งต่างจาก 3 มิติ 4. ความหมายของ กราฟิก 3 มิติ (3 Dimension:3D) เป็นภาพกราฟิกที่ใช้โปรแกรมสร้างภาพ 3 มิติ โดยเฉพาะ เช่น โปรแกรม 3DsMax โปรแกรม Maya จะคุ้นเคยกับภาพยนตร์หรือการ์ตูนเอนิ เมชั่น 3 มิติ จะมีแกน Z (ความหนาหรือความสูง) เพิ่มเข้ามา ทำให้เรามองเห็น ภาพได้ชัดเจน

31 ความแตกต่างระหว่างภาพกราฟิก 2 มิติ และ 3 มิติ ภาพที่เกิดบนจอคอมพิวเตอร์ เกิดจากการทำงานของโหมดสี RGB ซึ่ง ประกอบด้วยสีแดง (Red) สีเขียว (Green) และสีน้ำเงิน (Blue) โดยใช้หลักการ ยิงประจุไฟฟ้าให้เกิดการเปล่งแสงของสีทั้ง 3 สีมาผสมกันทำให้เกิดเป็นจุดสี สี่เหลี่ยมเล็ก ๆ ที่เรียกว่า พิกเซล (Pixel) ซึ่งมาจากคำว่า Picture กับ Element โดยพิกเซลจะมีหลากหลายสี เมื่อนำมาวางต่อกันจะเกิดเป็นรูปภาพ ซึ่งภาพที่ใช้ กับเครื่องคอมพิวเตอร์มี 2 ประเภท คือ แบบ Raster และแบบ Vector

32 แบบทดสอบหลังเรียน หน่วยที่ 2 คำชี้แจง จากการศึกษาหน่วยที่ 2 ให้นักศึกษาตอบ คำถามต่อไปนี้ 1. โปรแกรมที่ใช้สร้างและตกแต่งภาพกราฟิกมี อะไรบ้าง บอกมา 3 โปรแกรม โปรแกรมที่ใช้ในการออกแบบกราฟิก 2 มิติ และ 3 มิติ มีอะไรบ้าง โปรแกรมกราฟิก 2 มิติแบ่งออกเป็นกี่ประเภท อะไรบ้าง โปรแกรมPhoto Shop เป็นโปรแกรมที่ใช้สร้างงาน ชนิดใด) ความแตกต่างระหว่างโปรแกรมแบบ 2 มิติ และ แบบ 3 มิติ มีอะไรบ้างบอกมาอย่างละ 3 ข้อ แบบ2 มิติ ………………………………… ……………..………………… ………………………………… ……………………………… แบบ 3 มิติ ………………………………… ……………….……………… …………………………….… ………………………………

33 หน่วยการเรียนรู้ที่ 3 การใช้งานโปรแกรม Adobe Photoshop CS6 แบบทดสอน ก่อนเรียน แบบทดสอน ก่อนเรียน แบบทดสอน หลังเรียน แบบทดสอน หลังเรียน บทเรียน

34 แบบทดสอบก่อนเรียน หน่วยที่ 3 คำสั่ง ให้นักศึกษาเลือกกากบาท (X) ทับข้อที่เห็นว่าถูกที่สุดเพียงข้อเดียวลงในกระดาษคำตอบที่แจกให้ 1. โปรแกรม Photoshop พัฒนาขึ้นมาแล้วจนถึงรุ่นปัจจุบันเป็นเวลากี่ปี ก. 13 ปีข. 14 ปีค. 15 ปีง. 16 ปี 2. โปรแกรม PhotoshopCS6 เป็นของบริษัทใด ก. Sun Microsystemข. Adobe System Incorporated ค. Adobe Incorporationง. Adobe System Microsystem 3. กลุ่มของหน้าต่างที่ช่วยควบคุมรายละเอียดปลีกย่อยของการทำงานคือข้อใด ก. Menu Barข. Option Barค. Palettesง. Toolbox 4. ชุดเครื่องมือใดต่อไปนี้ที่ไม่ใช่ชุดเครื่องมือที่เพิ่มขึ้นมาจาก PhotoshopCS6 ก. Warp Transformข. Vanishing Point ค. Patch Toolง. Spot Healing Brush 5.ถ้าต้องการนำภาพเคลื่อนไหวเพื่อไปใช้งานในเว็บเพจควรบันทึกภาพเป็นไฟล์นามสกุลใด ก..JPEGข..GIFค..PSD ง..TIFF

35 6. ถ้าต้องการให้คุณภาพ ความละเอียดของภาพเพื่อใช้สำหรับพิมพ์ปกนิตยสารควรบันทึกภาพเป็นไฟล์นามสกุลใด ก..JPEGข..GIFค..PSDง..TIFF 7. ถ้าต้องการเก็บภาพไว้เพื่อต้องกรแก้ไขตกแต่งควรบันทึกภาพเป็นไฟล์นามสกุลใด ก..JPEGข..GIFค..PSD ง..TIFF 8. ถ้าต้องการให้มีช่องเก็บพาเลทสำรอง เพื่อเรียกใช้งานได้อย่างรวดเร็วโดยไม่ต้องปิดลงไปให้เสียเวลา จะต้องตั้งค่าความ ละเอียดของหน้าจอเท่าใด ก. 640 x 450ข. 800 x 600ค x 768ง. ถูกทั้งข้อ ข และ ค 9. ถ้าต้องการดูภาพเพื่อขยายภาพและกระดานวาดภาพให้พอดีกับหน้าจอควรใช้เครื่องมือใด ก. Pan Toolข. Zoom Toolค. Navigatorง. ถูกทั้งข้อ ก. และ ข. 10. ถ้าต้องการให้หน้าต่างการทำงานขยายเต็มหน้าต่างทำงานและมีเมนูคำสั่งติดมาด้วยให้แสดโหมดภาพแบบใด ก. Full Screen With Menu Bar Mode ข. Standard With Menu Bar Mode ค. Full Screen Mode ง. Standard Mode แบบทดสอบก่อนเรียน หน่วยที่ 3

36 1.เริ่มต้นใช้งานโปรแกรม Photoshop CS6 การเข้าสู่โปรแกรม Photoshop หลังจากที่มีการติดตั้งตัว โปรแกรมแล้ว เริ่มเข้าสู่โปรแกรมโดยเริ่มต้นจาก 1. > ไปที่ ปุ่ม start 2. > All program 3. > Adobe Photoshop CS 6 4. > และถ้าเครื่อง 64 bit ให้ ใช้ Adobe Photoshop CS 6 (64 bit) หน้าจอแรกของโปรแกรม Photoshop

37 2.ส่วนประกอบของหน้าต่างโปรแกรมและ Feature ทั่วไป Menu bar เป็นแถบที่ใช้เก็บคำสั่งหลักต่างๆของโปรแกรม โดยเราสามารถเรียกใช้ คำสั่ง ในแถบคำสั่งได้ ด้วยวิธีการดังต่อไปนี้ 1.Click mouse ที่แถบคำสั่ง จะปรากฎแถบคำสั่งย่อย 2.Click mouse เลือกแถบคำสั่งย่อยที่เราต้องการ

38 คำสั่งใน Menu Bar มีดังต่อไปนี้ 1. File หมายถึง รวมคำสั่งที่ใช้จัดการกับไฟล์รูปภาพ เช่น สร้างไฟล์ใหม่, เปิด, ปิด, บันทึกไฟล์, นำเข้า ไฟล์, ส่งออกไฟล์ และอื่น ๆ ที่เกี่ยวกับไฟล์ 2. Edit หมายถึง รวมคำสั่งที่ใช้สำหรับแก้ไขภาพ และ ปรับแต่งการทำงานของโปรแกรมเบื้องต้น เช่น ก๊อปปี้, วาง, ยกเลิกคำสั่ง, แก้ไขเครื่องมือ และอื่น ๆ 3. Image หมายถึง รวมคำสั่งที่ใช้ปรับแต่งภาพ เช่น สี, แสง,ขนาดของภาพ (image size), ขนาดของเอกสาร (canvas), โหมดสีของภาพ, หมุนภาพ และอื่น ๆ

39 4. Layer หมายถึง รวมคำสั่งที่ใช้จัดการกับเลเยอร์ ทั้งการสร้างเลเยอร์, แปลงเลเยอร์ และการจัดการกับเล เยอร์ในด้านต่าง ๆ 5. Select รวม คำสั่งเกี่ยวกับการเลือกวัตถุหรือพื้นที่บนรูปภาพ (Selection) เพื่อนำไปใช้งานร่วมกับคำสั่ง อื่น ๆ เช่น เลือกเพื่อเปลี่ยนสี, ลบ หรือใช้เอฟเฟ็กต์ต่าง ๆ กับรูปภาพ 6. Filter เป็นคำสั่งการเล่น Effects ต่างๆสำหรับรูปภาพ และวัตถุ 7. View เป็นคำสั่งเกี่ยวกับมุมมองของภาพและวัตถุใน ลักษณะต่างๆ เช่น การขยายภาพและย่อภาพให้ดูเล็ก 8. Window เป็นส่วนคำสั่งในการเลือกใช้อุปกรณ์เสริม ต่างๆที่จำเป็นในการใช้สร้าง Effects ต่างๆ 9. Help เป็นคำสั่งเพื่อแนะนำเกี่ยวกับการใช้โปรแกรมฯ และจะมีลายละเอียดของโปรแกรมอยู่ในนั้น

40 Option Bar (ออปชั่นบาร์) เป็นส่วนที่ใช้ปรับแต่งค่าการทำงาน ของเครื่องมือต่าง ๆ โดยรายละเอียดในออปชั่นบาร์จะเปลี่ยนไปตาม เครื่องมือที่เราเลือกจากทูลบ็อกซ์ในขณะนั้น เช่น เมื่อเราเลือกเครื่องมือ Brush (พู่กัน) บนออปชั่นบาร์จะปรากฏออปชั่นที่ใช้ในการกำหนด ขนาด และลักษณะหัวแปรง, โหมดในการระบายความโปร่งใสของสี และอัตราการไหลของสี เป็นต้น

41 Tool Panel (ทูลพาเนล) หรือ กล่องเครื่องมือ จะ ประกอบไปด้วยเครื่องมือต่าง ๆ ที่ใช้ในการวาด ตกแต่ง และแก้ไขภาพ เครื่องมือเหล่านี้มีจำนวนมาก ดังนั้นจึงมี การรวมเครื่องมือที่ทำหน้าที่คล้าย ๆ กันไว้ในปุ่มเดียวกัน โดยจะมีลักษณะรูปสามเหลี่ยมอยู่บริเวณมุมด้านล่างดัง ภาพ 2 เพื่อบอกให้รู้ว่าในปุ่มนี้ยังมีเครื่องมือ Tool bar

42 Panel Panel Panel (พาเนล) เป็นวินโดว์ย่อย ๆ ที่ใช้เลือก รายละเอียด หรือคำสั่งควบคุมการทำงานต่าง ๆ ของ โปรแกรม ใน Photoshop มีพาเนลอยู่เป็นจำนวนมาก เช่น พาเนล Color ใช้สำหรับเลือกสี, พาเนล Layers ใช้ สำหรับจัดการกับเลเยอร์ และพาเนล Info ใช้แสดงค่าสี ตรงตำแหน่งที่ชี้เมาส์ รวมถึงขนาด/ตำแหน่งของพื้นที่ที่ เลือกไว้

43 ปรากฏหน้าต่าง Installation Complete เป็นอันเสร็จเรียบร้อย จากจนกว่าจะทำการ ติดตั้งเสร็จ คลิกปุ่ม Install กรอก Adobe ID ที่เราได้ ทำการสมัครตั้งแต่ตอน Download File เมื่อเสร็จ เรียบร้อยแล้วคลิกปุ่ม Sign in คลิกปุ่ม Sign in คลิกปุ่ม Acceptเมื่อปรากฏหน้าต่างตาม ภาพด้านล่างคลิกปุ่ม Try เข้าสู่กระบวนการ เริ่มต้นสำหรับการติดตั้ง Photoshop CS6 หลังจาก Download Photoshop CS6 รุ่นทดลองใช้ได้ 30 วัน มาแล้ว เข้าไปยังโฟลเดอร์ของ Photoshop ตามภาพด้านล่าง ดับเบิ้ลคลิก Set-up. การติดตั้ง Adobe Photoshop CS6

44 แบบทดสอบหลังเรียน หน่วยที่ 3 คำสั่ง ให้นักศึกษาเลือกกากบาท (X) ทับข้อที่เห็นว่าถูกที่สุดเพียงข้อเดียวลงในกระดาษคำตอบที่แจกให้ 1.โปรแกรม PhotoshopCS6 เป็นของบริษัทใด ก. Sun Microsystemข. Adobe System Incorporated ค. Adobe Incorporationง. Adobe System Microsystem 2.โปรแกรม Photoshop พัฒนาขึ้นมาแล้วจนถึงรุ่นปัจจุบันเป็นเวลากี่ปี ก. 13 ปีข. 14 ปีค. 15 ปีง. 16 ปี 3.ถ้าต้องการให้คุณภาพ ความละเอียดของภาพเพื่อใช้สำหรับพิมพ์ปกนิตยสารควรบันทึกภาพเป็น ไฟล์นามสกุลใด ก..JPEGข..GIFค..PSDง..TIFF 4.ถ้าต้องการเก็บภาพไว้เพื่อต้องกรแก้ไขตกแต่งควรบันทึกภาพเป็นไฟล์นามสกุลใด ก..JPEGข..GIFค..PSD ง..TIFF 5.ถ้าต้องการนำภาพเคลื่อนไหวเพื่อไปใช้งานในเว็บเพจควรบันทึกภาพเป็นไฟล์นามสกุลใด ก..JPEGข..GIFค..PSD ง..TIFF

45 6.กลุ่มของหน้าต่างที่ช่วยควบคุมรายละเอียดปลีกย่อยของการทำงานคือข้อใด ก. Menu Barข. Option Barค. Palettesง. Toolbox 7.ชุดเครื่องมือใดต่อไปนี้ที่ไม่ใช่ชุดเครื่องมือที่เพิ่มขึ้นมาจาก PhotoshopCS6 ก. Warp Transformข. Vanishing Point ค. Patch Toolง. Spot Healing Brush 8.ถ้าต้องการให้มีช่องเก็บพาเลทสำรอง เพื่อเรียกใช้งานได้อย่างรวดเร็วโดยไม่ต้องปิดลงไปให้เสียเวลา จะต้องตั้งค่า ความละเอียดของหน้าจอเท่าใด ก. 640 x 450ข. 800 x 600ค x 768ง. ถูกทั้งข้อ ข และ ค 9.ถ้าต้องการให้หน้าต่างการทำงานขยายเต็มหน้าต่างทำงานและมีเมนูคำสั่งติดมาด้วยให้แสดโหมดภาพแบบใด ก.Full Screen With Menu Bar Modeข.Standard With Menu Bar Mode ค.Full Screen Modeง. Standard Mode 10.ถ้าต้องการดูภาพเพื่อขยายภาพและกระดานวาดภาพให้พอดีกับหน้าจอควรใช้เครื่องมือใด ก. Pan Toolข. Zoom Toolค. Navigatorง. ถูกทั้งข้อ ก. และ ข. แบบทดสอบหลังเรียน หน่วยที่ 3

46 หน่วยการเรียนรู้ที่ 4 การใช้เครื่องมือ (Tools) พื้นฐาน แบบทดสอน ก่อนเรียน แบบทดสอน ก่อนเรียน แบบทดสอน หลังเรียน แบบทดสอน หลังเรียน บทเรียน

47 แบบทดสอบก่อนเรียน หน่วยที่ 4

48 1. กลุ่มเครื่องมือการเลือก (Selection) 2. กลุ่มเครื่องมือการแก้ไข(Edit) 3. กลุ่มเครื่องมือการสร้าง (Create) 4. กลุ่มเครื่องมือมุมมอง (View)

49

50 เครื่องมือแต่ละชิ้นมีคุณสมบัติดังนี้ Move ใช้สำหรับเลือกพื้นที่บนภาพเป็นรูปสี่เหลี่ยม วงกลม วงรี หรือเลือกเป็นแถวคอลัมน์ ขนาด 1 พิเซล Marquee ใช้สำหรับย้ายพื้นที่ที่เลือกไว้ของภาพ หรือ ย้ายภาพในเลเยอร์หรือย้ายเส้นไกด์ Lasso ใช้เลือกพื้นที่บนภาพเป็นแนวเขตแบบอิสระ Magic Wand ใช้เลือกพื้นที่ด้วยวิธีระบายบนภาพ หรือ เลือกจากสีที่ใกล้เคียงกัน Crop ใช้ตัดขอบภาพ Slice ใช้ตัดแบ่งภาพเพื่อบันทึกไฟล์ภาพย่อย ๆ ที่เรียกว่า สไลซ์ ( Slice) สำหรับนำไปสร้างเว็บเพจ

51 Eyedropper ใช้เลือกสีจากสีต่าง ๆ บนภาพ Healing Brush ใช้ตกแต่งลบรอยตำหนิในภาพ Brush ใช้ระบายลงบนภาพ Clone Stamp ใช้ทำสำเนาภาพ โดยก๊อปปี้ภาพจากบริเวณอื่น มาระบาย หรือระบายด้วยลวดลาย History Brush ใช้ระบายภาพด้วยภาพของขั้นตอนเดิมที่ ผ่านมา หรือภาพของสถานะ เดิมที่บันทึกไว้ Eraser ใช้ลบภาพบางส่วนที่ไม่ต้องการ Gradient ใช้เติมสีแบบไล่ระดับโทนสีหรือความทึบ Blur ใช้ระบายภาพให้เบลอ Bern ใช้ระบายเพื่อให้ภาพมืดลง

52 Dodge ใช้ระบายเพื่อให้ภาพสว่างขึ้น pen ใช้วาดเส้นพาธ (Path) Horizontal Type ใช้พิมพ์ตัวอักษรหรือข้อความลง บนภาพ Path Selection ใช้เลือกและปรับแต่ง รูปทรงของเส้นพาธ Rectangle ใช้วาดรูปทรงเรขาคณิตหรือรูปทรงสำเร็จรูป Hand ใช้เลื่อนดูส่วนต่าง ๆ ของภาพ Zoom ใช้ย่อหรือขยายมุมมองภาด set Foreground Color, Set Background Color ใช้สำหรับกำหนดสี - Foreground Color และ Background Color เปิดแสดงหน้ากระดาษ แบบ Full screen

53 แบบทดสอบหลังเรียน หน่วยที่ 4 คำสั่ง ให้นักศึกษาเลือกกากบาท (X) ทับข้อที่เห็นว่าถูกที่สุดเพียงข้อเดียวลงในกระดาษคำตอบที่แจกให้ 1. เครื่องมือในข้อใดใช้สำหรับทำการแก้ไขรอยด่างบนภาพ ก. Patch Toolข. Healing Brush Toolค. Smooth Toolง. Drawing Tool 2. เครื่องมือ Color Replacement Tool หมายถึงข้อใด ก. เปลี่ยนแปลงการแก้ไข ลบสีข. ระบายสีของรูปภาพ ค. ลบสีของภาพที่ไม่ต้องการง. ข้อ ก-ค ถูก 3. คำสั่งในข้อใดใช้สำหรับสร้างหัวพู่กันใหม่ ก. Image >> Image Sizeข. Edit >> Define Brush Preset ค. Edit >> Define Brushง. ข้อ ข-ค ถูก 4. ลักษณะของเส้นที่เกิดจาก Pencil Tool คือข้อใด ก. เป็นเส้นคม มีขอบชัดเจนข. ใช้ในการระบายสี ค. เก็บรายละเอียดในส่วนประกอบของภาพง. ถูกทุกข้อ 5. เครื่องมือในข้อใดใช้ระบายสีเหมือนพู่กัน

54 6. เครื่องมือข้อใดใช้ระบายสีแบบพ่นสี 7. เครื่องมือข้อใดใช้กู้ภาพเดิมกลับคืนมา 8. เครื่องมือข้อใดช่วยในการระบายสีภาพ ให้มีลักษณะเหมือนภาพวาด 9. Erase to History หมายถึงข้อใด ก. การเรียกส่วนที่ลบกลับคืนมาข. คลิกบริเวณที่ต้องการกู้ภาพ ค. รูปแบบการลบง. ถูกทุกข้อ 10. Magic Eraser Tool หมายถึงข้อใด ก. ลบโหมดพิเศษของสีข. ลบการระบายสี ค. ลบพิกเซลทั้งหมดที่คบ้ายคลึงกันง. ลบส่วนของภาพที่เหมือนกันทิ้งไปด้วยคลิกเดียว แบบทดสอบหลังเรียน หน่วยที่ 4

55 หน่วยการเรียนรู้ที่ 5 การทำงานกับรูปภาพ แบบทดสอน ก่อนเรียน แบบทดสอน ก่อนเรียน แบบทดสอน หลังเรียน แบบทดสอน หลังเรียน บทเรียน

56 แบบทดสอบก่อนเรียน หน่วยที่ 5 คำชี้แจง จงตอบคำถามต่อไปนี้ให้สมบูรณ์มากที่สุด 1. อธิบายลักษณะของโหมดสีในการแต่งภาพ อธิบายหลักการทำงานของการแก้ไขภาพ อธิบายการทำงานของ Filter อธิบายการซ้อนภาพแบบ Layer Blending Mode อธิบายการปรับภาพด้วย Histogram

57 1. การนำภาพเข้าใช้งาน หากเรามีภาพที่ต้องการเปิดเข้าใช้งานในโปรแกรม ในทำการ ตามขั้นตอนต่อไปนี้ จะได้รูปมาปรากฎอยู่ที่ Stage หรือพื้นที่การทำงานดังรูป ตามตัวอย่างด้านล่าง ใช้รูปดอกบัว 9 ไปที่ File > open เลือก Floder ที่มีรูปที่เราต้องการ เลือกรูปนั้นแล้วกด Open

58 การบันทึกงาน สมมุติว่า เราได้แต่งรูป พระทราย ดังตัวอย่างภาพด้านล่าง เสร็จเรียบร้อยแล้ว เราต้องการบันทึกการทำงาน ทำตามขั้นตอนดังต่อไปนี้ 1. ไปที่ File > Save as จะปรากฎหน้าต่างดังรูปด้านล่าง ช่อง File name คือให้เราตั้งชื่องาน ช่อง Format คือ การบันทึกไฟล์งานประเภทต่างๆ เช่น PSD, JPEG, TIFF และอื่นๆ เมื่อเลือกเสร็จเรียบร้อยแล้ว กด Save ก็จะทำการบันทึกสำเร็จ

59 2.วิธีลดขนาดรูป Photoshop เราจะใช้คำสั่งเพียงไม่กี่ขั้นตอน คือ 1. เปิดภาพที่เราต้องการจะย่อหรือขยายขนาด ด้วยโปรแกรม Photoshop CS 6 2. ไปที่เมนู Image => Image Size หรือกดปุ่ม Alt+Ctrl=I 3. จากรูปจะได้ค่าดังนี้ - Pixel Dimensions จะมีขนาดอยู่ที่ 4.10 M (MegaBytes) ที่ขนาดกว้างยาว 1500 x 956 pixel - Document Size จะอยู่ที่ x 7.73 cm (เราสามารถปรับเปลี่ยนหน่อยเป็น นิ้ว, %, mm หรืออย่างอื่นก็ได้) - Resolution โดยทั่วไปถ้าเป็นรูปที่ใช้ตาม web social ต่างๆ เรามักจะใช้แค่ 72 ppi (pixel per inch) แต่ถ้าเป็นตามขนาดงานพิมพ์แล้ว แค่ตรงนี้ควรจะสูงๆไว้ก่อน เพื่อความละเอียดของงานของเรา - ควรจะเลือกConstrain Proportions ไว้ทุกครั้ง เพื่อที่จะคงอัตราส่วน กว้าง-ยาว เอาไว้ คราวนี้ เราจะเพิ่มหรือขนาดรูป ก็สามารถทำได้เลย โดยการปรับแก้ที่ช่องตามที่ได้อธิบายด้านบน ตามวัตถุประสงค์ของเรา แก้เสร็จก็ เซฟงานได้เลย 4. ในการเซฟไฟล์ โปรแกรม Photoshop CS 6 จะถามเราอีกครั้ง ในเรื่องของคุณภาพไฟล์ ว่าจะเอา ขนาดไหน (ตามรูป) ใน ตย. จะเลือกแค่ 8 ก็พอเพียงพอแล้ว โดยค่ายิ่งมาก ขนาดไฟล์ก็จะใหญ่ขึ้นตาม

60 วิธีลดขนาดรูป

61 3. เครื่องมือ Burn Tool และ Dodge Tool ไว้ปรับความเข้มหรือความจางเฉพาะส่วนที่ระบาย ทดลองทำโดย เลือกรูปขึ้นมา จากรูปจะเห็นว่า ส่วนใบหน้ากับมือดูสว่างเกินไป ให้ใช้ ระบายส่วนใบหน้ากับมือเพื่อลดความสว่างลงมา และใช้ ระบายส่วนที่ดูเข้มเกินไป

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

63 1. เปิดรูปภาพที่ต้องการ โดยไปที่เมนู File --> Open 4. เทคนิคการเปลี่ยนสีรูปภาพเฉพาะจุด 2. จากนั้น เลือกเครื่องมือ Quick Selection Tool แล้วนำไปจิ้มบริเวณที่ต้องการ เปลี่ยนสี จะมีเส้น Selection ล้อมรอบ บริเวณที่ต้องการเอาไว้ 3. เมื่อทำเส้น Selection ล้อมรอบส่วน ที่ต้องการเรียบร้อยแล้ว ให้ไปที่เมนู Image --> Adjustments --> Hue/Saturation... จากนั้นให้ทำการ ปรับเปลี่ยนสีที่ช่อง Hue ตามใจชอบ ภาพต้นฉบับ ภาพที่ใช้เทคนิคเปลี่ยนสี รูปเฉพาะจุด

64 5.การใช้เครื่องมือ Healing Brush Tool ลบริ้วรอยบนใบหน้า หรือลบสิว ลบไฝ Healing Brush Tool หลังจากนั้นอาจใช้ Blur Tool ระบายอีกทีบริเวณผิวหน้า

65 แบบทดสอบหลังเรียน หน่วยที่ 5 คำสั่ง ให้นักศึกษาเลือกกากบาท (X) ทับข้อที่เห็นว่าถูกที่สุดเพียงข้อเดียวลงในกระดาษคำตอบที่แจกให้ 1. ข้อใดต่อไปนี้กล่าวผิด ก. ภาพที่ได้จากกล้องดิจิตอลจะเป็นโหมดสีแบบ CMYK ข. โหมดสีแบบ RGB เวลานำมาพิมพ์จะทำให้ภาพสีเพี้ยน ค. คำสั่ง Image Mode เป็นคำสั่งที่ใช้ในการเปลี่ยนโหมดสี ง. โหมดสีแบบ CMYK ซึ่งเป็นโหมดสีที่เหมาะสมกับงานพิมพ์ จ. โหมดสีแบบ RGB เกิดจากการยิงแสงสีแดง สีเขียวและสีน้ำเงิน 2. ในกรณีที่ภาพที่เราถ่ายออกมามืดเกินไป ถ้าต้องการปรับให้ภาพสว่างขึ้นเพียงอย่างเดียว ควรเลือกใช้คำสั่งใด ก. Levels ข. Duplicate ค. Bright/Contrast ง. Image > Mode จ. Filter or Adjustment Layer

66 3. ในคำสั่ง Hue/Saturation ถ้าต้องการให้ภาพออกมาเป็นโทนสีน้ำเงินเพียงสีเดียว จะมีวิธีการทำอย่างไร ก. คลิกเลือก Colorize ข. คลิกเลือก Transform ค. คลิกเครื่องมือ Crop Tool ง. คลิกคำสั่ง Window > Histogram จ. คลิกปุ่ม Fill or Adjustment Layer 4. ข้อใดต่อไปนี้ไม่ได้เป็นคำสั่งสำหรับแก้ไขสีอัตโนมัติ ก. Auto Level ข. Auto Contrast ค. Auto Color ง. Auto Filter จ. ไม่มีข้อถูก แบบทดสอบหลังเรียน หน่วยที่ 5

67 5. ถ้าต้องการปรับภาพสีจืดชืดให้มีสีสันสดใส ควรใช้คำสั่งใด ก. Resample ข. Save for Web ค. Hue/Saturation ง. Blending Mode จ. Shadow/Highlight 6. การที่เราปรับค่า Hue นั้นมีความหมายอย่างไร ก. เลือกโทนสีข. ปรับค่าความสว่าง ค. ทำให้ภาพปรับสีอัตโนมัติง. กำหนดจำนวนพิกเซล จ. กำหนดภาพให้เคลื่อนไหว 7. คำสั่ง Shadow/Highlight เป็นคำสั่งที่ใช้จัดการกับภาพแบบใด ก. ภาพย้อนแสงข. ภาพที่มืดเกินไป ค. กำหนดสีให้รูปภาพง. แก้ไขสีที่เพี้ยนของรูปภาพ จ. ปรับระดับการตัดกันของสีในภาพ แบบทดสอบหลังเรียน หน่วยที่ 5

68 8. คำสั่ง Variations มีข้อดีอย่างไร ก. ใช้งานง่ายข. ควบคุมง่าย ค. เห็นผลลัพธ์ในการทำงานหลาย ๆ แบบพร้อมกัน ง. ช่วยปรับสีและความสว่างของรูปภาพ จ. ถูกทุกข้อ 9. วิธีการอ่านกราฟ Histogram ข้อใดกล่าวถูกต้อง ก. ปรับโทนสีของภาพจากกราฟ ข. อ่านจากค่าสีที่มีความเข้มมากไปหาน้อย ค. อ่านตามความสูงของกราฟโดยดูจากมืดที่สุดไปจนถึงสว่างที่สุด ง. ภาพที่มีโทนสีสว่างจำนวนพิกเซล Brightness จะกระจุกอยู่ทางขวา จ. ภาพที่มีโทนสีปกติ จำนวนพิกเซลใน Histogram จะกระจุกตัวอยู่ทางซ้าย 10. Spot Healing Brush มีข้อจำกัดอย่างไร ก. การแสดงผลลัพธ์ให้ค่าสีที่เพี้ยน ข. ไม่สามารถเพิ่มเติมสีได้หลายครั้ง ค. ไม่เป็นที่นิยมในการนำมาใช้งาน ง. ไม่เหมาะกับการใช้งานรูปภาพที่มีโทนสีเดียว จ. ไม่สามารถทำงานในพื้นที่ที่มีสีสันตัดกันมาก ๆ ได้ แบบทดสอบหลังเรียน หน่วยที่ 5

69 หน่วยการเรียนรู้ที่ 6 การวาดภาพและการออกแบบกราฟิก แบบทดสอน ก่อนเรียน แบบทดสอน ก่อนเรียน แบบทดสอน หลังเรียน แบบทดสอน หลังเรียน บทเรียน

70 แบบทดสอบก่อนเรียน หน่วยที่ 6 คำสั่ง ให้นักศึกษาเลือกกากบาท (X) ทับข้อที่เห็นว่าถูกที่สุดเพียงข้อเดียวลงในกระดาษคำตอบที่แจกให้ 1. Path เป็นเส้นแบบ Vector ที่เกิดจากการวาดภาพด้วยเครื่องมือ Pen Tool โดยเส้น Path ที่ได้จะมีคุณสมบัติเด่น แตกต่างจากเส้นแบบอื่น ๆ ตามข้อใด ก. สามารถแก้ไขดัดโค้งได้ตลอดเวลา ข. เขียนลวดลายที่มีความ ซับซ้อนสูง ๆ ค. สามารถกำหนดความโค้งได้อย่างแม่นยำ ง. นำมาแก้ไขได้ตลอดเวลา จ. สามารถขยายได้ตามความพอใจ 2. ข้อใดคือส่วนประกอบต่างๆ ที่อยู่บนเส้น Path ก. เส้น Pathข. Anchor Point ค. ขาสำหรับดัดโค้ง ง. ไม่มีข้อถูก จ. ข้อ ก-ค ถูก 3. ถ้าเราจะเปลี่ยนเส้น Path เหลี่ยม ๆ ที่สร้างไว้ให้กลายเป็นเส้นโค้งสามารถทำได้โดยเลือกเครื่องมือใด ก. Gradient ข. Hand Tool ค. Zoom Toolง. Eyedropper Tool จ. Convert Point Tool

71 4. ถ้าจำนวนจุดที่สร้างไว้ไม่พอสำหรับการดัดโค้งให้เข้ากับภาพ สามารถเพิ่มจุดด้วยการคลิกเครื่องมือชนิดใด ก. Frame by Frameข. Tweening Frame ค. ขาสำหรับดัดโค้ง ง. คลิกเลือก Pen Tool จ. Add Anchor Point Tool 5. เครื่องมือสำหรับควบคุมเส้น Path (Path Selection Tool) เหมาะสำหรับใช้งานในข้อใด ก. ควบคุมเส้นที่มีจุดน้อย ข. กำหนดตำแหน่งจุด ต่อไปเรื่อยๆ ค. สำหรับเลือกและย้ายตำแหน่งเส้น Path ทั้งเส้น ง. ปรับตำแหน่งให้เส้นโค้งเข้ากับภาพที่เตรียมไว้ จ. สำหรับเลือกและย้ายตำแหน่งจุดควบคุมบนเส้น Path 6. เครื่องมือสำหรับควบคุมเส้น Path (Direct Selection Tool) เหมาะสำหรับใช้งานในข้อใด ใช้ตัวเลือกข้อ 5 แบบทดสอบก่อนเรียน หน่วยที่ 6

72 7. กรณีที่ต้องการปรับขาสำหรับดัดโค้งทั้งสองด้านของเส้น Path พร้อมกันอย่างรวดเร็ว ทำได้โดย ก. กด ค้างข. กด ค. กด ง. กด จ. กด Option (Mac OS) 8. ข้อใดคือปัญหาที่เกิดจากการหัดใช้ Path ก. เส้น Path ที่วาดอยู่หายไปข. ไม่รู้จะวาดเส้น Path ต่อจากเส้นที่มีอยู่อย่างไร ค. ใช้เครื่องมือไม่ถูกต้อง-ง. ไม่รู้จักวิธีการทำ จ. ข้อ ก และ ข ถูก 9. การซ่อน-แสดงเส้น Path ทำได้โดย ก. กดปุ่ม บนคีย์บอร์ดข. กดปุ่ม ค. กดปุ่ม ง. กดปุ่ม Option (Mac OS) จ. กดปุ่ม 10. ข้อใดไม่ใช่การเคลื่อนไหวแบบ Tweening Frame ก. Positionข. Opacity ค. Effectง. Style จ. ถูกทุกข้อ ++ แบบทดสอบก่อนเรียน หน่วยที่ 6

73 1. ภาพแบบเวคเตอร์ใน Photoshop แบ่งเป็น 2 ประเภท ได้แก่ เส้นพาธ (Path) คือ ภาพที่เป็นเส้นโครงร่างโดยยังไม่กำหนดสีเส้นหรือสีพื้น ดังนั้น เส้นพาธจะไม่ปรากฏในภาพผลลัพธ์ที่ยำไปใช้งาน รูปทรง (Shape) คือ เส้นพาธที่กำหนดสีขาวส่วนต่าง ๆ ดังนั้น รูปทรงจะปรากฏใน ภาพผลลัพธ์ ลักษณะเด่นของภาพแบบเวคเตอร์ คือ เราสามารถย่อหรือขยายขนาดเท่าไร่ก็ได้ โดยที่ ภาพยังคงความชัดเหมือนเดิม การแปลงภาพเวคเตอร์เป็นราสเตอร์ควรทำให้ขั้นตอน สุดท้ายเมื่อต้องบันทึกผลลัพธ์เพื่อนำไปใช้งาน แต่ถ้าสามารถใช้รูปแบบไฟล์ผลลัพธ์ที่เก็บ ข้อมูลเวคเตอร์ได้ เช่น PSD และ PDF คุณสมบัติของภาพเวคเตอร์จะยังคงอยู่จนถึงขั้นตอน การพิมพ์

74 เครื่องมือวาดภาพแบบเวคเตอร์ของ Photoshop แบ่งออกเป็น 3 กลุ่ม ดังรูป 1. เครื่องมือวาดเส้นพาธหรือรูปทรงด้วยตนเอง 2. เครื่องมือปรับแต่งเส้นพาธ 3. เครื่องมือวาดรูปทรงเรขาคณิตและรูปทรงสำเร็จรูป

75 1. เครื่องมือวาดเส้นพาธหรือรูปทรงด้วยตนเอง Pen ใช้วาดเส้นพาธหรือรูปทรงด้วยวิธีกำหนดจุด และแนวเส้น Freeform Pen ใช้วาดเส้นพาธหรือรูปทรงด้วยวิธีคลิก ลากเมาส์แบบอิสระ Add Anchor Point เพิ่มจุดที่ใช้กำหนดเส้นและรูปทรง (จุดแองเคอร์) Delete Anchor Point ลบจุดแองเคอร์ Convert Point ใช้เปลี่ยนส่วนโค้งเป็นมุม หรือกลับกัน

76 2. เครื่องมือปรับแต่งเส้นพาธ Path Selection ใช้เลือกเส้นพาธทั้งเส้น เพื่อ ย้ายตำแหน่ง ปรับขนาด หมุน บิดรูปทรง หรือเปลี่ยนคุณสมบัติต่าง ๆ Direct Selection ใช้เลือกจุดแองเคอร์หรือ ท่อนย่อยของเส้นพาธ เพื่อย้ายหรือดัดแปลง รูปทรง

77 3. เครื่องมือวาดรูปทรงเรขาคณิตและรูปทรงสำเร็จรูป Rectangle วาดรูปสี่เหลี่ยม Rounded Rectangle วาดรูปสี่เหลี่ยมมุมโค้ง Ellipse วาดรูปวงกลม/วงรี Polygon ใช้วาดรูปหลายเหลี่ยมหรือรูปดาว Line วาดเส้นตรงหรือลูกศร Custom Shape วาดรูปทรงสำเร็จรูปต่าง ๆ

78 2. ส่วนประกอบของเส้นพาธ เส้นพาธซึ่งเป็นพื้นฐานของภาพแบบเวคเตอร์ มีส่วนประกอบต่าง ๆ ดังรูป 1. Anchor Point จุดแองเคอร์ คือ จุดที่ใช้กำหนดตำแหน่ง เริ่มต้นและสิ้นสุดของเส้นพาธ 2. Direction Line เป็นแขนใช้กำหนดแนวของเส้นพาธที่ ออกจากจุดแองเคอร์ 3. Direction Point เป็นจุดที่ใช้กำหนดความโค้งของเส้น พาธแต่ละท่อน 4. Smooth Point เป็นจุดที่อยู่บนเส้นโค้งวาด เส้นพาธหรือรูปทรงแบบกำหนดจุดและเส้น

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

80 การสร้างเส้นโค้งด้วยเครื่องมือ Pen การสร้างเส้นโค้งด้วยเครื่องมือ Pen ทำได้โดยการคลิกลากที่ Direction Point ตรง ปลายเส้นที่ยื่นออกมาจากจุดแองเคอร์ ซึ่งทิศทางในการลาก Direction Point จะส่งผล ต่อลักษณะการโค้งของเส้น เมื่อเราฝึกใช้เครื่องมือนี้จนชำนาญจะสามารถสร้างภาพ กราฟิกส์ที่ซับซ้อนได้ 1. คลิกเลือกเครื่องมือ 2. กำหนดออปชั่นต่างๆบนออปชั่นบาร์ 3. ใช้เมาส์รูป คลิกค้างที่จุดเริ่มต้น แล้วลากเส้น Direction ออกจากจุดแองเคอร์จุด แรก 4. ใช้เมาส์รูป คลิกสร้างจุดใหม่ พร้อมทั้งลากเส้น Direction โดยทิศทางการลากจะ ส่งผลต่อลักษณะของเส้น เช่น 4.1 ถ้าลากไปในทิศทางเดียวกันกับจุดที่แล้วก็จะได้เส้นใน ลักษณะตัว S 4.2 ถ้าลายในทิศทางตรงกันข้ามกับจุดที่แล้วก็จะได้เส้นใน ลักษณะตัว C 5. สร้างส่วนโค้งเพิ่มเติมตามต้องการ แล้วปิดเส้นด้วยวิธีการเดียวกับการสร้างรูป หลายเหลี่ยม

81 การสร้างรูปทรงอิสระด้วยเครื่องมือ Pen การสร้างรูปทรงอิสระด้วยเครื่องมือ Pen นอกจากการสร้างเส้นตรงและเส้นโค้งโดยใช้เครื่องมือ Pen แล้ว เรายังใช้ เครื่องมือ Freeform Pen เพื่อสร้าง Path รูปอิสระได้เช่นเดียวกับการใช้เครื่องมือ Lasso สร้าง Selection โดยโปรแกรมจะวางจุดแองเคอร์ต่าง ๆ ให้โดยอัตโนมัติ นอกจากนี้ เรายังสามารถปรับแต่งเส้น Path ได้เช่นเดียวกับ Path ที่สร้างด้วย เครื่องมือ Pen 1. เลือกเครื่องมือ Freeform Pen 2. กำหนดออปชั่นต่าง ๆ บนออปชั่นบาร์ 3. ใช้เมาส์รูป คลิกลากเป็นรูปร่างตามต้องการ 4. เมื่อปล่อยเมาส์ก็จะได้เส้น Path 5. ถ้าต้องการสร้างรูปทรงแบบปลายปิด ให้ทำอย่างใดอย่างหนึ่ง ดังนี้ คลิกลากไปบรรจบกับจุดเริ่มต้น (เมาส์จะเป็นรูป ) แล้วปล่อยเมาส์ กด Ctrl ที่คีย์บอร์ดค้างไว้แล้วปล่อยเมาส์ จะเกิดเส้นตรงเชื่อมระหว่าง จุดเริ่มต้นและจุดสุดท้ายโดยอัตโนมัติ

82 วิธีการใช้งานเครื่องมือกลุ่ม Shape ทุกชิ้นจะมีขั้นตอนที่ เหมือนกัน คือ 1. คลิกเครื่องมือจากทูลบ็อกซ์ 2. กำหนดออปชั่นบนออปชั่นบาร์ 3. ใช้เมาส์รูป คลิกลากบนรูปภาพให้ได้ขนาดและรูปทรงตาม ต้องการ ถ้าต้องการสร้างรูปสี่เหลี่ยมจัตุรัส วงกลม หรือคงสัดส่วนเดิม ของรูปทรงสำเร็จรูป ให้กด Shift ที่คีย์บอร์ดค้างไว้ขณะที่คลิก ลากเมาส์ ถ้าต้องการให้รูปทรงขยายตัวออกจากจุดเริ่มต้นคลิกลากเมาส์ แล้วกด Alt ที่คีย์บอร์ดค้างไว้ รูปทรงที่ได้คือเส้น Path ที่โปรแกรมสร้างให้โดยอัตโนมัติ นอกจากการวาดเส้นพาธ หรือรูปทรงเองแล้ว สำหรับรูปทรง เรขาคณิตพื้นฐานก็สามารถวาดได้ โดย ใช้เครื่องมือกลุ่ม Shape นอกจากนี้แล้ว โปรแกรม Photoshop CS3 ยังมีรูปทรง สำเร็จรูปต่าง ๆ ให้มาด้วย ซึ่งอาจจะ นำมาใช้ตรง ๆ หรือดัดแปลงเพิ่มเติม เพื่อให้ได้รูปทรงที่แปลกออกไป สำหรับตกแต่งภาพก็ได้

83 ปุ่ม Shape Layers และปุ่ม Paths ซึ่งมีรายละเอียดเหมือนกับ ออปชั่นของเครื่องมือ Pen ปุ่ม Fill Pixels สำหรับสร้างรูปทรงเป็นภาพราสเตอร์ขึ้นบนเลเยอร์ ปัจจุบันโยตรง โดยภาพที่ได้จะถูกเติมด้วยสี Foreground เมื่อเราคลิกปุ่มนี้ ตะปรากฏออปชั่นเพิ่มเติมให้เราปรับค่าต่าง ๆ ได้แก่ ออปชั่น Mode, Opacity และ Anti – alias สำหรับออปชั่นเฉพาะของเครื่องมือแต่ละชนิดนั้น เราจะต้องคลิก ปุ่ม เพื่อเปิดรายการออปชั่นย่อยออกมา

84 เครื่องมือ Rectangle ออปชั่นเฉพาะของเครื่องมือ Rectangle ดังนี้ Unconstrained รูปทรงสี่เหลี่ยมขนาดอิสระตามการคลิกลากเมาส์ Square ใช้สำหรับการสร้างรูปสี่เหลี่ยมจัตุรัส Fixed Size ใช้สร้างรูปสี่เหลี่ยมที่มีขนาดแน่นอน โดยกำหนดความกว้าง (W) และความ สูง (H) Proportional ใช้สร้างรูปสี่เหลี่ยมที่มีสัดส่วนแน่นอน โดยกำหนดสัดส่วนความกว้าง (W) ต่อความสูง From Center รูปสี่เหลี่ยมที่สร้างจะขยายขนาดจากจุดศูนย์กลางที่คลิกลากเมาส์ Snap to Pixels ให้ขอบของรูปทรงสี่เหลี่ยมอยู่ตรงกับแนวพิกเซลของภาพพอดี

85 เครื่องมือ Rounded Rectangle ออปชั่นของเครื่องมือนี้จะเหมือนกับ เครื่องมือ Rectangle แต่มีเพิ่มขึ้นมา คือ Rounded Rectangle ใช้กำหนดรัศมีความ โค้งมนของมุม เครื่องมือ Ellipse ออปชั่นจะคล้ายเครื่องมือ Rectangle โดยมีส่วนที่ ต่างออกไป คือ Circle ใช้สร้างรูปวงกลมที่สมบูรณ์แบบ คือ เท่ากันทุกด้าน ทำนองเดียวกับออปชั่น Square ของ เครื่องมือ Rectangle

86 เครื่องมือ Polygon ประกอบด้วยออปชั่นเฉพาะ ดังนี้ Sides ใช้กำหนดจำนวนด้านของรูปหลายเหลี่ยมได้ตามต้องการ เช่น ถ้าสร้างรูป 5 เหลี่ยมก็ใส่ค่า 5 Radius ใช้สร้างรูปหลายเหลี่ยมที่มีขนาดแน่นอน โดยกำหนดค่ารัศมีจากจุดศูนย์กลางถึงยอดแหลมของมุม Smooth Corners ใช้กำหนดให้มุมของรูปหลายเหลี่ยมโค้งมน Star ใช้สร้างรูปดาว Indent Sides By กำหนดระยะที่เว้าเข้าไปของรูปดาว โดยระบุเป็นเปอร์เซ็นต์ตั้งแต่ 1-99 Smooth Indents กำหนดให้มุมที่เว้าเข้าไปมีความโค้งมน เครื่องมือ Line ประกอบด้วยออปชั่นเฉพาะ ดังนี้ Weight ใช้กำหนดความหนาของเส้น Arrowheads ใช้สร้างและกำหนด คุณสมบัติของหัวลูกศร - Start สร้างหัวลูกศรที่ส่วนหัวของเส้น - End สร้างหัวลูกศรที่ส่วนท้ายของเส้น - Width กำหนดความกว้างของหัวลูกศร (ตั้งแต่ 10% - 1,000% ของความหนาเส้น) - Length กำหนดความยาวของหัวลูกศร (ตั้งแต่ 10% - 5,000% ของความหนาเส้น) - Concavity กำหนดค่าความเว้าข้าวของฐานลูกศร (ตั้งแต่ -50% จนถึง +50%)

87 เครื่องมือ Custom Shape ประกอบด้วยออปชั่นเฉพาะ ดังนี้ Shape ใช้เลือกรูปทรงสำเร็จรูปจากพาเล็ต Custom Shapes Defined Proportions กำหนดให้ใช้สัดส่วนเดิม ของรูปทรงสำเร็จรูป Defined Size กำหนดให้ใช้ขนาดเดิมของรูปทรง

88 การใช้พาเล็ต Custom Shape พาเล็ต Custom Shape ใช้สำหรับจัดเก็บ รูปทรงสำเร็จรูปต่าง ๆ ที่โปรแกรมเตรียมไว้ให้ ซึ่งเราสามารถ เรียกมาใช้ได้ทันทีโดยไม่ต้องสร้างเอง นอกจากนี้ เรายังสามารถสร้างรูปทรง ที่ต้องใช้บ่อย ๆ เก็บไว้ได้ด้วยเช่นกัน ในเมนูของพาเล็ต Custom Shape จะประกอบด้วนคำสั่งต่าง ๆ เหมือน พาเล็ตอื่น โดยที่ส่วนล่างของเมนูจะเป็นชื่อชุดรูปทรงซึ่งเราสามารถเปิดขึ้น มาใช้เพิ่มเติมได้นอกจากรูปทรงที่มีอยู่เดิม แต่ถ้าต้องการดูรูปทรงทั้งหมดให้ เลือกคำสั่ง All

89 4. สอนการสร้างภาพหน้าแผ่นสกรีน CD และ DVD 1. โหลดไฟล์ต้นฉบับที่ต้องการ 2. เปิดไฟล์ที่โหลดมา ในโปรแกรม Photoshop 3. เปิดไฟล์ภาพที่ต้องการเอามาทำหน้าแผ่น และสามารถตกแต่งแผ่นได้ตามใจชอบ 4. เมื่อนำภาพมาวางในแผ่นวงกลมแล้ว เลื่อนภาพและข้อความที่เพิ่มเติมทั้งหมดให้ อยู่ล่างสุด หรือข้างล่าง Layer กรอบนอกกับ วงกลมในสีชมพูดังรูป 5. ตกแต่งหน้าแผ่นให้สวยงามตามต้องการ หรือจะพิมพ์ข้อความลงไปตามรูปด้านล่าง 6. หลังจากนั้นทำการ save file เป็น.psd

90 แบบทดสอบหลังเรียน หน่วยที่ 6 คำสั่ง ให้นักศึกษาเลือกกากบาท (X) ทับข้อที่เห็นว่าถูกที่สุดเพียงข้อเดียวลงในกระดาษคำตอบที่แจกให้ 1. ถ้าเราจะเปลี่ยนเส้น Path เหลี่ยม ๆ ที่สร้างไว้ให้กลายเป็นเส้นโค้งสามารถทำได้โดยเลือกเครื่องมือใด ก. Gradient ข. Hand Tool ค. Zoom Tool ง. Eyedropper Tool จ. Convert Point Tool 2. Path เป็นเส้นแบบ Vector ที่เกิดจากการวาดภาพด้วยเครื่องมือ Pen Tool โดยเส้น Path ที่ได้จะมีคุณสมบัติเด่น แตกต่างจากเส้นแบบอื่น ๆ ตามข้อใด ก. สามารถแก้ไขดัดโค้งได้ตลอดเวลา ข. เขียนลวดลายที่มีความ ซับซ้อนสูง ๆ ค. สามารถกำหนดความโค้งได้อย่างแม่นยำ ง. นำมาแก้ไขได้ตลอดเวลา จ. สามารถขยายได้ตามความพอใจ 3. ข้อใดคือส่วนประกอบต่างๆ ที่อยู่บนเส้น Path ก. เส้น Pathข. Anchor Point ค. ขาสำหรับดัดโค้ง ง. ไม่มีข้อถูก จ. ข้อ ก-ค ถูก

91 4. การซ่อน-แสดงเส้น Path ทำได้โดย ก. กดปุ่ม บนคีย์บอร์ดข. กดปุ่ม ค. กดปุ่ม ง. กดปุ่ม Option (Mac OS) จ. กดปุ่ม 5. ข้อใดไม่ใช่การเคลื่อนไหวแบบ Tweening Frame ก. Positionข. Opacity ค. Effectง. Style จ. ถูกทุกข้อ 6. เครื่องมือสำหรับควบคุมเส้น Path (Direct Selection Tool) เหมาะสำหรับใช้งานในข้อใด ใช้ตัวเลือกข้อ 5 แบบทดสอบหลังเรียน หน่วยที่ 6

92 7. กรณีที่ต้องการปรับขาสำหรับดัดโค้งทั้งสองด้านของเส้น Path พร้อมกันอย่างรวดเร็ว ทำได้โดย ก. กด ค้างข. กด ค. กด ง. กด  Ctrl+แดรกเมาส์  จ. กด Option (Mac OS) 8. ข้อใดคือปัญหาที่เกิดจากการหัดใช้ Path ก. เส้น Path ที่วาดอยู่หายไปข. ไม่รู้จะวาดเส้น Path ต่อจากเส้นที่มีอยู่อย่างไร ค. ใช้เครื่องมือไม่ถูกต้องง. ไม่รู้จักวิธีการทำ จ. ข้อ ก และ ข ถูก 9. ถ้าจำนวนจุดที่สร้างไว้ไม่พอสำหรับการดัดโค้งให้เข้ากับภาพ สามารถเพิ่มจุดด้วยการคลิกเครื่องมือชนิดใด ก. Frame by Frameข. Tweening Frame ค. ขาสำหรับดัดโค้ง ง. คลิกเลือก Pen Tool จ. Add Anchor Point Tool 10. เครื่องมือสำหรับควบคุมเส้น Path (Path Selection Tool) เหมาะสำหรับใช้งานในข้อใด ก. ควบคุมเส้นที่มีจุดน้อยข. กำหนดตำแหน่งจุด ต่อไปเรื่อยๆ ค. สำหรับเลือกและย้ายตำแหน่งเส้น Path ทั้งเส้นง. ปรับตำแหน่งให้เส้นโค้งเข้ากับภาพที่เตรียมไว้ จ. สำหรับเลือกและย้ายตำแหน่งจุดควบคุมบนเส้น Path แบบทดสอบหลังเรียน หน่วยที่ 6

93 หน่วยการเรียนรู้ที่ 7 การตกแต่งตัวอักษรแบบต่าง ๆ แบบทดสอน ก่อนเรียน แบบทดสอน ก่อนเรียน แบบทดสอน หลังเรียน แบบทดสอน หลังเรียน บทเรียน

94 คำสั่ง จงนำคำที่กำหนดให้เติมลงหน้าคำอธิบายต่อไปนี้ เพื่อให้ประโยคสมบูรณ์และถูกต้อง - Drop Shadow - Inner Shadow - Outer Glow - Inner Glow - Bevel and Emboss - Satin - Gradient Overlay และ Color Overlay - Pattern Overlay - Stroke แบบทดสอบก่อนเรียน หน่วยที่ 7

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

96 1.การตกแต่งแก้ไขตัวอักษรให้สวยงามแบบง่ายๆ

97 มีทั้งหมด 4 เครื่องมือด้วยกัน สังเกตง่ายๆ ว่าจะเป็นรูป ตัวอักษร T 1. horizontal type tool เครื่องมือตัวนี้มักใช้งานย่อยที่สุด เป็นการพิมพ์ตัวอักษรปกติ 2. Vertical type tool เป็นเครื่องมือที่พิมพ์ตัวอักษรแนวดิ่งลงมาก 3. horizontal type mask tool เครื่องมือตัวนี้ใช้พิมพ์ตัวอักษร 4. vertical type mask tool เป็นการสร้างตัวอักษร แนวดิ่งที่มีลักษณะเหมือนเครื่องเมือชิ้นที่ 3 2. เครื่องมือที่ใช้ในการสร้างตัวอักษร

98 3.รูปแบบ Layer Style การปรับแต่งเลเยอร์ด้วยรูปแบบต่างๆ ของเลเยอร์ หรือ ที่เรียกว่า Layer Style นั้น มีอยู่ด้วยกันหลายแบบแต่ละแบบเมื่อนำมา ใช้ในการปรับแต่งภาพแล้วจะทำให้ภาพที่ ออกมาดูแปลกตา และสวยงามอย่างเหลือเชื่อ แต่ละภาพจะใช้ Laye Style ตัวเดียว หรือหลายตัวรวมกัน

99 คำสั่ง ให้นักศึกษาเลือกกากบาท (X) ทับข้อที่เห็นว่าถูกที่สุดเพียงข้อเดียวลงในกระดาษคำตอบที่แจ กให้ 1. ตัวอักษรที่สร้างมาจาก Photoshop จะมีอยู่กี่แบบ ก. 2 แบบข. 3 แบบ ค. 4 แบบง. 5 แบบ จ. 6 แบบ 2. ข้อใดไม่ใช่เครื่องมือในชุด Text Tool ก. Horizontal Type Tool ข. Vertical Type Tool ค. Horizontal Type Mask Tool ง. Vertical Type Mask Tool จ. ถูกทุกข้อ 3. ตัวอักษรที่เป็นข้อความสั้น ๆ และตัวอักษรที่เป็นประโยคยาวๆ เกิดจากการสร้างโดยเครื่องมือในข้อใด ก. Vertical Type ข. Horizontal Tool ค. Vertical Type Tool ง. Vertical Type Mask Tool จ. Horizontal Type Mask Tool แบบทดสอบหลังเรียน หน่วยที่ 7

100 4. ข้อ ใดเป็นละเอียดการกำหนดค่าของตัวอักษร ก. เลือกแบบตัวอักษรข. กำหนดขนาดของตัวอักษร ค. กำหนดสีที่ต้องการง. เลือกรูปแบบ เช่น ตัวเอียง จ. ถูกทุกข้อ 5. ถ้าต้องการขึ้นบรรทัดใหม่ต่อจากข้อความเดิม สามารถทำได้โดย ก. กดปุ่ม ข. กดปุ่ม ค. กดปุ่ม ง. กดปุ่ม บนคีย์บอร์ด จ. กดปุ่ม บน Numeric Keyboard 6. ถ้าต้องการสร้างตัวอักษรในแนวตั้งให้ทำงานเหมือนการสร้างตัวอักษรตามปกติ ให้คลิกปุ่มใดใน Options Bar ก. Toggleข. Notepad ค. Paragraphง. Horizontal Type Tool จ. Character & Paragraph แบบทดสอบหลังเรียน หน่วยที่ 7

101 7. กรณีที่ต้องการแก้ไขตัวอักษรกำหนดรายละเอียดตัวอักษรเพิ่มเติม ให้เข้าไปทำงานในส่วนใดของ Options Bar ก. Toggleข. Notepadค. Paragraph ง. Horizontal Type Tool จ. Character & Paragraph 8. ข้อใดไม่ใช่รายละเอียดการกำหนดค่าต่าง ๆ ในพาเลท Paragraph ก. จัดเรียงตำแหน่งข้อความ ข. กำหนดระยะการย่อหน้าในแต่ละส่วนของข้อความ ค. กำหนดระยะห่างของข้อความแต่ละส่วน ง. กำหนดขนาดของตัวอักษร จ. ไม่มีข้อถูก 9. ข้อใดเป็นเครื่องมือที่ใช้ดัดตัวอักษรที่สร้างให้โค้งไปโค้งมา ก. Style ข. Options ค. Paragraphง. Type Toolจ. Warp Text 10. ข้อใดไม่ใช่ส่วนของการปรับค่าการดัดโค้งใน Warp Text ก. Style ข. Bend ค. Horizontal/Vertical ง. Vertical Distortion จ. Horizontal Distortion

102 หน่วยการเรียนรู้ที่ 8 การใช้งาน Layer แบบทดสอน ก่อนเรียน แบบทดสอน ก่อนเรียน แบบทดสอน หลังเรียน แบบทดสอน หลังเรียน บทเรียน

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

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

105 2. การใช้งาน Layers Palette Layers Palette เป็นศูนย์รวมของเลเยอร์ทั้งหมด ที่มีอยู่ในภาพ โดยเรียง ตามลำดับการทำงานเลเยอร์ที่อยู่บนสุดไปจนถึงเลเยอร์ที่อยู่ล่างสุด มี Scoolbar เลื่อนขึ้นลงเพื่อดูเลเยอร์ ต่างๆ แต่ละเลเยอร์จะมีชื่อของ เลเยอร์นั้นๆ อยู่ นอกจากนี้ Layers Palette ยังเป็นเหมือนตัว ควบคุมลักษณะการใช้งานของ เลเยอร์ทั้งหมด เราสามารถเรียก Layers Palette ขึ้นมาใช้งาน โดยการใช้คำสั่ง Window> Show Layers ที่แถบเมนู

106 3.ActiveLayer ในการใช้งานโปรแกรม Photoshop นั้นแม้จะประกอบไปด้วยเล เยอร์หลายเลเยอร์ แต่เราจะทำงานได้เพียงทีละเลเยอร์เท่านั้น เลเยอร์ที่ เรากำลังทำงานอยู่ เราเรียกว่า Active Layer ซึ่งใน Layers Palette จะ ปรากฏเป็นแถบสีน้ำเงิน และมีไอคอนปรากฏอยู่ในช่องแสดงสถานะ ของเลเยอร์ เช่น แสดงว่ากำลังทำการปรับแต่งเลเยอร์อยู่ หรือ เป็น การเพิ่มเลเยอร์ Mask ให้กับเลเยอร์นั้น

107 4. การเปลี่ยนการทำงานไปในเลเยอร์ต่างๆ เราสามารถเรียกเลเยอร์ใดทำงานได้ โดยการเลื่อนเมาส์ ไปที่เลเยอร์ที่ ต้องการ ตัวชี้เมาส์จะเปลี่ยนเป็นรูป แล้ว Click mouse ที่แถบของเลเยอร์นั้น เลเยอร์นั้นจะกลายเป็น Active Layer โดยทันที

108 5. การซ่อนและแสดงเลเยอร์ ภาพภาพหนึ่งจะประกอบไปด้วย เลเยอร์หลายเลเยอร์ ในบางครั้งหากเราต้องการปิด บางเลเยอร์ ไม่ให้มองเห็น ก่อน เพื่อความสะดวกในการทำงาน โดยที่ไม่ได้ลบเลเยอร์นั้น ทิ้ง เราสามารถสั่งให้มีการซ่อน และแสดงเลเยอร์ได้ โดย 1. ซ่อนเลเยอร์โดย Click mouse ที่ เพื่อซ่อนเลเยอร์ ซึ่งช่องสถานะนั้นจะ เปลี่ยนเป็น 2. ผลลัพธ์ที่ได้ คือ เลเยอร์ Mushroom จะหายไป 3. แสดงเลเยอร์โดย Click mouse ที่ เพื่อแสดงเลเยอร์ ช่องสถานะจะเปลี่ยน กลับมาเป็น 4. ผลลัพธ์ที่ได้ เลเยอร์ Mushroom จะปรากฏขึ้นอีกครั้ง 5. ซ่อนและแสดงหลายๆ เลเยอร์พร้อมกัน โดยการ Drag mouse ผ่านช่องสี่เหลี่ยม ต่างๆ 6. ผลลัพธ์ที่ได้ เลเยอร์ Vegetable, Gevi, Orange และ Mushroom จะหายไป

109

110 แบบทดสอบหลังเรียน หน่วยที่ 8 คำสั่ง ให้นักศึกษาเลือกกากบาท (X) ทับข้อที่เห็นว่าถูกที่สุดเพียงข้อเดียวลงในกระดาษคำตอบที่แจกให้ จากตัวเลือกต่อไปนี้ใช้ตอบคำถามข้อ 1-5 ก. Picture Package ข. Crop and Strainghten ค. Contact Sheet ง. Photomerge จ. Web Photo Gallery 1. การเรียงภาพก่อนพิมพ์แบบอัตโนมัติใช้คำสั่งใด 2. คำสั่งอัตโนมัติที่ใช้ในการตัดส่วนเกินออกจากภาพคือข้อใด 3. การสร้างปก CD สามารถทำได้โดยใช้คำสั่งใด 4. คำสั่งที่ใช้สร้างภาพยาว ๆ แบบ Panorama จากการต่อภาพเข้าด้วยกันคือข้อใด 5. การสร้างแกลลอรีแสดงรูปภาพสำหรับเว็บไซต์

111 6. Flatten All Layers หมายถึง ก. สั่งให้โปรแกรมทั้งหมดจัดเรียงภาพ ข. กำหนดจำนวนแถวในแนวตั้งและแนวนอน ค. กำหนดโหมดสีให้เป็นแบบ RGB Color ง. สั่งให้โปรแกรมแสดงข้อความเป็น Page 1 of 2 จ. สั่งให้โปรแกรมรวมภาพทั้งหมดเป็นเลเยอร์เดียว 7. คลิกคำสั่ง File > Automate > Picture Package เป็นรูปแบบของ ก. คำสั่งที่ช่วยจัดเรียงภาพลงในหน้ากระดาษโดยอัตโนมัติ ข. คำสั่งสำหรับกำหนดรายละเอียด ค. คำสั่งเลือกขนาดกระดาษที่ต้องการ ง. คำสั่งเลือก Layout ที่ต้องการพิมพ์ จ. คำสั่งกำหนดความละเอียดและโหมดสี แบบทดสอบหลังเรียน หน่วยที่ 8

112 8. ข้อใดเป็นการกำหนดค่าต่าง ๆ สำหรับสร้าง Layout ของ Web Photo Gallery ก. Banner กำหนดส่วนประกาศตัวกับผู้ชมข. Large Images กำหนดรายละเอียดของรูปภาพขนาดใหญ่ ค. Thumbnails การหนดรายละเอียดให้รูปภาพขนาดเล็ก ง. Custom กำหนดสีให้ส่วนต่าง ๆ จ. ถูกทุกข้อ 9. การกำหนดรายละเอียดในส่วนของ Banner มีส่วนประกอบย่อยอะไรบ้าง ก. กำหนดชื่อแกลลอรีข. ใส่ชื่อเจ้าของภาพ ค. กำหนดรายละเอียดการติดต่อง. กำหนดวันที่ที่ลงรูปภาพ จ. ถูกทุกข้อ 10. คำสั่งที่มักจะใช้ในตอนที่สแกนภาพเข้ามาในเครื่องแล้วต้องการตัดส่วนเกินออกไปจากภาพ คือข้อใด ก. Photomerge ข. Contact Sheet ค. Picture Packageง. Web Photo Gallery จ. Crop and Strainghten แบบทดสอบหลังเรียน หน่วยที่ 8

113 หน่วยการเรียนรู้ที่ 9 การใช้ Mask แบบทดสอน ก่อนเรียน แบบทดสอน ก่อนเรียน แบบทดสอน หลังเรียน แบบทดสอน หลังเรียน บทเรียน

114 คำชี้แจง จงตอบคำถามต่อไปนี้ให้สมบูรณ์มากที่สุด 1. อะไรคือประโยชน์ของการใช้ Quick Mask? ถ้าเรากลับมาทำงานใน Standard Mode จะ พบว่า Mask ที่เราได้สร้างใน Quick Mask Mode เป็นอย่างไร? แบบทดสอบก่อนเรียน หน่วยที่ 9 3. Selection ที่เรา Save เก็บไว้เป็น Mask จะอยู่ที่ ใด? เราสามารถแก้ไข Mask ที่เราได้ Save เป็น Channel แล้ว อย่างไร? Channel แตกต่างจาก Layer อย่างไร?

115 Mask คืออะไร คือการสร้างหน้ากากไว้สำหรับบังส่วนต่างๆของ layer หรือการ ควบคุมชั้น Layer ให้มีความโปร่งใส ในทางกลับกัน ก็สามารถทำให้ Layer ที่ทำไว้เป็นโปร่งใส กลับเป็นทึบแสงได้ดังเดิม ซึ่งจะคล้ายๆ กับ Opacity ซึ่ง Opacity จะทำหน้าที่ลดหรือเพิ่มความ โปร่งใสให้กับภาพทั้ง Layer แต่ Mask จะทำได้เฉพาะจุดที่เราต้องการและจะไม่กระทบถึงส่วน อื่นๆของ Layer ที่เราไม่ต้องการให้มีความโปร่งใสการทำ Mask จะใช้ร่วมกับ Brush Tool และสีที่ ใช้ระบายก็จะใช้แค่ ขาวกับดำ และก็เฉดเทาต่างๆระหว่างขาวกับดำในการทำหน้าที่ควบคุมความ โปร่งใสของภาพสีดำ จะทำให้ Layer มีความโปร่งใส 100% หรือมองเห็น Layerที่อยู่ด้านล่างโดย ที่ Layer ด้านบนกลายเป็นโปร่งใส (Black = 100% transparent)สีเทา จะทำให้ Layer มีความ โปร่งใสที่ขึ้นอยู่กลับความเข้มหรือจางของสีเทา ถ้าความเข้มอยู่กึ่งกลางระหว่างขาวกับดำ ความ โปร่งใส 50% คือสามารถมองทะลุ Layerชั้นบนผ่านไปยังชั้นล่างได้ครึ่งหนึ่ง (Gray = some level of transparent)สีขาว จะทำให้ Layer มีความทึบแสง 100% ในที่นี้หมายถึงไม่ยอมให้มองทะลุไป ถึงLayer ชั้นล่างได้ (White = 100% visible) ดังนี้

116 1. มี 2 layer ทับกัน Background layer เป็นภาพ ดอกไม้ซึ่งเป็นภาพสี 2. ส่วน BW layer เป็นภาพ ดอกไม้สีขาวดำ 3. ต่อมาให้ลองคลิ๊กปุ่มที่ สำหรับการทำ layer mask จาก layer pallet 4. เราก็จะได้ layer mask ออกมา สังเกตว่าถ้าเราเลือก ที่ layer mask เราจะเห็น กรอบสี่เหลี่ยมรอบๆ layer mask นะครับ 1. -การซ่อนส่วนที่ไม่ต้องการของแต่ละ layer ทำได้ด้วยการทาสีดำ -การเปิดเผยส่วนที่ต้องการของแต่ละ layer ทำได้ด้วยการทาสีขาว

117 5. แต่ถ้าเราไม่ได้เลือก layer mask ของเรา เราไปเลือก layer ธรรมดา ที่เป็นภาพเรา เราจะเห็นกรอบ สี่เหลี่ยมรอบๆ layer เพราะว่าถ้า เราไม่ได้เลือก layer mask นั้นเรา ก็จะไม่เห็นผลของการใช้งาน layer mask 6. ต่อมาเราลองไปเลือก brush จาก tool pallet ซึ่งจริงๆแล้วเรา ใช้ดินสอ (Pencil Tool) ก็ได้ แต่ ในทางปฏิบัติแล้วมัน ประยุกต์ใช้ได้ยากแนะนำให้ใช้ แปรง (Brush Tool) แล้วเลือก สีแปรงให้เป็นสีดำ 7. เราสามารถปรับค่าของแปรงดังนี้ 8. ผมปรับขนาดของหัวแปรงแล้วทาสีดำ

118 9. ในทางกลับกัน ถ้าต้องการ แก้ไขในส่วนที่ได้ทำการการบัง (mask)ไปแล้วก็สามารถกลับไป แก้ได้โดยการที่เปลี่ยนสีของ แปรงจากสีดำเป็นสีขาว แล้วทา ลงไปในที่ที่ต้องการที่จะแก้ไข 10. ในที่นี้ผมทาสีขาวในดอกไม้ ดอกหลัง จะเห็นได้ว่าส่วน รายละเอียดของ layer ด้านบนซึ่ง เป็นสีขาวดำนั้นได้กลับคืนมา 11. ลองใช้ gradient tool ที่ เป็นสีดำไปขาวแล้วลาก gradient tool ใน layer mask ของเรา

119 2. วิธีการทำ Selection โดยการใช้ Quick Mask Mode 1.เปิดภาพที่ต้องการขึ้นมา File > Open 2.คลิ๊กที่ ปุ่ม Edit in Quick Mask Mode 3.จากนั้นเลือกอุปกรณ์ Eraser Tool ลองสำรวจที่ปุ่ม ให้อยู่ในแบบนี้ 4.เมื่อคลิ๊กที่ภาพที่เราเปิดขึ้นมา จะเกิดสีแดงขึ้น (สีขาว-ดำ ต้องอยู่แบบตามข้อที่ 3 นะ) ให้เรา ระบายสีแดงนี้ให้ทั่วบริเวณที่เรา 5.เมื่อระบายสี แดงจนทั่วแบบ นี้แล้ว 6. คลิ๊กที่ Edit in Standard Mode เพื่อกลับมาสู่โหมดปกติก็ จะได้พื้นที่ Selection ตาม สีแดงที่เราระบายไว้ 7.จากนั้นกด Delete เพื่อลบพื้นที่ ที่ไม่ต้องการออกก็จะได้ พื้นที่ Selection นำไปตกแต่ง งาน Graphic อื่นๆได้อีก ก็เป็น อีกวิธีหนึ่งในการ ทำ Selection นะครับ แล้วแต่ว่าใครจะถนัดแบบไหน

120 2.ใช้เครื่องมือ ใช้เลเยอร์, Selections และ Masks 1. คลิกที่เครื่องมือ Zoom จากนั้นคลิกลากเพื่อขยายพื้นที่ในส่วนที่คุณต้องการเลือก 2. คลิกที่ไอคอน Default Colors เพื่อตั้งค่า foreground color เป็นสีดำ และให้ background color เป็นสีขาว 3. คลิกที่ปุ่ม Quick Mask Mode 4. คลิกที่เครื่องมือ Brush 5. คลิกที่เมนู Brush Preset เพื่อเปิด Brush picker 6. เลือก hard-edged Brush 7. คลิกลากแถบเลื่อน Size เพื่อปรับขนาดของ Brush 8. ระบายลงพื้นที่ที่คุณต้องการทำ selection 9. คลิกที่ไอคอน Switch Colors เพื่อกลับสีของ foreground และ background ทำให้ foreground color เป็นสีขาว 10. ระบายในส่วนของพื้นที่ที่คุณไม่ต้องการเลือก 11. คลิกที่ไอคอน Switch Colors เพื่อทำให้ foreground color เป็นสีดำอีกครั้ง 12. ทำการระบายต่อจนกระทั่งพื้นที่ๆคุณต้องการเลือกเป็นสีแดงทั้งหมด 13. คลิกที่ปุ่ม Quick mask mode เพื่อปิดการใช้งานในโหมด Quick mask (A) เส้นประจะแสดงให้เห็นถึงพื้นที่ๆเคยถูกระบายด้วยสีแดงเอาไว้ และไม่ได้ถูกเลือก 14. คลิก Select 15. คลิกที่ Inverse ตอนนี้ selection จะปรากฏเฉพาะบนพื้นที่ๆคุณได้ระบายไว้ใน Quick mask mode

121

122 แบบทดสอบหลังเรียน หน่วยที่ 9 คำสั่ง ให้นักศึกษาเลือกกากบาท (X) ทับข้อที่เห็นว่าถูกที่สุดเพียงข้อเดียวลงในกระดาษคำตอบที่แจกให้ 1. ข้อใดคือคุณสมบัติของ Layers Palette ก. ซ่อนรูปภาพข. แสดงรูปภาพ ค. ย้ายตำแหน่งรูปภาพง. ลบรูปภาพ จ. ถูกทุกข้อ 2. ถ้า Layers Palette ไม่ปรากฏขึ้นบนพื้นที่การทำงานเราจะสามารถเรียกขึ้นมาใช้งานได้โดย ก. เลือกเมนู Window > Layersข. File > Open > ชื่อไฟล์ ค. Layer > New > Layer from Background ง. Layer > New > Background from Layer จ. เปิดไอคอนรูปตา 3. ถ้าต้องการจะขยาย Layers Palette สามารถทำได้โดย ก. คลิก Minimize/Maximize (Windows)ข. คลิก Resize Box (Mac OS) ค. ลากจากจุดมุมขวาล่างเพื่อย่อหรือขยายขนาดง. ไม่มีข้อถูก จ. ข้อ ก-ค ถูก

123 4. ถ้าต้องการลบพื้นที่บางส่วนออกจากเลเยอร์ ทำได้โดยวิธีใด ก. คลิกไอคอนรูปแปรงข. คลิก Eraser Tool ค. คลิกไอคอนรูปตาง. คลิก Magic Tool จ. คลิก Tool Options Bar 5. ลำดับชั้นของเลเยอร์ต่าง ๆ ใน 1 รูปภาพ เรียกว่า ก. Toleranceข. Stacking Order ค. Background Layerง. Opacity Option จ. Blending Mode Pop-up 6. ข้อใดไม่ใช่คุณสมบัติของการ Link เลเยอร์เข้าด้วยกัน ก. สามารถเคลื่อนย้ายเลเยอร์ได้ทีเดียวพร้อม ๆ กัน ข. ตำแหน่งของแต่ละเลเยอร์เท่ากัน ค. ระยะห่างของแต่ละเลเยอร์เท่ากัน ง. สะดวกในการใช้งานแต่ละ Layers จ. แยกแต่ละเลเยอร์ให้เป็นสัดส่วน แบบทดสอบหลังเรียน หน่วยที่ 9

124 7. ข้อใดไม่ใช่เอฟเฟ็คการใช้ Layer Style ก. Shadowข. Glowค. Bevelง. Embossจ. Type 8. การซ่อนเอฟเฟ็คแต่ละค่าไว้ชั่วคราวทำได้โดยวิธีใด ก. คลิกที่ไอคอนรูปตาข. คลิกที่ไอคอนรูปแปรง ค. คลิกที่ View Menuง. คลิกที่ Hand Tool จ. คลิก Eyedropper Tool 9. การ Flatten หมายถึง ก. การแยกเลเยอร์ออกจากกันโดยสิ้นเชิงข. การใส่สีที่โปร่งใสลงบนเลเยอร์ใหม่ ค. การเรียงลำดับใหม่ให้กับเลเยอร์ง. การก๊อปปี้เลเยอร์ จ. การรวมหลาย ๆ เลเยอร์ไว้บนเลเยอร์เดียว 10. ถ้าต้องการให้ตัวหนังสือเรืองแสง จะใช้เอฟเฟ็คตัวใด ก. Shadowข. Glow ค. Bevelง. Emboss จ. ถูกทุกข้อ

125 หน่วยการเรียนรู้ที่ 10 การประยุกต์ใช้ Photoshop CS6 แบบทดสอน ก่อนเรียน แบบทดสอน ก่อนเรียน แบบทดสอน หลังเรียน แบบทดสอน หลังเรียน บทเรียน

126 คำชี้แจง จงตอบคำถามต่อไปนี้ให้สมบูรณ์มากที่สุด 1. อธิบายการใช้เครื่องมือวาดรูปของโปรแกรม Photoshop มาพอเข้าใจ …………………………………………………………… …………………………………………………………… ………………………… ………………………… 2.จงบอกเครื่องมือที่ใช้ในการลบภาพมีอะไรบ้างพร้อม อธิบาย …………………………………………………………… …………………………………………………………… …………………………………………………………… แบบทดสอบก่อนเรียน หน่วยที่ อธิบายขั้นตอนการวางเส้น Path อย่างอิสระ มาพอ เข้าใจ…………………………………………………………… …………………………………………………………… 4. อธิบายขั้นตอนการวางซ้อน Layer ของภาพมาพอ เข้าใจ …………………………………………………………… …………………………………………………………… …………………………………………………………… 5. อธิบายใช้เครื่องมือ Slice Tool …………………………………………………………… …………………………………………………………… ……………………………………………………………

127 1 วิธีเปลี่ยนสีผม ด้วยเครื่องมือ magnetic lasso tool - เป็นเครื่องมือ select ภาพแบบแม่เหล็กดูดสี เครื่องมือนี้สะดวก รวดเร็วมาก วิธีใช้ก็คลุม เมาท์หรือคลิกบริเวณที่ ต้องการ select ลากมาให้บรรจบกันจาก จุดเริ่มต้น จากนั้นปรับให้ เส้นดูสมูท ไปยัง Select - > Modify -> Feather - ปรับ Feather ไว้สัก 5px ถามภาพนี้ขนาดใหญ่ 1000x10000 ขึ้นไปก็เลือก สัก 7-10 px เมื่อปรับภาพก็จะ ดูเนียนสมูทขึ้น

128 จากนั้น สร้าง New Fill Layer ไปที่ Layer-> New Fill Layer->Solid Color เลือก Mode : Soft Light แล้วเลือกสีตามต้องการ โปรแกรมก็จะสร้าง Fill Layer ซ่อน ขึ้นมา ถ้าจะเปลี่ยนสีก็กดตรงช่องสีเหลี่ยมสีชมพู ก็ได้

129 1. ทำการสร้างไฟล์ใหม่ขึ้นมานะครับ โดย เลือกที่ File --> New 2. กำหนดขนาดของไฟล์งานตามต้องการครับ โดยใน ที่นี้ผมปรับค่าความกว้างเป็น 800px ความสูงเป็น 600px และตั้งค่า Background Contents เป็น White เพื่อให้พื้นหลังมีสีขาว 2 วิธีสร้างกรอบรูป และเงา เพื่อเพิ่มมิติให้ภาพ

130 3. ต่อมาก็เปิดรูปที่เราต้องการ โดยเลือกที่ File --> Open 4. เลือกรูปที่เราต้องการนำมาใช้ โดยตัวรูปนั้นจะต้องมีขนาดเล็กกว่า งานที่เราสร้างขึ้นมาครับ ถ้ารูปมี ขนาดใหญ่กว่า เราต้องสร้างหน้า งานขึ้นมาใหม่ เพื่อให้มีขนาดใหญ่ 5. เลือกที่เครื่องมือ Move Tool และคลิกเมาส์ซ้ายค้าง ไว้ที่รูปที่เราเปิดขึ้นมา และ ทำการลากรูปมาไว้บนไฟล์ ที่เราสร้างขึ้น 6. ในเมนู Layer ให้ทำการดับเบิ้ล คลิกที่ Layer (ตรงส่วนที่เป็น รูปภาพ) เพื่อทำการใส่เส้นขอบ และเงา

131 7. เราจะได้หน้าต่างใหม่ขึ้นมา ซึ่งเมนูที่เราจะใช้ในที่นี้ มีอยู่ด้วยกัน 2 เมนูคือ - Stroke สำหรับทำการใส่เส้นขอบ - Droup Shadow สำหรับทำการใส่เงาให้ภาพ 8. เลือกที่เมนู Stroke และทำการปรับขนาดและสีของเส้นการปรับค่าต่างๆ มีที่ต้องใช้งานบ่อยๆ ดังนี้ - Size ใช้ปรับขนาดความหนาบางของเส้น โดยมีหน่วยเป็น pixel ครับ - Position ตำแหน่งของเส้น เช่น ให้เส้นที่เราสร้างอยู่ภาพนอกรูปภาพ อยู่กึ่งกลาง หรืออยู่ภายในของรูปภาพ - Opacity ค่าความชัด หรือความเจือจาง ของเนื้อสีขอบครับ - Color เลือกสีของขอบครับ ทำได้โดยการ ดับเบิ้ลคลิก ที่สีภายในกรอบสี่เหลี่ยมครับ

132 9. เลือกที่เมนู Drop Shadow จะมีเครื่องมือควบคุมต่าง ๆ ที่ใช้สำหรับการ กำหนดขนาด และปรับมุมของเงา ซึ่งเครื่องมือที่ใช้กันบ่อย ๆ มีดังนี้ครับ - Opacity สำหรับกำหนดความเข้ม อ่อน ของเงาครับ - Angle กำหนดทิศทางของเงาครับ - Distance สำหรับกำหนดขนาดพื้นที่ของเงา - Size กำหนดขนาดความแผ่กระจายของเงาครับ 10. ในตัวอย่างของผมนะครับ ที่เห็นอยู่คือ ภาพที่ทำการใส่ขอบ และเงาเสร็จ เรียบร้อยแล้วจะมีพื้นที่ด้านหลังเหลืออยู่มากพอสมควร

133 11. ผมได้เลือกที่เครื่องมือ Crop tool เพื่อทำการ crop ให้เหลือเฉพาะพื้นที่ที่เราต้องการครับ 12. เพียงเท่านี้เราก็จะได้ภาพที่มีเส้นขอบ และเงา พร้อมนำไปใช้ได้แล้วครับ

134 แบบทดสอบหลังเรียน หน่วยที่ 10 คำสั่ง ให้นักศึกษาเลือกกากบาท (X) ทับข้อที่เห็นว่าถูกที่สุดเพียงข้อเดียวลงในกระดาษคำตอบที่แจกให้ 1. การปรับแต่งภาพแต่ไม่ได้เลือกพื้นที่เฉพาะเจาะจงหมายความว่าอย่างไร ก. ต้องการปรับแต่งภาพเฉพาะบางจุดข. ต้องการปรับแต่งภาพเฉพาะภาพ ค. ต้องการปรับแต่งภาพทั้งภาพง. ถูกทุกข้อ 2. ข้อใดเป็นสิ่งที่ต้องรู้ก่อนใช้เครื่องมือ Selection ก. Guideข. Ruler ค. Gridง. ถูกทุกข้อ 3. ข้อใดคือประโยชน์ของ Guide Grid และ Ruler ก. ช่วยอำนวยความสะดวกในการจัดวางงานข. ใช้บอกตำแหน่งตัวชี้เมาส์ ค. เครื่องมือวัดต่าง ๆง. ถูกทั้งข้อ ก และ ค 4. ข้อใดไม่ใช่คำสั่งเปลี่ยนหน่วยวัดไม้บรรทัด ก. คลิกขวาแถบไม่บรรทัดข. ดับเบิลคลิกบนแถบไม้บรรทัด ค. Edit >> Preferences >> Units & Rulerง. คลิกบนแถบไม้บรรทัด

135 แบบทดสอบหลังเรียน หน่วยที่ Snap เป็นคำสั่งประเภทใด ก. ช่วยสร้างความม่นยำในการ Selectionข. Crop ภาพ ค. การจัดเรียงวัตถุต่าง ๆง. ถูกทุกข้อ 6. Crop Tool หมายถึงข้อใด ก. การเลือกภาพบางส่วน ข. การตัดภาพบางส่วน ค. การตัดภาพทั้งภาพง. ถูกทั้งข้อ ข และ ค 7. คำสั่งในข้อใดใช้ในการย่อภาพ หมุนภาพ ก. Ctrl+Vข. Ctrl+Tค. Ctrl+Oง. Ctrl+P 8. คำสั่งในข้อใดใช้บิดเบือนภาพให้เพี้ยนจากความจริง ก. Skewข. Rotateค. Scaleง. Distort 9. คำสั่งในข้อใดใช้หมุนภาพแบบ 90 องศา ทวนเข็มนาฬิกา ก. Edit>>Transfrom>>Rotate 90๐ข. Edit>>Transfrom>>Rotate 90๐CW ค. Edit>>Transfrom>>Rotate 90๐ CCWง. ถูกทุกข้อ 10. เครื่องมือ Quick Mask Mode หมายถึงข้อใด ก. รูปแบบหนึ่งของการเลือกข. ไม่ให้ทำการปรับแต่งภาพบริเวณนั้น ค. แยกความแตกต่างพื้นที่ถูกเลือกและไม่ถูกเลือกง. ถูกทุกข้อ

136 The End


ดาวน์โหลด ppt วิชาโปรแกรมกราฟิก. หน่วยที่ 1 ความรู้เบื้องต้นเกี่ยวกับคอมพิวเตอร์กราฟิก หน่วยที่ 2 ภาพ 2 มิติ และ 3 มิติ หน่วยที่ 3 การใช้งานโปรแกรม Adobe Photoshop.

งานนำเสนอที่คล้ายกัน


Ads by Google