รวมไฟล์แผนการสอนรายวิชาโปรแกรมกราฟิก1

10. การเปลี่ยนขนาดของภาพ (Image Size) หากภาพที่เราจะนำมาใช้มีขนาดไม่ตรงกับความต้องการ เช่น เราต้องการนำภาพที่มีขนาดไฟล์ ใหญ่มาก มาใช้เป็นเพียงภาพติดบัตร ก็ให้เราทำการลดขนาดของไฟล์ภาพนั้นเพื่อให้เหมาะกับการใช้งาน ทำให้ไม่เปลือง เนื้อที่ และโปรแกรมจะทำงานไต้เร็วขึ้นด้วย แต่การเปลี่ยนขนาดนี้จะไม่เหมาะกับการ ขยายภาพให้ใหญ่ขึ้น เพราะภาพที่ออกมาจะไม่คมชัดเหมือนภาพต้นฉบับ 1. เลือกคำสั่ง Image>Image Size... จะปรากฏหน้าต่าง Image Size ขน 2. กำหนดขนาดภาพใหม่ ในค่า Image Size ตามต้องการ ดังนี้

• Pixel Dimensions กำหนดขนาดความกว้างและความสูงของภาพเป็นจำนวนพิกเซล • Document Size กำหนดขนาดของภาพที่จะถูกพิมพ์ออกทางเครื่องพิมพ์ 3. คลิกที่ปุ่ม เพื่อสั่งให้โปรแกรมเปลี่ยนขนาดภาพใหม่ตามที่เรากำหนด 11. การเพิ่มพื้นที่ของภาพ (Canvas Size) ในระหว่างที่เราตกแต่งภาพอาจจะมีความต้องการให้พื้นที่ การทำงานเพิ่มขึ้นอีก เพื่อจะมีพื้นที่พอใส่รายละเอียดต่างๆ เพิ่ม เติมลงไปในงานกราฟกของเราไต้ สามารถท่า ไต้ดังนี้ 1. เลือก Image>Canvas Size จะปรากฏหน้าต่าง Canvas Size ขนมา 2. เปลี่ยนขนาดพื้นที่ภาพตามความกว้าง (Width) และความสูง (Height) ที่ต้องการใน ตัวอย่างพิมพ์ ความสูงเป็น 33.86 เซนติเมตร(ความสูงเป็น 2 เท่าจากเติม) 3. กำหนดทิศทางของพื้นที่ว่าจะเพิ่มเข้ามาต้านใด เช่น บน ล่าง ซ้าย หรือขวา สังเกตว่าใน ตัวอย่างจร เพิ่มพื้นที่ในตำแหน่งต้านล่าง โดยให้ภาพเติมชิตอยู่ต้านบนของพื้นที่ภาพ 4. คลิกเมาส์ที่ปุ่ม เพื่อเพิ่มพื้นที่ 5. สังเกตเห็นว่าขนาดพื้นที่ภาพนั้นจะเพิ่มขึ้น และมีสีตามสี1ของแบ็คกราวนด์ ทดลองวางภาพอื่น ๆ เพิ่มเข้ามาในพื้นที่ที่ไต้เพิ่มเอาไว้โดยเปิดภาพใหม่ขึ้นมา จากนั้นลาก ภาพนั้น มาปล่อยบนพื้นที่ที่เตรืยมไว้

12. ย้อนกลับการทำงานในขั้นตอนล่าสุด ทันทีที่เราทำงานผิดพลาด เราสามารถทำให้ย้อนกลับไปยังการทำงานล่าสุดก่อนการผิดพลาดได้ โดย ยกเลิกขั้นตอนที่เพิ่งทำผ่านมาด้วยคำสั่ง Edit>Undo หรือกดปม <Ctrl>+Z>

13. ย้อนกลับการทำงานในหลายขั้นตอน ทุกครั้งที่มีการเปลี่ยนแปลงภาพ ขั้นตอนการทำงานนั้นจะถูกบันทึกลงในพาเนล History โดย อัด โนมํตโดยขั้นตอนที่ทำล่อนจะลูกเรืยงอยู่บนและขั้นตอนล่าสุดจะอยู่ล่างสุดในรายการ ดังนั้นถ้าเรา ทำงาน ผิดพลาดมาหลายคำสั่ง จะต้องย้อนกลับการทำงานด้วยพาเนล History เพราะคำสั่ง Undo ย้อนได้ เพียง คำสั่งที่ได้ทำไปล่าสุดเท่านั้น ดูตัวอย่างดังนี้

6. กิจกรรมการเรียนรู้ ขั้นนำเข้าสู่บทเรียน 1. ตรวจสอบรายชื่อนักศึกษาที่เข้าเรียน 2. ให้นักศึกษาอ่านหนังสือทำความเข้าใจเกี่ยวกับหน่วยการเรียน 3. ร่วมสนทนาเกี่ยวกับเรื่องหลักในการสร้างงานกราฟิกและการใช้เครื่องมือพื้นฐาน ขั้นสอน 5. บอกจุดประสงค์การเรียน 6. บรรยาย อธิบาย ยกตัวอย่าง แสดงวิธีการปฎิบัติในหัวข้อการเรียน การเทสีด้วยถังสี การเทสี แบบไล่เฉดสี การระบานสีด้วยพู่กันและดินสอ การลบส่วนประกอบในภาพที่ไม่ต้องการ การใส่ ข้อความขั้นเบื้องต้น การซูมขยาย-ย่อภาพ การเปลี่ยนขนาดของภาพ การเพิ่มพื้นที่ของภาพ ย้อนกลับการทำงานในขั้นตอนล่าสุด และหลายขั้นตอน และให้นักศึกษาปฎิบัติไปพร้อมกัน 7. ให้คำแนะนำ 8. บอกเทคนิควิธีการปฏิบัติและการนำไปประยุกต์ใช้ในชีวิตประจำวัน เพื่อให้ผู้เรียนเกิดมโนภาพ และมีความคิดรวมยอดในสาระการเรียนรู้ 9. ประเมินพฤติกรรมรายบุคคลโดยอาจารย์จะซักถามในแต่ละบุคคล ขั้นสรุป 5. ครูและนักเรียนร่วมกันสรุปสาระสำคัญ 6. เปิดโอกาสให้นักเรียนซักถามข้อสงสัย 7. มอบหมายให้ไปหัดทำและศึกษาเพิ่มเติม 8. ทำแบบทดสอบ 7. สื่อและแหล่งเรียนรู้ 7.1 สื่อ 8. หนังสือประกอบการเรียนวิชา โปรแกรมกราฟิก 9. ใบงานประจำหน่วยการเรียนรู้แต่ละหน่วย 10. แบบฝึกหัดประจำหน่วยการเรียนรู้ 11. ตัวอย่างแฟ้มสะสมชิ้นงาน 12. ชุดการสอน PowerPoint แต่ละหน่วยการเรียน 13. บทเรียนออนไลน์ 14. คอมพิวเตอร์ 7.2 แหล่งเรียนรู้ 6. ห้องสมุดสถานศึกษา 7. ห้องปฏิบัติการคอมพิวเตอร์และสารสนเทศ 8. ผู้ปกครอง เพื่อน ๆ รุ่นพี่ และบุคลากรในสถานศึกษา 9. หนังสือ E-book, ELearning, Website ที่เกี่ยวข้อง 10. ครูผู้สอน

8. หลักฐานการเรียนรู้ - ใบความรู้ - ใบงาน / ผลงานนักเรียน 9. การวัดและประเมินผล 9.1 เครื่องมือประเมิน 1. ประเมิน : ทดสอบ 2. เครื่องมือ : แบบทดสอบ 3. เกณฑ์การให้คะแนน : ประเมินจากแบบประเมินกิจกรรมการเรียนรู้ที่ 2.1 4. เกณฑ์การตัดสินการผ่าน : พอใช้(5 – 6 คะแนน) 9.2 เกณฑ์การประเมิน ดีมาก (9 – 10 คะแนน) ดี (7 – 8 คะแนน) พอใช้ (5 – 6 คะแนน) ปรับปรุง (ต่ำกว่า 5 คะแนน)

10. บันทึกผลหลังการจัดการเรียนรู้ 10.1 ข้อสรุปหลังการจัดการเรียนรู้ 10.2 ปัญหาที่พบ 10.3 แนวทางแก้ปัญหา ลงชื่อ............................................. (.....................................................) ผู้ทำแผนการจัดการเรียนรู้

แบบทดสอบก่อนเรียนหน่วยที่ 2 หลักการสร้างงานกราฟิกและใช้เครื่องมือพื้นฐาน คำชี้แจง จงทำเครื่องหมายกากบาท (X) ทับข้อที่ถูกต้องที่สุด 1. มาตรฐานของสีโฟร์กราวนด์และสีแบ็คกราวนด์คือสีใด ก. ขาวทั้งคู่ ข. ดำกับขาว ค. ขาวกับดำ ง. ขึ้นอยู่การใช้งานล่าสุด 2. ข้อใดไม่ใช่วิธีการเลือกสีโฟร์กราวนด์และแบ็คกราวนด์ ก. เลือกจาก Color Picker ข. เลือกจาก Color Panel ค. เลือกจากSwatch Panel ง. เลือกจาก Color Sample Tool 3. ข้อใดคือลักษณะการเลือกสีจาก Color Picker ก. เลือกตามสเปคตรัมสีหรือกำหนดค่าเป็นตัวเลข ข. เลือกโดยการเลื่อนสไลด์เพื่อระบุค่าสี ค. เลือกจากจานสีส่วนตัวที่เรานำมาใช้บ่อย ง. เลือกจากการคัดลอกจากสีจากไฟล์ภาพที่ต้องการ 4. ข้อใดคือลักษณะการเลือกสีจาก Color Panel ก. เลือกตามสเปคตรัมสีหรือกำหนดค่าเป็นตัวเลข ข. เลือกโดยการเลื่อนสไลด์เพื่อระบุค่าสี ค. เลือกจากจานสีส่วนตัวที่เรานำมาใช้บ่อย ง. เลือกจากการคัดลอกจากสีจากไฟล์ภาพที่ต้องการ 5. ข้อใดคือลักษณะการเลือกสีจากSwatch Panel ก. เลือกตามสเปคตรัมสีหรือกำหนดค่าเป็นตัวเลข ข. เลือกโดยการเลื่อนสไลด์เพื่อระบุค่าสี ค. เลือกจากจานสีส่วนตัวที่เรานำมาใช้บ่อย ง. เลือกจากการคัดลอกจากสีจากไฟล์ภาพที่ต้องการ 6. ถ้าต้องการลบพื้นที่ภาพในส่วนที่ไม่ต้องการออกโดยแทนที่ด้วยสีแบ็คกราวนด์ควรใช้เครื่องมือใด ก. Eraser Tool ข. Background Eraser Tool ค. Magic Eraser Tool ง. Color Eraser Tool 7. ถ้าต้องการลบพื้นที่ภาพให้มีลักษณะโปร่งใส ควรใช้เครื่องมือใด ก. Eraser Tool ข. Background Eraser Tool ค. Magic Eraser Tool ง. Color Eraser Tool 8. ถ้าต้องการลบพื้นที่ภาพที่มีสีใกล้เคียงกันให้มีลักษณะโปร่งใส ควรใช้เครื่องมือใด ก. Eraser Tool ข. Background Eraser Tool ค. Magic Eraser Tool ง. Color Eraser Tool 9. ถ้าต้องการย่อภาพให้มีขนาดเล็กลง ให้กดปุ่มใดต่อไปนี้ร่วมด้วย ก. <Ctrl> ข. <Alt> ค. <Shift>+<Ctrl> ง. <Shift>+<Ctrl> 10. นอกจากการใช้ปุ่ม <Ctrl>+Z เพื่อย้อนกลับการทำงานในขั้นตอนที่ผ่านมา ยังสามารถใช้คำสั่งใดได้ ก. Edit>History ข. File>Recent ค. Edit>Undo ง. File>History เฉลย 1. ค 2. ง 3. ก 4. ข 5. ค 6. ก 7. ข 8. ค 9.ข 10. ค

กิจกรรมการเรียนรู้ที่ 2.1 คำสั่ง 1. ให้นักศึกษาเลือกพรรณไม้ที่นักศึกษาใจ คนละ 1 ต้น 2. ให้นักศึกษาค้นคว้าข้อมูลพรรณไม้ ประกอบด้วย ชื่อไทย ชื่อวิทยาศาสตร์ ชื่อวงศ์ ชื่อสามัญ ประโยชน์ ดังรูป 3. ให้นักศึกษาร่างรูปแบบป้ายพรรณไม้ ตกแต่งให้สวยในกระดาษ A4 ระบายสีให้สวยงาม

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

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

1. Rectangular Marquee Tool ใช้เลือกพื้นที่เป็นรูปสี่เหลี่ยมผืนผ้า และสี่เหลี่ยมจัตุรัส 2. Elliptical Marquee Tool ใช้เลือกพื้นที่เป็นรูปวงกลมและวงรี 3. Single Row Marquee Tool ใช้เลือกพื้นที่เป็นแนวเส้นตรงในแนวนอน ความกว้าง 1 พิกเซล 4. Single Column Marquee Tool ใช้เลือกพื้นที่เป็นแนวเส้นตรงในแนวตั้ง ความกว้าง 1 พิก เซล การเลือกพื้นที่โดยใช้ Rectangular Marquee Tool และ Elliptical Marquee Tool 1. คลิกเลือกเครื่องมือ Rectangular Marquee Tool และ Elliptical Marquee Tool 2. กำหนดค่าบนออปชั่นบาร์ 3. แดรก mouse เลือกพื้นที่บริเวรที่ต้องการ เลือกเป็นสี่เหลี่ยม เลือกเป็นวงกลม การเลือกพื้นที่โดยใช้ Single Row Marquee Tool และ Single Column Marquee Tool

1. คลิกเลือกพื้นที่โดยใช้ Single Row Marquee Tool และ Single Column Marquee Tool 2. ใช้ mouse คลิกลากบนภาพจะปรากฎเส้น Selection ในแนวนอนหรือแนวตั้งขึ้นมา ซึ่งจะมีความ หนาเพียง 1 พิกเซลเท่านั้น เลือกพื้นที่สูง 1 พิกเซล เลือกพื้นที่กว้าง 1 พิกเซล การปรับแต่งการเลือกพื้นที่ในกลุ่ม Marquee Tool เราสามารถกำหนดคุณลักษณะต่าง ๆ ของ Marquee Tool ได้ที่ออปชั่นบาร์ โดยมีรายละเอียดดังนี้ 1. เพิ่มพื้นที่ใหม่หรือตัดพื้นที่ที่เลือก 2. กำหนดความฟุ้งเบลอของขอบพื้นที่ที่เลือก 3. ปรับขอบให้เรียบ 4. รูปแบบของกลุ่มเครื่องมือ Marquee 5. กำหนดความกว้างของพื้นที่ที่เลือก 6. กำหนดความสูงของพื้นที่ที่เลือก 7. กำหนดลักษณะเส้นขอบการเลือกพื้นที่

2. เลือกพื้นที่แบบอิสระ (Lasso Tool) การเลือกพื้นที่ในลักษณะนี้เหมาะสมกับภาพที่ไม่เป็นรูปทรงเลขาคณิต ดังนั้นการเลือกพื้นที่ภาพจะเป็น การลากเส้นตามขอบภาพ ลากไปจนบรรจบจุดเริ่มต้นอีกครั้งซึ่งการลากเส้นมีอยู่ 3 ลักษณะดังนี้ เลือกพื้นที่โดยใช้ Lasso Tool ลากเส้นแบบอิสระ เป็นการเลือกพื้นที่โดยการลากเมาส์ไปตามแนวของภาพจะต้องอาศัยความนิ่งของมือเป็นหลัก วิธีใช้ Lasso Tool 1. หลังจากเปิดไฟล์ภาพขึ้น Click mouse ที่ไอคอน Lasso Tool ที่อยู่บน Toolbox จะปรากฏ ตัวชี้เมาส์ เป็นรูป บนพื้นที่ภาพ 2. Click mouse ค้างไว้ และลากไปตามขอบพื้นที่ที่เราต้องการเลือก 3. ลากพื้นที่เลือกจนกว่าจะบรรจบที่จุดเริ่มต้น แล้วปล่อยเมาส์ จะปรากฏอาณาเขตพื้นที่ที่เลือก เป็น เส้นประ หรือถ้าเราปล่อยเมาส์ที่ตำแหน่งใดโปรแกรม จะลากเส้นประตรงไปยังจุดเริ่มต้นอัตโนมัติ 4. เราสามารถย้าย Selection ได้โดยเมื่อเราเลื่อนเมาส์ไปที่บริเวณเส้นประ จะปรากฏตัวชี้เมาส์รูป แล้ว Click mouse ค้างไว้ จะปรากฏตัวชี้เมาส์รูป หลังจากนั้นลากไปยังตำแหน่งที่ต้องการ

เลือกพื้นที่โดยใช้ Polygonal Lasso Tool ลากเส้นแบบเส้นตรง การเลือกพื้นที่โดยการลากเส้นตรงไปตามภาพเชื่อมกันเป็นมุมเหลี่ยม 1. คลิกเมาส์เลือกไอคอน เมื่อเลื่อนเมาส์มายังบริเวณพื้นที่ภาพตัวชี้เมาส์ 2. เลือกจุดเริ่มต้นของพื้นที่ที่ต้องการ ปล่อยเมาส์และคลิกยังตำแหน่งที่ 2 และจุดถัดไปเป็นจุดๆ จนถึงจุดเริ่มต้นใหม่ เลือกพื้นที่โดย Magnetic Lasso Tool ลากเส้นแบบใช้ตัวช่วย สำหรับภาพที่มีขอบคมชัด และสีขอบของเส้นขอบต่างกับพื้นหลังของภาพอย่างชัดเจน เราสามารถใช้ Magnetic Lasso Tool ที่เป็นเหมือนแม่เหล็กดูดเส้นประกอบของการเลือกพื้นที่ให้ติดหนึบเข้ากับแนวของ ภาพได้อย่างง่ายดาย 1. คลิกเมาส์เลือกไอคอน เมื่อเลื่อนเมาส์มายังบริเวณพื้นที่ภาพตัวชี้เมาส์ 2. เลือกจุดเริ่มต้นของพื้นที่ที่ต้องการ ปล่อยเมาส์และลากไปจุดที่ต้องการจนกระทั่งบรรจบ 3. เลือกพื้นที่แบบเร็วทันใจ Quick Selection Tool 1. กดคลิกที่เครื่องมือ Quick Selection Tool 2. คลิก mouse ระบายภาพในส่วนที่ต้องการเลือกพื้นที่ พื้นที่บริเวณข้างเคียงที่มีค่าสีใกล้เคียงกับส่วน ที่เราลาก mouse ผ่าน

จะถูกเลือกพื้นที่ด้วยเส้นประทันที 4. เลือกพื้นที่อัตโนมัติ Magic Wand Tool 1. คลิก muuse Magic Wand Tool 2. คลิก mouse บนภาพเพียงครั้งเดียว ทุกส่วนที่มีสีใกล้เคียงกับจุดที่เราคลิก จะถูกเลือกด้วยเส้นประ แสดงล้อมรอบทันที 5. เลือกพื้นที่เพื่อตัดภาพเฉพาะส่วนที่ต้องการ Crop Tool ในการตกแต่งภาพนั้น บางครั้งเราต้องการเพียงบางส่วนของภาพเท่านั้น วิธีการที่ทำได้ง่ายที่สุด คือ การใช้เครื่องมือ Crop ที่จะช่วยเราในการเลือกบางส่วนของภาพที่ต้องการใช้ และตัดส่วนที่เหลือจากภาพ ทิ้งไป ดังนั้นภาพที่ได้จะมีขนาดเล็กลง ซึ่งส่งผลให้ไฟล์ภาพ มีขนาดเล็กลงตามไปด้วย การทำงานของเครื่องก็ จะเร็วขึ้น เพราะไม่ต้องเสียเวลาไปประมวลผลส่วนอื่นที่ไม่จำเป็น วิธีการใช้งานมีดังนี้ คือ 1. Click mouse เลือกไอคอน ที่ Toolbox จะปรากฏค่าต่าง ๆ ใน Tool Option bar ดังนี้ 2. Drag mouse บริเวณพื้นที่ภาพเพื่อเลือกพื้นที่ต้องการ 3. ให้กำหนดค่าของการตัดภาพใน Tool Options bar โดยมีตัวเลือกต่างๆ ดังนี้ • Shield cropped area เติมสีลงบริเวณภายนอกพื้นที่ภาพที่จะตัด • Color เลือกสีที่จะเติมลงในบริเวณภายนอกพื้นที่ภาพที่จะตัด • Opacity ค่าความโปร่งแสงของสีที่จะเติมลงในบริเวณภายนอกพื้นที่ภาพที่จะตัด • Perspective ปรับพื้นที่การตัดให้ได้ภาพที่มีมิติ ( สามารถดูรายละเอียดของ Perspective ได้จากเรื่อง Transform) • Cropped Area เลือกผลลัพธ์ของภาพที่ตัด

• Delete ตัดเอาภาพที่เลือกพื้นที่ไว้ โดยลบส่วนที่ไม่ต้องการทิ้งไป • Hide ตัดเอาภาพที่เลือกพื้นที่ไว้ แต่ซ่อนส่วนที่ไม่ต้องการไว้ เพื่อเราสามารถ เลื่อนเปลี่ยนเอา ภาพในตำแหน่งอื่นแทนได้ 4. หมุนเพื่อปรับแต่พื้นที่ที่เลือก เมื่อได้พื้นที่ที่ต้องการแล้วกดปุ่ม <Enter> หรือ Click mouse ปุ่ม เพื่อตัดเอาภาพที่ต้องการ ถ้าจะยกเลิกการตักภาพให้ Click mouse ที่ปุ่ม 5. จะปรากฏภาพใหม่ที่เรา Crop ไว้ ตามขนาดและทิศทางที่เราเลือก .. 6. เทคนิคการเลือกพื้นที่ภาพโดยใช้เส้นพาธ Pen Tool ใน Photoshop ก่อนอื่น ถ้าคลิกดูจะเห็นเครื่องมือย่อยอีก 5 อย่าง 1 = เครื่องมือหลัก ใช้ลากกำหนดจุดหรือลากเส้น path (เปรียบเสมือนเส้นร่าง) 2 = เหมือนกับแบบแรก แต่จะอิสระ ลากไปได้เรื่อยๆแล้วแต่มือเราจะลากไป (จะเกิดจุดยุบยับเลย) 3 = ใช้เพิ่มจุด path

4 = ใช้ลบจุด path 5 = ใช้แปลงจุด path นอกจากนี้ ส่วนที่เกี่ยวข้องในการวาด แถบด้านบน 6 = เวลาเราลากจะมีแค่เส้น path ธรรมดา 7 = จะเกิดแถบสีขณะที่เราลากเส้น เหมือนกับเราเทสีด้วยตลอดเวลา ส่วนใหญ่จะเลือก 6 แล้วค่อยลงสีทีหลัง ในหัวข้อ path 8 = ช่องของเส้น path ที่เราสร้างขึ้น เหมือนกับ layer ในหน้าต่างทำงานปกติ 9 = สร้างเส้นไข่ปลาจากเส้น path เหมือนกับเวลาใช้เครื่องมือ Magic wand Tool 10 = stroke เส้นจากเส้น path 11 = fill หรือเทสีจากเส้น path

ขั้นตอน 1 เริ่มแรกเราก็จิ้มจึ้กลงไป 1 จุดก่อน (จิ้มแล้วปล่อยเมาส์) ขั้นตอน 2 ไปจิ้มอีกจุดหนึ่ง มันก็จะเกิดเส้นที่เชื่อมระหว่างจุดสองจุด ขั้นตอน 3 - 5 ทำแบบเดียวกันครับจนครบ เกิดเป็นเส้น path รูปสี่เหลี่ยม ขั้นตอน 6 กดที่เครื่องมือเทสี มันก็จะเติมสีลงไปในช่องว่างที่เกิดจากการลากเส้น วิธีข้างต้นจะใช้วาดเฉพาะเส้นตรงธรรมดา ก็เพิ่มจุดไปเรื่อยๆแล้วกลับมาบรรจบที่จุดแรก - ภาพตัวอย่างครับ สังเกตว่าส่วนหักมุมก็คือจุดที่เรากำหนดทั้งหมด - เมื่อได้เส้นตรงแล้วในกรณีที่จะวาดเส้นโค้งก็ทำตามนี้ สาธิตการวาดรูปครึ่งวงกลม ... ขั้นตอน 1 ก็จิ้มไปก่อน 1 จุด ขั้นตอน 2 จิ้มจุดเพิ่มแต่ยังกดเมาส์ค้างไว้นะครับ ขั้นตอน 3 ลากเมาส์ไปด้านข้างเพื่อให้เกิดเส้นที่ใช้ดัดส่วนโค้ง แล้วปล่อยเมาส์ ขั้นตอน 4 - 5 จุดเพิ่มจนครบตามรูปที่เราต้องการ ขั้นตอน 6 กดเทสี ก็จะได้รูปครึ่งวงกลมขึ้นมา ข้อสังเกต เส้นที่เกิดขึ้นข้างๆจุด 2 เส้น ถ้าเราดึงยืดเข้า - ออก เอียงซ้าย - ขวาก็จะปรับให้เส้น path โค้งมาก น้อยต่างกันครับ

- เวลาเราจะปรับความโค้ง ก็เลือกลูกศรสีขาวแล้วหมุน จะปรับได้ทีละจุด - - ถ้าเป็นลูกศรสีดำ จะเป็นการย้ายตำแหน่งเส้น path ที่เราวาดทั้งเส้นครับ - มีอีกวิธีในการสร้างเส้นโค้งครับ แรกๆอาจจะฝึกจากวิธีนี้ก่อนก็ได้ ... ขั้นตอน 1 ก็สร้างจุดธรรมดา เกิดเส้น path เป็นเส้นตรง ขั้นตอน 2 กดเครื่องมือปากกาที่มีเครื่องหมายบวก แล้วจุดเพิ่มเข้าไปบนเส้น path ระหว่างจุดเดิม ขั้นตอน 3 ใช้ลูกศรลากเพื่อให้เกิดเส้นโค้ง (สังเกตว่าจุดที่เพิ่มขึ้นมาจะต่างจากจุดที่เราสร้างไว้) ขั้นตอน 4 ก็เทสีตามปกติ ในกรณีที่เราต้องการเปลี่ยนจุดที่เป็นส่วนโค้งให้เป็นจุดหักมุมตรง หรือจุดมุมเป็นจุดโค้ง เลือกเครื่องมือ convert point tool แล้วก็จิ้มตรงจุดที่ต้องการเปลี่ยน ถ้าจิ้มธรรมดา = จุดหักมุมตรง, ถ้าจิ้มแล้วลาก = จุดเส้นโค้ง

ไว้ใช้แก้ไขหรือเพิ่มจุดเวลาต้องการให้เส้นดูสมจริงขึ้นครับ - ภาพตัวอย่างการลากเส้น path เป็นเส้นโค้งกับจุดหักมุมรวมกัน ข้อแนะนำเพิ่มเติม ก่อนการเทสี ให้เราเลือกเครื่องมือ brush หรือหัวแปรงก่อนทุกครั้งนะครับ ไม่งั้นภาพจะไม่เรียบ และการเลือกหัวแปรงแบบต่างๆ จะทำให้เกิด effect ที่แตกต่างกันด้วย - ตัวอย่างการ stroke เส้นด้วยหัวแปรงแบบต่างๆ - เส้น path สามารถปรับขนาดใหญ่เล็กได้เหมือน layer ปกติ (Edit > Transform > Scale ... ซึ่งจะปรับให้ใหญ่เท่าไหร่ก็ได้แล้วค่อยเทสี ภาพก็จะคมชัดเสมอ) ต่อไปก็เป็นการนำไปกระยุกต์ใช้ ถ้าฝึกจนชิน ก็จะใช้วาดภาพขึ้นมาใหม่ หรือใช้ตัดขอบภาพให้คมชัดมากขึ้นก็ ได้

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

6. กิจกรรมการเรียนรู้ ขั้นนำเข้าสู่บทเรียน 1. ตรวจสอบรายชื่อนักศึกษาที่เข้าเรียน 2. ให้นักศึกษาอ่านหนังสือทำความเข้าใจเกี่ยวกับหน่วยการเรียน 3. ร่วมสนทนาเกี่ยวกับเรื่องการปรับมุมมองการทำงานและการใช้เครื่องมือพื้นฐาน ขั้นสอน 10. บอกจุดประสงค์การเรียน 11. บรรยาย อธิบาย ยกตัวอย่าง แสดงวิธีการปฎิบัติในหัวข้อการเรียน หัวข้อการเรียน การเกิดภาพ ในคอมพิวเตอร์กราฟิก การประมวลผลภาพ ความสามารถโดยรวมของโปรแกรม Photoshop และเรียกใช้งาน นำเข้าไฟล์จากกล้องดิจิตอลและสแกนเนอร์ สร้างไฟล์ใหม่และบันทึกไฟล์ใหม่ เบื้องต้น และให้นักศึกษาปฎิบัติไปพร้อมกัน 12. บอกเทคนิควิธีการปฏิบัติและการนำไปประยุกต์ใช้ในชีวิตประจำวัน 13. ประเมินพฤติกรรมรายบุคคลโดยอาจารย์จะซักถามในแต่ละบุคคล ขั้นสรุป 9. ครูและนักเรียนร่วมกันสรุปสาระสำคัญ 10. เปิดโอกาสให้นักเรียนซักถามข้อสงสัย 11. มอบหมายให้ไปหัดทำและศึกษาเพิ่มเติม 12. ทำแบบทดสอบ 7. สื่อและแหล่งเรียนรู้ 7.1 สื่อ 15. หนังสือประกอบการเรียนวิชา โปรแกรมกราฟิก 16. ใบงานประจำหน่วยการเรียนรู้แต่ละหน่วย 17. แบบฝึกหัดประจำหน่วยการเรียนรู้ 18. ตัวอย่างแฟ้มสะสมชิ้นงาน 19. ชุดการสอน PowerPoint แต่ละหน่วยการเรียน 20. บทเรียนออนไลน์ 21. คอมพิวเตอร์ 7.2 แหล่งเรียนรู้ 11. ห้องสมุดสถานศึกษา 12. ห้องปฏิบัติการคอมพิวเตอร์และสารสนเทศ 13. ผู้ปกครอง เพื่อน ๆ รุ่นพี่ และบุคลากรในสถานศึกษา 14. หนังสือ E-book, ELearning, Website ที่เกี่ยวข้อง 15. ครูผู้สอน 8. หลักฐานการเรียนรู้ - ใบความรู้ - ใบงาน / ผลงานนักเรียน

9. การวัดและประเมินผล 9.1 เครื่องมือประเมิน 5. ประเมิน : ทดสอบ 6. เครื่องมือ : แบบทดสอบ 7. เกณฑ์การให้คะแนน : ประเมินจากแบบประเมินกิจกรรมการเรียนรู้ที่ 3.1 8. เกณฑ์การตัดสินการผ่าน : พอใช้(5 – 6 คะแนน) 9.2 เกณฑ์การประเมิน ดีมาก (9 – 10 คะแนน) ดี (7 – 8 คะแนน) พอใช้ (5 – 6 คะแนน) ปรับปรุง (ต่ำกว่า 5 คะแนน)

10. บันทึกผลหลังการจัดการเรียนรู้ 10.1 ข้อสรุปหลังการจัดการเรียนรู้ 10.2 ปัญหาที่พบ 10.3 แนวทางแก้ปัญหา ลงชื่อ............................................. (.....................................................) ผู้ทำแผนการจัดการเรียนรู้

แบบทดสอบก่อนเรียนหน่วยที่ 3 การแต่งและตัดภาพบางส่วน คำชี้แจง จงทำเครื่องหมายกากบาท (X) ทับข้อที่ถูกต้องที่สุด 1. ข้อใดคือการเลือกพื้นที่ภาพเป็นเส้นตรงในแนวนอน ก. Rectangular Marquee Tool ข. Elliptical Marquee Tool ค. Single Row Marquee Tool ง. Single Column Marquee Tool 2. ข้อใดคือการเลือกพื้นที่ภาพที่มีสีใกล้เคียงกับค่าสีณ จุดพิกเซลที่เราคลิกเลือก ? ก. Lasso Tool ข. Polygonal Lasso Tool ค. Magnetic Lasso Tool ง. Magic Wand Tool 3. ข้อใดคือคุณสมบัติที่ทำให้ขอบพื้นที่ที่เลือกเรียบขึ้น ก. Feather ข. Anti-Aliased ค. Edge Contrast ง. Frequency 4. การเลือกพื้นภาพด้วยเครื่องมือในข้อใดจะไม่มีการกำหนดค่าความฟุ้งเบลอ (Feather) ก. Lasso Tool ข. Polygonal Lasso Tool ค. Magnetic Lasso Tool ง. Magic Wand Tool 5. ข้อใดคือลักษณะตัวชี้เมาส์ของการเลือกพื้นที่เฉพาะส่วนที่ตัดกันของพื้นเดิม ก. ข. ค. ง. 6. ข้อใดคือการเลือกพื้นที่ภาพในส่วนที่ซับซ้อน โดยขอบภาพจะเป็นเส้นผม หรือขนสัตว์ ก. Extracting ข. Quick Mask Mode ค. Magic Wand Tool ง. Magnetic Lasso Tool 7. ข้อใดคือคีย์ลัดที่ใช้ยกเลิกการเลือกพื้นที่ที่ได้เลือกไว้ ก. <Alt>+คลิกเมาส์ ข. <Ctrl+D> ค. <Shift+Ctrl+I> ง. <Shift>+คลิกเมาส์ 8. ข้อใดคือคีย์ลัดของการสลับไปเลือกขอบเขตพื้นที่ตรงกันข้าม ? ก. <Ctrl+A> ข. <Ctrl+D> ค. <Shift+Ctrl+I> ง. <Shift+Ctrl+D> 9. สัญลักษณ์ตัวชี้เมาส์รูป สื่อความหมายตรงกับข้อใด ก. การเลือกพื้นที่ใหม่ ข. การเลือกขอบเขตภาพเพิ่มเติมจากเดิม ค. การลดขอบเขตภาพที่เลือกไว้จากเดิม ง. การเลือกพื้นที่จนครบรอบภาพที่ต้องการ 10. ข้อใดคือการใส่เส้นขอบลงในพื้นที่ที่เลือกไว้ ก. คำสั่ง Edit>Fill ข. คำสั่ง Edit>Stroke ค. เครื่องมือ Paint Bucket Tool ง. เครื่องมือ Gradient Tool เฉลย 1. ค 2. ง 3.ข 4. ง 5.ข 6. ก 7. ข 8. ค 9. ง 10. ข

กิจกรรมการเรียนรู้ที่ 3.1 คำสั่ง 4. ให้นักศึกษาออกแบบป้ายพรรณไม้ โดยข้อมูลในป้ายประกอบด้วย - รูปภาพพรรณไม้ - ชื่อไทย - ชื่อวิทยาศาสตร์ - ชื่อวงศ์ - ชื่อสามัญ - ประโยชน์ 5. ตกแต่งให้สวยงาม

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

หน่วยที่4 จำนวน 4 ชั่วโมง แผนการจัดการเรียนรู้ สัปดาห์ที่ 5 บูรณาการ สวนพฤกษศาสตร์โรงเรียน ชื่อวิชา โปรแกรมกราฟิก ชื่อหน่วย การปรับรูปทรงภาพด้วยวิธี Transform ชื่อเรื่อง การปรับรูปทรงภาพด้วยวิธี Transform 1. สาระสำคัญ ในบทนี้เราจะทำการปรับขนาดภาพ หมุนภาพ และบิดภาพ เพื่อให้ได้รูปทรงภาพในแบบที่เราต้องการ เราเรียกวิธีการนี้ว่า “Transform” 2. สมรรถนะประจำหน่วย - ออกแบบภาพกราฟิกตามหลักองค์ประกอบศิลป์ - สร้างภาพกราฟิกและจัดการแฟ้มภาพด้วยโปรแกรมกราฟิก 3. จุดประสงค์การเรียนรู้ประจำหน่วย 1. ปรับขนาดภาพด้วยวิธีการ Scale ได้ 2. หมุนภาพด้วยคำสั่ง Scale ได้ 3. เอียงภาพด้วยคำสั่ง Skew ได้ 4. บิดภาพด้วยคำสั่ง Distort ได้ 5. บิดภาพให้มีมิติด้วย Perspective ได้ 6. ดัดภาพให้โค้งด้วยคำสั่ง Warp ได้ 4. สาระการเรียนรู้ Transform คือ วิธีการนำภาพหรือพื้นที่ภาพที่เราเลือกไว้ มาปรับรูปทรงให้เปลี่ยนแปลงไปจากเดิม เช่น ปรับภาพให้มีขนาดเล็กลง ปรับทิศทางการวางภาพให้เอียง ยืดและบิดภาพ เป็นต้น ซึ่งวิธีการเหล่านี้ สามารถปรับได้ตามคำสั่งที่ใช้โปรแกรมกำหนดไว้ด้วยคำสั่ง Transform และปรับได้โดยเราเป็นผู้กำหนดเอง ด้วยคำสั่ง Free Transform 1. ปรับขนาดภาพ ( Scale ) ในการซ้อนภาพ บางครั้งภาพที่นำมาไม่สามารถซ้อนกันได้พอดี ต้องมีการปรับขนาดก่อน ดังตัวอย่าง ต่อไปนี้

1. ใช้ Rectangular Marquee Tool เลือกภาพผู้หญิง 2. ใช้ Move Tool ลากภาพผู้หญิงมาวางบนภาพแผ่นฟิล์ม สังเกตได้ว่าภาพของผู้หญิงมีขนาดที่ใหญ่ กว่าพื้นที่ของแผ่นฟิล์มไม่สามารถวางซ้อนภาพได้อย่างพอดี 3. เลือกคำสั่ง Edit > Transform>Scale เพื่อเข้าสู่การย่อ/ขยายขนาดของภาพ

4. จะปรากฏรอบสี่เหลี่ยมล้อมรอบภาพ จากนั้นคลิกเมาส์ที่มุมของกรอบ ตัวเมาส์จะเปลี่ยนเป็นรูป แล้วลากเมาส์เพื่อลดขนาดภาพตามต้องการ (หากต้องการปรับขนาดภาพให้ได้สัดส่วน ให้กดแป้น>Shift> ค้าง ไว้ แล้วลากเมาส์ปรับย่อ/ขยายขนาดภาพได้) 5. เมื่อได้ขนาดภาพที่ต้องการแล้ว ให้กดแป้น <Enter> เพื่อยืนยันการปรับรูปทรงภาพ หรือกดแป้น <ESC> เพื่อยกเลิกการปรับรูปทรงภาพ 2. หมุนภาพ ( Rotate) หากภาพที่นำมาอยู่ในทิศทาง หรือมุมที่ไม่ลงตัว เราสามารถหมุนภาพได้ ดังขั้นตอนต่อไปนี้ 1. เลือกคำสั่ง Edit>Transform>Rotate เพื่อเข้าสู่การหมุนภาพ 2. จะปรากฏกรอบสี่เหลี่ยมล้อมรอบภาพที่จะหมุน จากนั้นเลื่อนเมาส์ไปบริเวณไอคอนสี่เหลี่ยมเล็ก ๆ จนตัวชี้เมาส์เปลี่ยนเป็นรูป แล้วลากเมาส์หมุนภาพ(หากจะหมุนภาพให้ได้ครั้งละ 15 องศา ให้กดแป้น <Shift> ค้างไว้ จากนั้นจึงหมุนภาพ)

3. เมื่อได้ภาพเอียงในมุมที่ต้องการแล้ว ให้กดแป้น <Enter> เพื่อยืนยันการปรับรูปทรงภาพ หรือกด แป้น <ESC> เพื่อยกเลิกการปรับรูปทรงภาพ 3. เอียงภาพ (Skew) เป็นการเอียงกรอบด้านใดด้านหนึ่งของภาพ ทำให้ลักษณะของภาพลาดเอียง ลองดูตัวอย่างต่อไปนี้

1. เลือกคำสั่ง Edit>Transform>Skew เพื่อเอียงภาพ 2. จะปรากฏกรอบสี่เหลี่ยมล้อมรอบภาพ คลิกเมาส์ที่ด้านของภาพ ตัวชี้เมาส์เป็นรูป แล้วลาก เมาส์เอียงภาพตามมุมต่าง ๆ ตามต้องการ 3. เมื่อได้ภาพตามที่ต้องการแล้ว ให้กดแป้น <Enter> เพื่อยืนยันการปรับรูปทรงภาพหรือกดแป้น <ESC> เพื่อยกเลิกการปรับรูปทรงภาพ 4. บิดภาพให้ผิดสัดส่วน (Distort) เป็นการบิดภาพให้ได้ผิดสัดส่วน ซึ่งทำได้หลายลักษณะและมีรูปทรงแตกต่างกันไป ลองดูตัวอย่าง ต่อไป

1. เลือกคำสั่ง Edit>Transform>Distort เพื่อบิดภาพ 2. จะปรากฏกรอบสี่เหลี่ยมล้อมรอบภาพ คลิกเมาส์ที่มุมของภาพ ตัวชี้เมาส์เปลี่ยนเป็นรูป แล้ว ลากเมาส์บิดภาพตามมุมต่าง ๆ ตามต้องการ 3. เมื่อได้ขนาดภาพที่ต้องการแล้ว ให้กดแป้น <Enter> เพื่อยืนยันการปรับรูปทรงภาพหรือกดแป้น <ESC> เพื่อยกเลิกการปรับรูปทรงภาพ 5. บิดภาพให้ดูมีมิติใกล้ไกล (Perspective) เป็นการบิดภาพเพื่อสร้างมิติ มีความลึก ความสูง อทำให้เกิดความรู้สึกใกล้ไกลในภาพได้ ลองดู ตัวอย่างต่อไป

1. เลือกคำสั่ง Edit>Transform>Perspective เพื่อบิดภาพให้ดูมีมิติ 2. ลากเมาส์เพื่อปรับย่อ หรือขยายมุมของภาพพร้อม ๆ กัน ทั้ง 2 มุม 3. เมื่อได้ขนาดภาพที่ต้องการแล้ว ให้กดแป้น <Enter> เพื่อยืนยันการปรับรูปทรงภาพ 6. ดัดภาพให้โค้ง (Warp) เป็นการดัดภาพแนวโค้ง ใช้บ่อยในการสร้างลวดลายบนวัตถุผิวโค้ง ลองดูตัวอย่างต่อไป

1. เลือกคำสั่ง Edit>Transform>Warp เพื่อดัดภาพให้โค้ง 2. จะปรากฏเส้นตารางในลักษณะของตาข่าย โดยเราสามารถเลื่อนตาข่ายให้พอดีกับภาพที่จะปรับได้ 3. ดัดแขนในแต่ละมุมของตาข่าย เพื่อให้ภาพโค้งตาทรูปทรงที่ต้องการ 4. เมื่อได้ขนาดภาพที่ต้องการแล้ว ให้กดแป้น <Enter> เพื่อยืนยันการปรับรูปทรงภาพ

7. ปรับรูปทรงอิสระ (Free Transform) ที่ผ่านมาเราได้กล่าวถึงการใช้คำสั่ง Transform ทีละแบบ สำหรับกรณีที่เราต้องการปรับภาพเอง อย่างอิสระอาจจะต้องเรียกใช้หลายคำสั่งกว่าจะได้ผลลัพธ์ที่ต้องการ หรืออาจจะใช้คำสั่ง Free Transform ที่ ช่วยปรับภาพได้หลายแบบแทน ลองดูตัวอย่างต่อไป

1. เลือกคำสั่ง Edit >free Transform หรือกดแป้น <Ctrl + T> 2. จะปรากฏกรอบสี่เหลี่ยมล้อมรอบภาพ เพื่อใช้ปรับรูปทรง 3. เลื่อนเมาส์ไปยังตำแหน่งมุม ตัวชี้เมาส์จะเปลี่ยนไปเป็น ทดลองลากเมาส์เพื่อลดขนาดพื้นที่ภาพ ในแนวทแยง 4. เลื่อนเมาส์ไปยังตำแหน่งขอบ ตัวชี้เมาส์จะเปลี่ยนไปเป็น ทดลองลากเมาส์เพื่อหมุนภาพ 5. คลิกเมาส์ที่กลางภาพเพื่อย้ายตำแหน่งภาพ เมื่อได้ตำแหน่ง ขนาดของภาพตามที่ต้องการแล้ว ให้ กดแป้น <Enter> เพื่อยืยยันการปรับรูปทรงภาพ

5. กิจกรรมการเรียนรู้ ขั้นนำเข้าสู่บทเรียน 1. ตรวจสอบรายชื่อนักศึกษาที่เข้าเรียน 2. ให้นักศึกษาอ่านหนังสือทำความเข้าใจเกี่ยวกับหน่วยการเรียน 3. ร่วมสนทนาเกี่ยวกับการจัดวางและการปรับรูปทรงในโปรแกรมกราฟิก ขั้นสอน 14. บอกจุดประสงค์การเรียน 15. บรรยาย อธิบาย ยกตัวอย่าง แสดงวิธีการปฎิบัติในหัวข้อการเรียน หัวข้อการเรียน การเกิดภาพ ในคอมพิวเตอร์กราฟิก การประมวลผลภาพ ความสามารถโดยรวมของโปรแกรม Photoshop และเรียกใช้งาน นำเข้าไฟล์จากกล้องดิจิตอลและสแกนเนอร์ สร้างไฟล์ใหม่และบันทึกไฟล์ใหม่ เบื้องต้น และให้นักศึกษาปฎิบัติไปพร้อมกัน 16. ครูบอกเทคนิค และแนวปฏิบัติที่ง่าย ๆ 17. ประเมินพฤติกรรมรายบุคคลโดยอาจารย์จะซักถามในแต่ละบุคคล ขั้นสรุป 13. ครูและนักเรียนร่วมกันสรุปสาระสำคัญ 14. เปิดโอกาสให้นักเรียนซักถามข้อสงสัย 15. มอบหมายให้ไปหัดทำและศึกษาเพิ่มเติม 16. ทำแบบทดสอบ 6. สื่อและแหล่งเรียนรู้ 6.1 สื่อ 22. หนังสือประกอบการเรียนวิชา โปรแกรมกราฟิก 23. ใบงานประจำหน่วยการเรียนรู้แต่ละหน่วย 24. แบบฝึกหัดประจำหน่วยการเรียนรู้ 25. ตัวอย่างแฟ้มสะสมชิ้นงาน 26. ชุดการสอน PowerPoint แต่ละหน่วยการเรียน 27. บทเรียนออนไลน์ 28. คอมพิวเตอร์ 6.2 แหล่งเรียนรู้ 16. ห้องสมุดสถานศึกษา 17. ห้องปฏิบัติการคอมพิวเตอร์และสารสนเทศ 18. ผู้ปกครอง เพื่อน ๆ รุ่นพี่ และบุคลากรในสถานศึกษา 19. หนังสือ E-book, ELearning, Website ที่เกี่ยวข้อง 20. ครูผู้สอน 7. หลักฐานการเรียนรู้ - ใบความรู้ - ใบงาน / ผลงานนักเรียน

8. การวัดและประเมินผล 8.1 เครื่องมือประเมิน 9. ประเมิน : ทดสอบ 10. เครื่องมือ : แบบทดสอบ 11. เกณฑ์การให้คะแนน : ประเมินจากแบบประเมินกิจกรรมการเรียนรู้ที่ 4.1 12. เกณฑ์การตัดสินการผ่าน : พอใช้(5 – 6 คะแนน) 8.2 เกณฑ์การประเมิน ดีมาก (9 – 10 คะแนน) ดี (7 – 8 คะแนน) พอใช้ (5 – 6 คะแนน) ปรับปรุง (ต่ำกว่า 5 คะแนน)

9. บันทึกผลหลังการจัดการเรียนรู้ 9.1 ข้อสรุปหลังการจัดการเรียนรู้ 9.2 ปัญหาที่พบ 9.3 แนวทางแก้ปัญหา ลงชื่อ............................................. (.....................................................) ผู้ทำแผนการจัดการเรียนรู้

แบบทดสอบก่อนเรียนหน่วยที่ 4 การปรับรูปทรงภาพด้วยวิธี Transform คำชี้แจง จงทำเครื่องหมายกากบาท (X) ทับข้อที่ถูกต้องที่สุด 1. การหมุนภาพ โดยการกดปุ่ม <Shift> ร่วมด้วย จะหมุนภาพได้ครั้งละกี่องศา ก. 10 องศา ข. 15 องศา ค. 25 องศา ง. 30 องศา 2. ถ้าต้องการปรับขนาดภาพให้มีขนาดเล็กลง ควรใช้คำสั่งใด ก. Scale ข. Skew ค. Perspective ง. Wrap 3. ถ้าต้องการเอียงกรอบด้านใดด้านหนึ่งของภาพ ให้มีลักษณะลาดเอียง ควรใช้คำสั่งใด ก. Scale ข. Skew ค. Perspective ง. Wrap 4. ถ้าต้องการบิดภาพเพื่อสร้างมิติให้เกิดความรู้สึกใกล้ไกลในภาพ ควรใช้คำสั่งใด ก. Scale ข. Skew ค. Perspective ง. Wrap 5. หากต้องการดัดภาพในแนวโค้ง ควรเลือกใช้คำสั่งใด ก. Scale ข. Skew ค. Perspective ง. Wrap เฉลย 1. ข 2. ก 3. ข 4. ค 5. ง

กิจกรรมการเรียนรู้ที่ 4.1 คำสั่ง 3. ให้นักศึกษาเขียนชื่อคำสั่งที่ใช้ในการการปรับรูปทรงภาพด้วยวิธี Transform คำสั่งการปรับภาพ ตัวอย่างภาพ

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

หน่วยที่5 จำนวน 8 ชั่วโมง แผนการจัดการเรียนรู้ สัปดาห์ที่ 6-7 บูรณาการ สวนพฤกษศาสตร์โรงเรียน ชื่อวิชา โปรแกรมกราฟิก ชื่อหน่วย การสร้างข้อความตกแต่งภาพ ชื่อเรื่อง การสร้างข้อความตกแต่งภาพ 1. สาระสำคัญ เราสามารถใส่ข้อความประกอบการนำเสนอนั้นได้ในบทนี้เราจะกล่าวกันถึงเรื่องการใส่ตัวอักษรลงไป ในภาพ โดยใช้คำสั่งในตระกูล Type Tool และปรับแต่งตัวอักษรและข้อความต่างๆ 2. สมรรถนะประจำหน่วย - ออกแบบภาพกราฟิกตามหลักองค์ประกอบศิลป์ - สร้างภาพกราฟิกและจัดการแฟ้มภาพด้วยโปรแกรมกราฟิก 3. จุดประสงค์การเรียนรู้ประจำหน่วย 1. อธิบายความแตกต่างระหว่างตัวอักษรแบบเวกเตอร์และบิตแมพ 2. สร้างตัวอักษรแบบ Point type และ Paragraph type ได้ 3. ปรับรูปแบบตัวอักษรเพื่อประกอบบนชิ้นงานได้ 4. ใช้ตัวอักษรภาษาไทยใน Photoshop ได้ 5. สร้างตัวอักษรแบบบิพแมพได้ 6. ตกแต่งตัวอักษรด้วยพาเนล Style และ Layer Style ได้ 4. สาระการเรียนรู้ การสร้างงานกราฟิกนอกจากจะเป็นการนำภาพหลาย ๆ ภาพมาตกแต่งเป็นเรื่องราวแล้ว เรายัง สามารถใส่ข้อความประกอบการนำเสนอได้ด้วย ชึ่งเนื้อหาในบทนี้เราจะกล่าวกันถึงเรื่องการใส่ตัวอักษรลงไป ในภาพ โดยใช้คำสั่งในตระกูล Type Tool และปรับแต่งตัวอักษรและข้อความต่าง ๆ 1. รู้จักกับประเภทของตัวอักษร ตัวอักษรที่ใช้ในโปรแกรมกราฟิก โดยทั่วไปแบ่งออกเป็น 2 ประเภท คือ แบบเวกเตอร์ (Vector) ตัวอักษรแบบเวกเตอร์ จะเกิดจากการลากเส้นตรง เส้นโค้งที่คำนวณด้วยสมการทางคณิตศาตร์ จาก จุดหนึ่งไปยังสู่จุดหนึ่ง ต่อเนื่องจนเกิดเป็นภาพหรือตัวอักษร ตัวอักษรแบบเวกเตอร์จะไม่มีปัญหาเรื่องรอยแตกบนขอบตัวอักษร เมื่อเกิดการย่อ/ขยายตัวอักษร มาก ๆ จึงเหมาะสำหรับนำมาใช้ในงานสิ่งพิมพ์ และงานศิลป์ อย่างไรก็ตาม ตัวอักษรแบบนี้จะนำไปตดแต่ง เอฟเฟ็กต์โดยใช้ฟิลเตอร์ไม่ได้

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

เครื่องมือ คุณสมบัติ ประเภท Horizontal Type Tool พิมพ์ตัวอักษรในแนวนอน เวกเตอร์ Vertical Type Tool พิมพ์ตัวอักษรในแนวตั้ง เวกเตอร์ Horizontal Type Mask Tool เลือกพื้นที่เป็นตัวอักษรในแนวนอน บิตแมพ Vertical Type Mask Tool เลือกพื้นที่เป็นตัวอักษรในแนวตั้ง บิตแมพ 3. การสร้างตัวอักษรแบบเวกเตอร์ ตัวอักษรแบบเวกเตอร์ เหมาะสำหรับการนำเสนอข้อความที่มีความคมชัด และมีสีสันเรีบยง่าย เพราะ ตัวอักษรแบบเวกเตอร์ไม่สารมารถใส่เอฟเฟ็กต์ได้มากนัก ตัวอักษรแบบเวกเตอร์ มีอยู่ 2 แบบ คือ Point type และ Paragraph type ซึ่งต่างกันตรงที่ Point type จะเป็นข้อความชื่อเรื่อง ส่วน Paragraph type จะเป็นข้อความเนื้อเรื่องที่มีหลายบรรทัด หรือมีลักษณะ เป็นย่อหน้า

สร้างตัวอักษรแบบ Point type จากตัวอย่างเราจะสร้างแผ่นป้ายโฆษณารับงานถ่ายภาพ โดยจะสร้างตัวอักษรแบบ Point type เป็น ชื่องานถ่ายภาพดังนี้ 1. คลิกเมาส์เลือก Horizontal Type Tool เพื่อสร้างข้อความในแนวนอน หรือ Vertical Tool เพื่อ สร้างข้อความในแนวตั้ง 2. ในออปชั่นบาร์ ให้เรากำหนดรูปแบบของตัวอักษร 3. กำหนดลักษณะของตัวอักษร ได้แก่ ตัวหนา ตัวเอียง หรือตัวปกติ 4. กำหนดขนาดของตัวอักษร 5. กำหนดสีของตัวอักษร 6. คลิกเมาส์ลงไปในชิ้นงานและพิมพ์ข้อความที่ต้องการ 7. คลิกเมาส์ปุ่ม เพื่อยืนยันใช้ข้อความที่เราได้สร้างเอาไว้นี้ สร้างตัวอักษรแบบ Paragraph type ตัวอักษรแบบ Paragraph type จะมีลักษณะเป็นข้อความที่มีหลายบรรทัด หรือเป็นย่อหน้า ดัง ตัวอย่างเราจะสร้างข้อความโฆษณารับจ้างถ่ายภาพต่อจากขั้นตอนที่ผ่านมา

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

5. การจัดเรียงข้อความในย่อหน้า เราสามารถแก้ไขและจัดเรียงข้อความแบบ Paragraph type โดยคลิกเมาส์ปุ่ม ที่อยู่บนออปชั่น บาร์เพื่อเปิดพาเนล Paragraph