แผนการจัดการเรียนรู้

๗๗
สำหรับช้ินงำนขนำดใหญ่ที่ประกอบด้วยเลเยอร์จำนวนมำก สำมำรถจัดหมวดหมู่ของเลเยอร์
ให้อยู่ในกลุ่มเดียวกัน ซึ่งเรียกกลุ่มของเลเยอร์เหล่ำน้ีว่ำ “เลเยอร์กรุ๊ป Layer group)” โดยมี
คุณสมบัติกำรทำงำนเหมือนเลเยอร์ท่ัว ๆ ไป แต่ท้ังน้ีกำรทำงำนใด ๆ ที่เกิดข้ึนในเลเยอร์กรุ๊ปมีผลกับ
ทุกเลเยอรท์ ่ีอยใู่ นกรุ๊ปน้ันดว้ ย

1. คลกิ เมำสเ์ ลือกตำแหน่งทวี่ ำงเลเยอร์กรปุ๊

3. เลเยอร์กรุ๊ปแสดงอยู่บนเลเยอร์ท่เี ลอื ก

2. คลกิ เมำสก์เพื่อสรำ้ งเลเยอร์กรุป๊

4. ตงั้ ชอ่ื ใหก้ บั เลเยอรก์ ร๊ปุ

5. ลำกเลเยอร์ที่ต้องกำรไปเก็บในเลเยอรก์ รุ๊ป

๗๘
6.5 เชอ่ื มเลเยอรเ์ ขา้ ด้วยกัน

บำงครั้งถ้ำต้องกำรแก้ไขเลเยอร์หลำยเลเยอร์พร้อม ๆ กันเช่นต้องกำรเล่ือนภำพที่อยู่ต่ำงเล
เยอรใ์ นระยะเท่ำ ๆ กนั กำรเลือกทลี ะภำพ ทำใหเ้ สยี เวลำมำก วิธีท่ีช่วยประหยดั เวลำ คอื กำรเชื่อมเล
เยอร์น้ัน ๆ เข้ำด้วยกัน เรียกว่ำ “กำรลิงก์เลเยอร์ (Link Layer)” ซ่ึงในโปรแกรม Photoshop น้ัน
กำรลิงกเ์ ปน็ กำรสรำ้ งควำมเชื่อมโยงของเลเยอร์ 2 เลเยอรห์ รอื มำกกวำ่

1. กด <ctrl>+ คลิกเลอื กเลเยอร์จะใหล้ ิงกก์ นั

2. คลกิ เมำส์เพ่ือทำกำรลงิ ก์
3. แสดงเครอื่ งหมำยในเลเยอรท์ ที่ ำงำนลงิ กก์ ัน

ยกเลกิ ลงิ กเ์ ลเยอร์

๗๙
ให้เลือกเลเยอร์ท่ีลิงก์กันอยู่ จำกนั้นเลือกคำสั่ง Layer->Unlink Layers หรือคลิกที่ อีกครั้ง
เพ่อื ยกเลิกกำรลงิ ก์ของเลเยอร์
1. คลิกเมำส์ที่ เพือ่ ยกเลิกลิงก์
6.6 รวมเลเยอร์
หลังจำกที่ได้แก้ไขชิ้นงำนเสร็จส้ิน และไม่จำเป็นต้องใช้เลเยอร์ต่ำง ๆ อีกต่อไป ก็อำจรวมเล
เยอรท์ ้ังหมดให้เป็นเลเยอรเ์ ดยี ว ซ่ึงเป็นกำรลดขนำดไฟลช์ ้นิ งำน และทำใหเ้ ครื่องทำงำนไดร้ วดเร็วข้ึน

1. เลือกเลเยอรท์ ่ีตอ้ งกำร

2.คลิกเมำส์ เลือก Merge Layers

3. เลเยอร์ทเ่ี ลือกถูกรวมเขำ้ ด้วยกนั ในเลเยอร์ job

รวมทุกเลเยอรใ์ หเ้ ป็นเลเยอร์เดยี ว
1. เลอื กเลเยอร์ใดเลเยอรห์ น่ึง เลือกคำส่ัง Layer-> Flatten Image

๘๐
2. ทกุ เลเยอร์ถูกรวมเขำ้ ดว้ ยกันเป็นเลเยอร์ Background

แผนการจดั การเรียนรมู้ ุง่ เนน้ สมรรถนะ ๘๑
ชือ่ หน่วย ทำงำนกับเลเยอร์
หนว่ ยท่ี 6
สปั ดาห์ที่ 8
จานวน 3 ชัว่ โมง

จานวน 3 ชัว่ โมง

5.กิจกรรมการเรียนการสอน
5.1 กำรนำเข้ำสูบ่ ทเรียน
5.1.1ครู เชค็ ชอ่ื และตรวจกำรแตง่ กำย
นกั เรยี น ขำนชอ่ื และลุกขน้ึ ให้ครูตรวจกำรแตง่ กำยทลี ะคน
5.1.2ครู ทบทวนก่อนเรยี นโดยกำรซักถำมเก่ียวกบั กำรทำงำนกับเลเยอร์
นกั เรียน ตอบคำถำม ซักถำมข้อสงสยั
5.2 กำรเรียนรู้
5.2.1ครู อธบิ ำยถึงกำรทำงำนกบั เลเยอร์และกำรใชง้ ำนโปรแกรมโดยสอ่ื
PowerPoint ตอบคำถำม/ซักภำมข้อสงสัย
นักเรียน จดบนั ทึก ตอบคำถำม ปรึกษำ/อภิปรำยกบั เพือ่ น
5.2.2ครู ทดสอบผ้เู รียนโดยกำรถำมตอบกนั ภำยในหอ้ งเรยี น และอธิบำย
บำงในข้อทผี่ ู้เรียนมีขอ้ สงสัยจดบันทึกย่อ
นักเรยี น รว่ มกนั อภปิ รำยหำข้อสรปุ
5.2.3ครู ให้นกั เรียนทำแบบทดสอบเรื่องกำรทำงำนกับเลเยอร์เพอื่ เก็บ
คะแนน
นักเรียน ทำแบบทดสอบ
5.2.4ครู ใหท้ ำกำรทดลองใบงำน/ให้คำแนะนำ
นกั เรียน ปฏิบัตกิ ำรทดลองตำมใบงำน
5.3 กำรสรุป
5.3.1ครู สุ่มเรยี กนักเรยี นออกมำสรปุ เนื้อหำท่ีได้เรยี นมำทีละคนจน
ครอบคลุมเนื้อหำทงั้ หมด โดยครูชว่ ยให้คำแนะนำ และอธิบำย
เพิ่มเติม
นักเรยี น ออกมำหนำ้ ชน้ั เรียนสรปุ เนอื้ หำซักถำมปัญหำและจดบันทึก
เพ่มิ เติม
5.3.2ครู ให้นักเรียนทำใบปฏิบัติกำรทดลองให้เสรจ็ สมบูรณ์และให้
นกั เรยี นซักถำมปญั หำในกำรเรยี น
นักเรยี น ซกั ถำมปญั หำและข้อสงสยั ในใบปฏิบตั ิกำรทดลอง สรปุ ผลกำร
ทดลองและสง่ ใบปฏบิ ัติกำรทดลอง
5.4 กำรวดั และประเมนิ ผล
5.4.1ครู สุ่มถำมนักเรียนเก่ยี วกบั เน้ือหำทเี่ รยี น
นักเรียน ตอบคำถำมที่ครูถำม

๘๒

5.4.2ครู ให้นกั เรียนทำแบบทดสอลประจำหนว่ ย ตรวจใบปฏิบตั กิ ำร
ทดลองของนักเรียน เฉลยแบบทดสอบประจำหน่วยและบันทึก
คะแนน

นักเรียน ทำแบบทดสอบประจำหนว่ ย และแลกเปล่ียนกันตรวจ
แบบทดสอบ

6. ส่อื การเรยี นร/ู้ แหล่งเรียนรู้
6.1 สอ่ื สง่ิ พมิ พ์
หนงั สือเรียนวิชำ โปรแกรมกรำฟิก (Photoshop CS6) ปยิ ะ นำกสงค์. (2562). กรงุ เทพ :
ซัคเซส มเี ดี
6.2 สื่อโสตทศั น์
ส่อื Power point วิชำ กำรสร้ำงเว็บไซต์ หนว่ ยท่ี 6 เรอ่ื ง ทำงำนกบั เลเยอร์

7. เอกสารประกอบการจดั การเรียนรู้ (ใบควำมรู้ ใบงำน ใบมอบหมำยงำน ฯลฯ)
7.1 ใบควำมรปู้ ระกอบกำรเรียนวชิ ำ โปรแกรมกรำฟิก หน่วยท่ี 6 เรือ่ ง ทำงำนกบั เลเยอร์
7.2 ใบปฏิบตั ิกำรทดลองที่ 6

8. การบรู ณาการ/ความสมั พนั ธ์กบั วชิ าอ่ืน
8.1 สำมำรถนำควำมรูม้ ำใช้ในกำรตกแต่งภำพกรำฟิก
8.2 สำมำรถนำควำมรูม้ ำใชร้ ่วมกบั วชิ ำโครงงำน

9. การวดั และประเมนิ ผล
9.1กอ่ นเรียน
9.1.1.ผเู้ รียนศกึ ษำ ค้นควำ้ จำกเอกสำร ตำรำ เกี่ยวกบั ควำมรูเ้ กย่ี วกบั โปรแกรมกรำฟิก
9.1.2.ผเู้ รยี นทำแบบทดสอบก่อนเรียน
9.2ขณะเรียน
9.2.1.กำรสังเกตพฤติกรรมภำยในชั้นเรยี น
9.2.2.ทำแบบฝึกหดั ประจำหนว่ ย
9.3 หลงั เรียน
9.3.1.ใหผ้ เู้ รียนช่วยกนั สรปุ เน้ือหำ
9.3.2.ทำแบบทดสอบหลังเรียน
9.3.3.ทำแบบทดสอบประจำหนว่ ย เพ่ือวดั ผลสัมฤทธ์ิทำงกำรเรยี น

10.บนั ทึกหลงั การสอน
10.1 ผลการใช้แผนการจัดการเรียนรู้

............................................................................................................................. ...................................
................................................................................................ ................................................................
............................................................................................................................. ...................................

๘๓

............................................................................................................................................................ ....
............................................................................................................................. ...................................
............................................................................................................................. ...................................
................................................................................................................................................................

10.2 ผลการเรยี นร้ขู องนักเรยี น นกั ศึกษา
...................................................................................................................... ..........................................
............................................................................................................................. ...................................
................................................................................................................................................................
.............................................................................................................................. ..................................
............................................................................................................................. ...................................
................................................................................................................................................................

10.3 แนวทางการพัฒนาคณุ ภาพการเรียนรู้
............................................................................................................................. ...................................
............................................................................................................................. ...................................
................................................................................................................................................................
............................................................................................................................. ...................................
.......................................................................................................................................... ......................
............................................................................................................. ...................................................

๘๔

แผนการจดั การเรยี นรู้มุง่ เน้นสมรรถนะ หน่วยที่ 7
ช่ือหน่วย เทคนิคการตกแต่งภาพในเลเยอร์ สัปดาห์ท่ี 10 -

11
จานวน 6 ชว่ั โมง

จานวน 6 ช่วั โมง

1. สาระสาคัญ
หลังจากท่ีได้จัดเตรียมภาพ และนามาจัดเรียงให้เข้ากันแล้ว ต่อไปจะตกแต่งภาพในแต่ละเล

เยอร์ให้กลมกลนื

2. สมรรถนะประจาหน่วย
2.1. การตกแต่งภาพในเลเยอร์ดว้ ย Layer Style
2.2. การแต่งภาพด้วยสไตล์สาเร็จรปู ในพาเนล Style
2.3 เจาะภาพใหโ้ ปร่งใสด้วย Layer Mask
2.4. การเลม็ ส่วนเกินของภาพออกด้วย Clipping Mask
2.5 ตกแต่งภาพด้วย Fill Layer และ Adjustment Layer
2.6 ทาความเข้าใจกับ Layer Blending Mode

3. จุดประสงคก์ ารเรียนรู้
3.1 ดา้ นความรู้
3.1.1 การตกแต่งภาพในเลเยอร์ดว้ ย Layer
3.1.2 การเจาะภาพใหโ้ ปร่งใสดว้ ย Layer Mask
3.1.3 การเลม็ ส่วนเกินของภาพออกดว้ ย Clipping Mask
3.1.4 การตกแต่งภาพด้วย Fill Layer และ Adjustment Layer
3.1.5 การผสมสโี ดยการใช้ Layer Blending mode
3.2 ดา้ นทักษะ
3.2.1 สามารถตกแต่งภาพในเลเยอรด์ ว้ ย Layer ได้
3.2.2 สามารถเจาะภาพให้โปร่งใสด้วย Layer Mask ได้
3.2.3 สามารถเลม็ ส่วนเกินของภาพออกดว้ ย Clipping Mask
3.2.4 การตกแตง่ ภาพดว้ ย Fill Layer และ Adjustment Layer
3.2.5 เข้าใจการผสมสีโดยการใช้ Layer Blending mode
3.2.6 แสดงงานหลายรูปแบบในไฟลเ์ ดยี วโดยใช้ Layer Comp ได้

3.3 คุณลกั ษณะที่พึงประสงค์
3.3.1 ใฝ่เรยี นรู้
3.3.2 ทางานเปน็ ระเบียบเรียบร้อย
3.3.3 ผ้เู รียนมีความรับผิดชอบตอ่ หนา้ ที่
3.3.4 ปฏบิ ัติงานดา้ นความซื่อสัตยส์ ุจรติ

๘๕

3.3.5 มีความมงุ่ มัน่ ในการทางาน
3.3.6 ใช้เวลาอยา่ งคุม้ คา่
3.3.7 มีจติ สาธารณะ

๘๖

แผนการจัดการเรยี นรู้มุ่งเน้นสมรรถนะ หนว่ ยที่ 7
ชื่อหน่วย เทคนิคการตกแต่งภาพในเลเยอร์ สัปดาห์ท่ี 10 -

11
จานวน 6 ช่ัวโมง

จานวน 6 ช่วั โมง

4. เน้อื หาสาระการเรียนรู้
7.1. การตกแตง่ ภาพในเลเยอร์ดว้ ย Layer Style

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

1. คลิกเมาส์เลือกเลเยอรท์ ่ีต้องการใสแ่ อฟเฟ็กต์
2. คลิกเมาส์ทีป่ ุ่ม หรอื เลือกคาสง่ั Layer > Layer Style ทเ่ี มนบู าร์
3. เลอื กรปู แบบของแอเฟ็กตามตอ้ งการ
4. จะปรากฏหนา้ ต่าง Layer Style ใหเ้ ราปรบั รายละเอยี ดของแอฟเฟ็กต์ ไดต้ ามที่ตอ้ งการ
5. คลกิ ปุ่ม OK เพ่ือตกฃงใช้แอฟเฟ็กต์ สังเกตท่พี าเนล Layer จะปรากฏเลเยอรพ์ ิเศษของ
แอฟเฟ็กตท์ ใ่ี ช้
7.2. การแต่งภาพดว้ ยสไตล์สาเรจ็ รูปในพาเนล Style
Photoshop ได้รวบรวมเอฟเฟ็กต์สาเร็จรูปท่ีนิยมใช้ในการตกแต่งภาพไว้ในพาเนล Styles
ซึ่งเราสามารถตกแต่งภาพได้เพียงคลิกเมาส์เลือก Style ไม่ต้องปรับแต่งค่าเหมือนเดิมกับการใช้
Layer Style
ปรับความโปร่งใสของเลเยอร์
เป็นลักษณะการปรับภาพให้จางลงจนกระทั่งกลายเป็นภาพใสท่ีสามารถมองทะลุไปยังพ้ืน
หลังได้ เราเรียกคุณสมบัตินว้ี ่า “Opacity” ซึ่งการปรับค่า Opacity น้ีจะเกิดข้ึนกับภาพในเลเยอรน์ นั้
รวมทั้งเอฟเฟ็กต์ท่ีใช้ด้วย โดยมากเทคนิคน้ีมักจะนิยมใช้กับเลเยอร์ท่ีวางซ้อนกัน ดังตัวอย่างเราจะ
ปรับเลเยอร์ภาพ ให้มองเปน็ ทะลุเห็นพนื้ หลังสขี าวด้านลา่ ง
ในกรณีทึี่เราต้องการปรับความโปร่งใสของภาพในเลเยอร์ แต่ไม่ต้องการให้มีผลกับเอฟเฟ็กต์
ดว้ ย กส็ ามารถเลอื กทาไดโ้ ดยใหเ้ ลือกปรับค่า Fill ในพาเนล Layers แทน
7.3 เจาะภาพให้โปร่งใสดว้ ย Layer Mask
เป็นการเจาะภาพด้านบนให้โปร่งใส เพื่อให้ภาพด้านล่างลอดขึ้นมาด้านบน ตามช่องของ
หนา้ กาก เราเรียกเทคนคิ นี้ว่า “Layer Mask”
1.สว่ นสีดาโปร่งแสง
2.สว่ นสเี ทาโปรง่ แสงเล็กน้อย
3..ส่วนสีขาวจะทึบแสง
สร้าง Layer Mask โดยการไล่โทนสี
จากความรู้ท่ีกลา่ วไปข้างตน้ เราสามารถนา Layer Mask มาใชต้ กแต่งภาพได้อย่างกลมกลืน
โดยการนาภาพ 2 ภาพมาซ้อนกัน แล้วให้ภาพหนึ่งเป็น Mask หรือเป็นหน้ากากเพื่อให้ภาพเลเยอร์
ลา่ งลอดออกมาจากชอ่ งของหนา้ กาก
1. เรยี งภาพตามลาดบั

๘๗

3. คลกิ เมาส์

4. เพม่ิ Layer Mask

5. คลกิ เลือก Gradient Tool

6. เลือกสีโฟรก์ ราวนดแ์ ละแบค็ กราวนด์เป็นสดี า-ขาว

7. เลอื กให้ไลโ่ ทนสีจากโฟร์กราวนดไ์ ปยังแบค็ กราวนด์

8. ไลโ่ ทนสจี ากสีดาไปยงั สีขาว

9 .แสดงผลการซ้อนเลเยอรโ์ ดยการใช้ Layer Mask

การสร้าง Layer Mask โดยการคัดลอก

ในตัวอย่างนี้เราจะเปลี่ยนพื้นหลังของภาพ ด้วยการสร้าง Mask บังส่วนของพื้นหลังเดิม

จากนั้นใช้การคัดลอกพื้นหลงั อนั ใหม่มาใส่แทน

1.เลือกพนื้ หลงั เดิมทจี่ ะเปลย่ี น 2.เลือกพ้นื หลงั ใหมท่ จ่ี ะมาแทนท่ี

3.เลือกคาสั่ง Edit>copy คัดลอกพน้ื หลงั ใหม่

4.เลือกคาสั่ง Edit>Paste Into วางพ้ืนหลังใหม่ ในไฟลภ์ าพทีต่ ้องการเปลย่ี นพ้นื หลัง

5.ภาพพน้ื หลงั ใหมจ่ ะถกู นามาวาง แล้วเลือ่ นพื้นหลังใหม่ให้อยู่ในตาแหนง่ ทต่ี อ้ งการ

ใช้เสน้ พาธสรา้ ง Vector Mask

เปน็ การสร้าง Layer Mask อีกรูปแบบหนง่ึ คือ การใช้ เส้นพาธมาบงั ส่วนของภาพท่ีเราไม่

ตอ้ งการ ซงึ่ เราเรียก การสรา้ งในลักษณะนวี้ ่า “ Vector Mask”

1.เปล่ยี นเลเยอร์ Background เป็นเลเยอรป์ กติ

2.สรา้ งเสน้ พาธรอบพื้นท่ีทตี่ อ้ งการ

3.เลอื กคาส่งั Layer>Vector Mask>Current path

4.สว่ นที่อยนู่ อกเหนือจากเสน้ พาธจะหายไปสามารถนาพ้นื ท่ีนน้ั ไปสรา้ งงานอ่ืนๆ ต่อไปได้

7.4. การเลม็ ส่วนเกินของภาพออกด้วย Clipping Mask

รูปท่ี 1 การเลม็ สว่ นเกินของภาพออกด้วย Clipping Mask

๘๘

รูปท่ี 2 การเลม็ ส่วนเกินของภาพออกดว้ ย Clipping Mask

7.5 ตกแตง่ ภาพด้วย Fill Layer และ Adjustment Layer

เปน็ การตกแตง่ ภาพโดยการสรา้ งเลเยอรใ์ หม่มาซ้อนบนเลเยอรภ์ าพทีต่ ้องการปรบั แตง่ ขอ้ ดี

ของวธิ นี ี้ คือ สามารถลองเอฟเฟ็กตต์ ่าง ๆ ในเลเยอร์นี้ได้โดยไมม่ ผี ลกับภาพโดยตรง และเม่อื ใดท่ี

ตอ้ งการยกเลกิ เอฟเฟ็กตก์ ็ลบเพียงเลเยอร์นเี้ ท่านน้ั ซงึ่ ความหมายของ Fill Layer และ Adjustment

Layer มีดงั น้ี

Fill Layers เปน็ กล่มุ คาสั่งทใี่ ช้เตมิ สี เทสี และไลส่ เี พม่ิ ลงในภาพ ไดแ้ ก่ Solid

Color, Gradient และ Pattern

Adjustment Layer เปน็ กลมุ่ คาส่ังทปี่ รบั แต่งสี และความสวา่ งของภาพ ได้แก่ Levels,

Curves และ Color Balance เปน็ ตน้

เมือ่ คลิกเมาสท์ ่ี ก็จะแสดงคาส่งั ในกลุ่ม ของFill Layer และ Adjustment Layer ดงั นี้

๘๙
คำสง่ั ใน Fill Layer

คำส่งั ใน Adjustment
Layer

คลิก -> แสดงคำส่งั ตำ่ ง ๆ

เติมสดี ้วย Fill Layer

1. เลือกพ้นื ท่บี ริเวณท่ีต้องการตกแต่ง (หากต้องการตกแต่งทัง้ ภาพก็ไม่จาเป็นต้องเลือกพืน้ ที่

บนภาพ)

2. ทพี่ าเนล Layer คลิก จากนั้นเลือกคาส่งั เกีย่ วกับการเทสีลงในภาพ ในตวั เลือก

Gradient

3. ปรับการไลโ่ ทนสใี น Fill Layer ตามท่ีต้องการ

4. แสดงผลเป็นการซ้อนเลเยอร์ภาพดา้ นลา่ ง และเลเยอร์ของการไลโ่ ทนสีดา้ นบน

ปรบั สดี ว้ ย Adjustment Layer

1. เลอื กพื้นทบี่ รเิ วณที่ต้องการตกแต่ง จากนั้นท่ีพาเนล Layers ให้คลิกเลือก และเลือกคาสง่ั

เกย่ี วกับการปรบั ภาพ ในตวั อย่างเลือก Gradient Map…

2. ปรากฏพาเนล Gradient Map ให้ทาการปรับสตี ามต้องการ

7.6 ทาความเขา้ ใจกบั Layer Blending Mode

Layer Blending Mode เป็นการผสมสภี าพที่ซ้อนกนั ให้ออกมาเปน็ สใี หม่ที่น่าสนใจ ก่อนที่

จะทาความเขา้ ใจเกีย่ วกบั Blending Mode ต่าง ๆ มีคาศัพท์พน้ื ฐาน 3 คา ท่คี วรจะรู้ก่อน คอื

1. Base Color เป็นสีของภาพที่อยู่ในเลเยอร์ดา้ นล่าง เป็นสตี ัวต้ัง

2. Blend Color เปน็ สีของภาพที่อยู่ในเลเยอร์ดา้ นบน เปน็ สที ี่มาผสม

3. Result Color เป็นสีของภาพผลลพั ธ์

ใช้ Brush Tool ตกแต่งภาพรว่ มกับ Blending Mode

๙๐

สามารถใช้ Brush Tool เพ่ิมสีเข้าไปในภาพ Blending Mode ซ่ึงจะชว่ ยใหภ้ าพในสว่ นของ
Base Color มคี วามชัดเจนข้ึนในบริเวณทเ่ี ลือก ดังตวั อยา่ งต่อไปน้ี จะเลือกใชส้ ีแดงอ่อน ๆ ระบายทับ
บรเิ วณท่ตี ้องการให้เดน่ ขึน้

1. คลกิ เมาสเ์ ลอื ก Brush Tool
2. คลิกเลอื กสีโฟร์กราวนด์
3. คลกิ เลือกสที ่ตี ้องการ แลว้ คลิกเมาส์ OK
4. ระบายในสว่ นทต่ี ้องการสร้างภาพให้เดน่ ข้นึ

๙๑

แผนการจดั การเรยี นรู้มุ่งเน้นสมรรถนะ หน่วยที่ 7
ช่ือหน่วย เทคนิคการตกแตง่ ภาพในเลเยอร์ สปั ดาห์ท่ี 10 -

11
จานวน 6 ช่ัวโมง

จานวน 6 ช่ัวโมง

5.กิจกรรมการเรยี นการสอน
5.1 การนาเข้าส่บู ทเรยี น
5.1.1ครู เช็คชือ่ และตรวจการแตง่ กาย
นกั เรยี น ขานช่ือและลุกขึ้นให้ครตู รวจการแต่งกายทีละคน
5.1.2ครู ทบทวนกอ่ นเรยี นโดยการซกั ถามเกีย่ วกับเทคนิคการตกแต่งภาพ
ในเลเยอร์
นกั เรียน ตอบคาถาม ซักถามข้อสงสยั
5.2 การเรยี นรู้
5.2.1ครู อธบิ ายถึงเทคนคิ การตกแต่งภาพในเลเยอร์ และการใช้งาน
โปรแกรมโดยส่อื PowerPoint ตอบคาถาม/ซักภามข้อสงสยั
นักเรียน จดบันทึก ตอบคาถาม ปรึกษา/อภิปรายกบั เพ่อื น
5.2.2ครู ทดสอบผเู้ รียนโดยการถามตอบกันภายในหอ้ งเรยี น และอธิบาย
บางในข้อที่ผเู้ รียนมีข้อสงสัยจดบันทึกย่อ
นกั เรียน รว่ มกันอภิปรายหาข้อสรุป
5.2.3ครู ใหน้ กั เรียนทาแบบทดสอบเรื่องเทคนคิ การตกแต่งภาพในเลเยอร์
เพื่อเก็บคะแนน
นกั เรียน ทาแบบทดสอบ
5.2.4ครู ใหท้ าการทดลองใบงาน/ให้คาแนะนา
นกั เรยี น ปฏิบตั กิ ารทดลองตามใบงาน
5.3 การสรปุ
5.3.1ครู สมุ่ เรยี กนักเรยี นออกมาสรปุ เน้อื หาท่ีได้เรียนมาทีละคนจน
ครอบคลุมเนอื้ หาท้ังหมด โดยครูชว่ ยให้คาแนะนา และอธบิ าย
เพมิ่ เติม
นักเรยี น ออกมาหนา้ ชัน้ เรียนสรุปเน้อื หาซกั ถามปัญหาและจดบนั ทึก
เพิม่ เติม
5.3.2ครู ใหน้ กั เรยี นทาใบปฏบิ ัติการทดลองใหเ้ สร็จสมบูรณ์และให้
นักเรยี นซักถามปัญหาในการเรยี น
นักเรยี น ซกั ถามปัญหาและข้อสงสัยในใบปฏบิ ตั ิการทดลอง สรปุ ผลการ
ทดลองและส่งใบปฏบิ ัติการทดลอง
5.4 การวดั และประเมนิ ผล
5.4.1ครู ส่มุ ถามนักเรยี นเก่ยี วกับเน้ือหาทเ่ี รียน
นกั เรียน ตอบคาถามทคี่ รถู าม

๙๒

5.4.2ครู ใหน้ ักเรยี นทาแบบทดสอลประจาหน่วย ตรวจใบปฏบิ ตั ิการ
ทดลองของนักเรียน เฉลยแบบทดสอบประจาหนว่ ยและบันทกึ
คะแนน

นักเรยี น ทาแบบทดสอบประจาหน่วย และแลกเปล่ียนกันตรวจ
แบบทดสอบ

6. สอ่ื การเรยี นร/ู้ แหล่งเรยี นรู้
6.1 สื่อสง่ิ พมิ พ์
หนงั สอื เรยี นวิชา โปรแกรมกราฟกิ (Photoshop CS6) ปิยะ นากสงค์. (2562). กรุงเทพ :
ซคั เซส มีเดี
6.2 สอ่ื โสตทศั น์
สอ่ื Power point วชิ า การสร้างเวบ็ ไซต์ หนว่ ยท่ี 7 เร่ือง เทคนคิ การตกแตง่ ภาพในเลเยอร์

7. เอกสารประกอบการจดั การเรยี นรู้ (ใบความรู้ ใบงาน ใบมอบหมายงาน ฯลฯ)
7.1 ใบความรปู้ ระกอบการเรียนวิชา โปรแกรมกราฟิก หนว่ ยท่ี 7 เรือ่ ง เทคนิคการตกแตง่ ภาพ
ในเลเยอร์
7.2 ใบปฏิบตั ิการทดลองที่ 7

8. การบรู ณาการ/ความสมั พันธ์กบั วิชาอื่น
8.1 สามารถนาความรู้มาใชใ้ นการตกแต่งภาพกราฟิก
8.2 สามารถนาความรู้มาใชร้ ่วมกับวชิ าโครงงาน

9. การวดั และประเมนิ ผล
9.1ก่อนเรยี น
9.1.1.ผู้เรียนศกึ ษา ค้นควา้ จากเอกสาร ตารา เก่ยี วกับความร้เู ก่ยี วกบั โปรแกรมกราฟกิ
9.1.2.ผู้เรียนทาแบบทดสอบก่อนเรียน
9.2ขณะเรยี น
9.2.1.การสังเกตพฤติกรรมภายในช้ันเรยี น
9.2.2.ทาแบบฝึกหัดประจาหน่วย
9.3 หลังเรียน
9.3.1.ให้ผู้เรยี นชว่ ยกันสรุปเน้อื หา
9.3.2.ทาแบบทดสอบหลงั เรยี น
9.3.3.ทาแบบทดสอบประจาหน่วย เพ่อื วดั ผลสัมฤทธิ์ทางการเรียน

10.บนั ทกึ หลังการสอน
10.1 ผลการใช้แผนการจดั การเรยี นรู้

............................................................................................................................. ...................................
................................................................................................................................................................
............................................................................................................................. ...................................

๙๓

............................................................................................................................. ...................................
................................................................................................ ................................................................
............................................................................................................................. ...................................
............................................................................................................................. ...................................

10.2 ผลการเรยี นร้ขู องนักเรยี น นักศกึ ษา
....................................................................................... .........................................................................
............................................................................................................................. ...................................
.................................................................................................................................. ..............................
....................................................................................................................... .........................................
............................................................................................................................. ...................................
................................................................................................................................................................

10.3 แนวทางการพัฒนาคณุ ภาพการเรียนรู้
................................................................................................................ ................................................
............................................................................................................................. ...................................
................................................ ............................................................................................................ ....
............................................................................................................................. ...................................
............................................................................................................................. ...................................
................................................................................................................................................................

แผนการจัดการเรยี นรู้มุ่งเนน้ สมรรถนะ ๙๔
ชอ่ื หน่วย การวาดภาพและรูปทรง
หน่วยที่ 8
สปั ดาห์ที่ 12 - 13
จานวน 6 ชั่วโมง

จานวน 6 ช่ัวโมง

1. สาระสาคญั
ไม่เพียงความสามารถในการตัดต่อ และซ้อนภาพดังที่กล่าวมาแล้ว ยังสามารถใช้โปรแกรม

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

2. สมรรถนะประจาหน่วย
2.1 ลักษณะของภาพเวกเตอร์
2.2 การวาดรูปทรงสาเร็จรปู อสิ ระ (Shape Tool)
2.3 ตัวอยา่ งการวาดภาพดว้ ยรูปทรงเรขาคณิต
2.4 ตัวอยา่ งการวาดภาพด้วยรปู ทรงสาเร็จรปู
2.5 การวาดรูปทรงอิสระ (Pen Tool)

3. จุดประสงค์การเรยี นรู้
3.1 ดา้ นความรู้
3.1.1 การวาดภาพด้วยรปู ทรงสาเร็จรปู
3.1.2 การวาดรูปทรงอิสระ
3.1.3 การใชค้ าสง่ั จัดการกบั สว่ นประกอบของพาธ
3.2 ด้านทกั ษะ
3.2.1 สามารถวาดภาพดว้ ยรูปทรงสาเรจ็ รปู ได้
3.2.2 สามารถวาดรูปทรงอิสระได้
3.2.3 สามารถใชค้ าสั่งจัดการกบั สว่ นประกอบของภาพได้
3.3 คณุ ลักษณะท่ีพึงประสงค์
3.3.1 ใฝ่เรยี นรู้
3.3.2 ทางานเปน็ ระเบียบเรยี บรอ้ ย
3.3.3 ผูเ้ รยี นมคี วามรบั ผดิ ชอบตอ่ หนา้ ท่ี
3.3.4 ปฏิบัตงิ านด้านความซื่อสตั ยส์ ุจริต
3.3.5 มคี วามมุ่งม่ันในการทางาน
3.3.6 ใชเ้ วลาอย่างคมุ้ คา่
3.3.7 มจี ติ สาธารณะ

แผนการจัดการเรยี นรู้มุ่งเน้นสมรรถนะ ๙๕
ชอื่ หน่วย การวาดภาพและรูปทรง
หนว่ ยท่ี 8
สัปดาหท์ ี่ 12 - 13
จานวน 6 ชว่ั โมง

จานวน 6 ชว่ั โมง

4. เนื้อหาสาระการเรียนรู้
8.1 ลกั ษณะของภาพเวกเตอร์

สามารถวาดภาพใน Photoshop โดยใชเ้ ส้นพาธ (Path) ซึง่ เสน้ พาธเหลา่ นสี้ ามารถดึงให้ตรง
หรือดัดโค้งให้เกิดเป็นรูปร่างต่าง ๆ ได้ตามที่ต้องการ โดยลักษณะของเส้นพาธจะถูกแบ่งได้เป็น 2
ประเภท

เส้นพาธที่มีรูปทรงตายตัว ได้แก่เส้นพาธท่ีเป็นเส้นตรง สี่เหลี่ยม วงรี วงกลม และรูปหลาย
เหล่ียมนอกจากน้ีใน Photoshop ได้รวมรูปทรงที่ใช้กันบ่อย ๆ ได้แก่ ภาพดอกไม้ ภาพหัวใจ ภาพ
ดาว และภาพลูกศรไวใ้ ห้นาไปใช้ ซง่ึ ใน Photoshop จะใชเ้ ครื่องมือวาดท่เี รยี กว่า Shape Tool

เส้นพาธท่ีมีรูปทรงอิสระ เกิดจากการลากเส้นพาธ และดัดเส้นให้เกิดความโค้งโดยใช้
เคร่ืองมือวาดที่เรียกว่า Pen Tool (ปากกา) เพื่อให้ได้ภาพเป็นรูปทรงท่ีต้องการ คล้าย ๆ กับการใช้
ตะปูยึดสายไฟในแตล่ ะจดุ เพอ่ื ให้สามารถลากสายไฟตามสว่ นต่าง ๆ ของผนังบา้ น
8.2 การวาดรปู ทรงสาเรจ็ รปู อิสระ (Shape Tool)

Shape Tool เป็นเครื่องมือที่ใช้ในการวาดภาพที่เป็นรูปทรงพื้นฐาน เช่น การวาดภาพเป็น
รูปส่ีเหลี่ยม วงกลมรูปหลายเหลี่ยม เส้นตรง และ รูปทรงสาเร็จรูป สามารถแบ่งตามลักษณะการใช้
งานเป็น 6 รปู แบบ คอื

Rectangle Tool สรา้ งรูปส่ีเหลย่ี มมมุ ฉาก

Rounded Rectangle Tool สร้างรปู ส่เี หลี่ยมมมุ โค้ง

Ellipse Tool สร้างรูปวงกลมและวงรี

Polygon Tool สร้างรปู หลายเหลีย่ ม

Line Tool สรา้ งเสน้ ตรง

Custom Shape Tool สร้างภาพสาเร็จรูป

8.3 ตัวอย่างการวาดภาพด้วยรูปทรงเรขาคณิต

๙๖

ในตัวอย่างนี้ จะสร้างการ์ด โดยใช้เครื่องมือต่าง ๆ เช่น รูปสี่เหลี่ยม รูปหลายเหล่ียม วงกลม
วงรี และเส้นตรง เพ่อื ใหไ้ ด้ผลลัพธ์ดังตวั อย่างมขี ั้นตอนหลัก ๆ ดงั นี้

ขั้นตอนที่ 1 สรา้ งพื้นหลงั
ขั้นตอนที่ 2 สร้างภาพตุก๊ ตา
ขั้นตอนที่ 3 วาดดอกไม้
ข้นั ตอนท่ี 4 เพ่มิ เอฟเฟ็กต์ให้ดูนา่ สนใจ
ขน้ั ตอนที่ 1 สรา้ งภาพพนื้ หลงั
สร้างพื้นหลังขนาด 800 x 600 พิกเซล และเทสีแดงลงไป จากนั้นสร้างรูป 5 เหลี่ยมข้ึน
มาแลว้ ลบสพี ืน้ หลงั ของ 5 เหล่ยี มออกไป โดยมขี ้นั ตอนดังตอ่ ไปน้ี
1. กาหนดขนาดการด์ ในหนา้ ต่าง New เท่ากบั 800 x 600

4. ใช้ Paint Bucket Tool

3. เลือกสโี ฟร์กราวนด์เปน็ สแี ดง 2. คลิกที่ เพื่อเพิ่มเลเยอรใ์ หม่
5. คลิกเลอื กเคร่ืองมอื Polygon Tool

6. คลิกเลือกการวาดภาพแบบโครงร่างออปชนั บาร์

๙๗
7. คลกิ เมาสแ์ ลว้ ลากวาดรูปหลายเหลี่ยมในขนาดท่ีต้องการ
8. คลิกปุ่ม <ctrl>+<Enter> เพื่อเปล่ียนเสน้ พาธใหเ้ ปน็ การเลอื กพน้ื ท่ี

๙๘

9. กดปมุ่ <Delete> เพื่อลบพน้ื ที่สีแดงอยใู่ นการเลอื กพ้ืนที่ออกไป
ข้ันตอนท่ี 2 สร้างภาพตุ๊กตา

ตอ่ ไปจะมาวาดภาพต๊กุ ตาจากเครอ่ื งมอื พ้ืนฐานกนั โดยมวี ิธีการดงั น้ี
1. ใช้เคร่ืองมือ Rounded Rectangle Tool
2. เลอื กการวาดแบบมเี ฉพาะสพี ื้น

3.คลิกที่ ในพาเยล Layers เพื่อเพมิ่ สีเลเยอรใ์ หม่ขึ้นมา
4. วาดรปู สเี่ หลี่ยมมุมมนในขนาดทตี่ ้องการ

๙๙

5. เลอื กชนดิ ของพน้ื หลังทต่ี อ้ งการใสใ่ ห้กับรูปส่เี หลี่ยมมมุ มนในพาเนล Layers

6. แสดงผลลพั ธข์ องการใหส้ ีพ้นื ให้กับรปู สีเ่ หล่ยี มมมุ ลา่ ง

7. สร้างเลเยอร์ใหม่ และใช้เครอ่ื งมือ Ellipse Tool

๑๐๐

8. วาดรปู หนา้ ตกุ๊ ตา แลว้ ใส่สี

9. ใช้เคร่อื งมือ Line Tool ลากเสน้ เฉยี งเพ่อื ทาเป็นปากของตกุ๊ ตา

10. ใชเ้ คร่ืองมือ Rectangle Tool ลากรูปหลายเหล่ียม เพื่อวาดหมวกของตุ๊กตา ทาการเลือก
พื้นทแี่ ลว้ ใสส่ ี จากน้นั ปรบั มุมเอียงด้วยคาส่งั Free Transform ตามตอ้ งการ

๑๐๑
ขั้นตอนที่ 3 วาดดอกไม้

สามารถใช้เคร่ืองมือ Ellipse Tool วาดวงรีมาประกอบกันเป็นดอกไม้ โดยมีข้ันตอน
ดงั ตอ่ ไปนี้

1. สร้างเลเยอร์ใหม่ ใช้เครื่องมอื Ellipse Tool วาดวงรแี บบโครงรา่ ง

2. เปลี่ยนเส้นพาธเป็นการเลอื กพ้ืนทแี่ ละใสส่ ใี หก้ ับกลบี ดอกไม้

๑๐๒
3. คดั ลอกเลเยอรแ์ ลว้ ทาการเล่อื นตาแหนง่ ใหเ้ หมาะสม
4. คดั ลอกเลเยอร์ทงั้ 2 เลเยอรแ์ ล้วทาการหมุนใหเ้ ปน็ กลบี ดอกไม้จากนนั้ กด Enter

๑๐๓

6. ทาการรวมเลเยอร์กลบี ดอกไม้แล้วคัดลอกจัดตาแหนง่ ให้สวยงาม

ขั้นตอนท่ี 4 เพ่ิมเอฟเฟก็ ตใ์ หด้ นู า่ สนใจ
ต่อไปจะเป็นการตกแต่งรูปดอกไม้ด้วย Layer Styles และตกแต่งชิ้นงานด้วยการคัดลอก

ดอกไม้มาประดับใหส้ วยงาม จากนั้นนาภาพเข้ามาใส่ตามต้องการ

๑๐๔

1. คลกิ เลือกเลเยอรก์ ลีบดอกไมท้ ่ีอยู่เลเยอรบ์ น

2. คลกิ ปมุ่ ลูกศร แลว้ เลอื กคาส่ัง Merge Down เพอื่ รวมเลเยอรก์ ลีบดอกไม้ท้ัง 3 เลเยอร์
3. คลิกเลือกลวดลายของกลบี ดอกไม้

๑๐๕

4. แสดงกลีบดอกไมท้ ี่สร้างเสรจ็ แลว้

8.4 ตวั อยา่ งการวาดภาพด้วยรูปทรงสาเรจ็ รูป
ในหัวข้อน้ีจะใช้เครื่องมือ Custom Shape Tool ที่ประกอบด้วยรูปทรงสาเร็จแบบต่าง ๆ ท่ี

โปรแกรมมีมาให้ เช่น หมวดรูปสัตว์ (Animal), หมวดธรรมชาติ (Nature) เป็นต้น มาสร้างงานวาด
ภาพกราฟกิ ทส่ี วยงามจนิ ตนาการ ดงั นี้

1. เลือกใช้ Custom Shape Tool

2. คลิกปุม่ แลว้ เลือกคาส่งั All เพื่อแสดงรูปทรงสาเรจ็ รูปทั้งหมด

๑๐๖

3. คลิกเมาส์เพ่ือตกลง

4. คลิกเมาสเ์ ลอื กทรงสาเร็จรูป
5. คลกิ ท่ี Path บนออปชัน่ บาร์เพ่ือสรา้ งรูปทรงแบบโครงร่าง

๑๐๗

6.คลกิ ท่ี Shape บนออปขัน่ บาร์ เพ่อื สร้างรูปทรงแบบโครงรา่ งและมสี ีพื้น

7. คลกิ เลอื กรปู ทรงสาเรจ็ รปู อืน่ ๆ

8.5 การวาดรปู ทรงอสิ ระ (Pen Tool)

๑๐๘

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

Pen Tool ใชว้ าดเสน้ ด้วยปากกา

Freeform Pen Tool ใช้สร้างเส้นพาธตามการลากเมาส์อยา่ งอิสระ

Add anchor Point Toolการเพ่ิมจดุ ในแนวเสน้ พาธ

Delete anchor Point Tool ใชล้ บจุดในแนวเสน้ พาธ

Convert Point Tool ใช้เปล่ียนแขนเส้นพาธ เพ่ือให้เส้นพาธโค้งหรือ

ตรง

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

Pen Selection Tool ใช้เลือกเส้นพาธ และเคลื่อนย้ายตาแหน่งของ
เสน้ พาธ

Direct Selection Tool ใช้ในการตัด และเคล่ือนย้ายตาแหนง่ ของจดุ ต่าง

ๆ บนเส้นพาธ

8.6 การทางานกบั เส้นพาธ

เม่อื สรา้ งเส้นพาธขน้ึ มา สามารถทางานกบั เส้นพาธและจดั การกบั เส้นพาธไดด้ งั นี้

การปรับพาธใหเ้ ป็นการเลอื กพ้ืนท่ี

สามารถเปลี่ยนเส้นพาธให้เป็นเส้นปะ ให้เป็นการเลือกของพื้นที่ได้ โดยใช้คาส่ัง Make

Selection ทพ่ี าเนล Paths

1. คลกิ เมาส์

2. เลอื ก Make Selection.

3. คลิกเมาส์ตอบตกลง
การใสส่ ใี ห้กับเส้นพาธ

๑๐๙

สามารถใส่สเี ส้นพาธไดต้ ามต้องการ ด้วยวิธีการดังต่อไปนี้
1. สร้างเส้นพาธ
2. สลับสีโฟร์กราวนดใ์ หเ้ ป็นสีขาว

3. คลกิ เมาสป์ ุ่มขวาท่ีช่องเกบ็ พาธที่สร้าง แลว้ เลอื กคาส่งั Stroke Path

4. เลือก Brush

5. คลิกเมาส์ OK
การสร้างชอ่ งเกบ็ พาธใหม่

ในการสร้างพาธ ไม่ว่าจะสร้างพาธท้ังหมดเก็บในช่องพาธเดียวกันในพาเนล Paths แต่
ตอ้ งการสรา้ งพาธใหม่ที่แยกจากพาธเดมิ ท่ีเคยสรา้ ง จะใชป้ ุ่ม (Create New Path) สร้างช่องพาธใหม่
ขน้ึ มาเพ่ือเกบ็ พาธทต่ี า่ งจากลกั ษณะเดิม ดงั นี้

แผนการจัดการเรียนรู้ม่งุ เน้นสมรรถนะ ๑๑๐
ช่ือหน่วย การวาดภาพและรูปทรง
หนว่ ยที่ 8
สัปดาหท์ ี่ 12 - 13
จานวน 6 ชว่ั โมง

จานวน 6 ชว่ั โมง

5.กิจกรรมการเรยี นการสอน
5.1 การนาเขา้ สบู่ ทเรียน
5.1.1ครู เช็คชือ่ และตรวจการแต่งกาย
นักเรยี น ขานช่อื และลุกข้ึนให้ครูตรวจการแตง่ กายทีละคน
5.1.2ครู ทบทวนก่อนเรยี นโดยการซกั ถามเก่ียวกบั การวาดภาพและรูปทรง
นกั เรยี น ตอบคาถาม ซักถามข้อสงสัย
5.2 การเรียนรู้
5.2.1ครู อธบิ ายถึงการวาดภาพและรปู ทรง และการใชง้ านโปรแกรมโดย
การสาธิตการใชง้ านโปรแกรม ตอบคาถาม/ซักภามข้อสงสัย
นักเรยี น จดบนั ทึก ตอบคาถาม ปรกึ ษา/อภปิ รายกับเพอื่ น
5.2.2ครู ทดสอบผเู้ รยี นโดยการถามตอบกนั ภายในหอ้ งเรยี น และอธิบาย
บางในข้อท่ผี ูเ้ รียนมีขอ้ สงสัยจดบนั ทกึ ย่อ
นักเรยี น ร่วมกนั อภปิ รายหาข้อสรปุ
5.2.3ครู ใหน้ กั เรียนทาแบบทดสอบเร่ืองการวาดภาพและรปู ทรง เพ่อื เกบ็
คะแนน
นักเรยี น ทาแบบทดสอบ
5.2.4ครู ใหท้ าการทดลองใบงาน/ให้คาแนะนา
นักเรยี น ปฏบิ ตั ิการทดลองตามใบงาน
5.3 การสรุป
5.3.1ครู สมุ่ เรยี กนกั เรยี นออกมาสรปุ เน้ือหาที่ได้เรียนมาทลี ะคนจน
ครอบคลุมเนื้อหาทง้ั หมด โดยครูชว่ ยใหค้ าแนะนา และอธิบาย
เพม่ิ เติม
นักเรยี น ออกมาหน้าช้นั เรียนสรุปเน้ือหาซกั ถามปญั หาและจดบนั ทึก
เพ่ิมเติม
5.3.2ครู ใหน้ กั เรยี นทาใบปฏิบตั กิ ารทดลองใหเ้ สร็จสมบรู ณ์และให้
นักเรยี นซักถามปัญหาในการเรียน
นกั เรียน ซักถามปญั หาและข้อสงสัยในใบปฏิบัตกิ ารทดลอง สรปุ ผลการ
ทดลองและสง่ ใบปฏบิ ตั ิการทดลอง
5.4 การวดั และประเมนิ ผล
5.4.1ครู ส่มุ ถามนักเรียนเกยี่ วกบั เน้ือหาท่เี รยี น
นกั เรยี น ตอบคาถามท่ีครูถาม

๑๑๑

5.4.2ครู ให้นกั เรียนทาแบบทดสอลประจาหนว่ ย ตรวจใบปฏบิ ตั กิ าร
นกั เรียน ทดลองของนักเรียน เฉลยแบบทดสอบประจาหนว่ ยและบันทึก
คะแนน
ทาแบบทดสอบประจาหน่วย และแลกเปล่ยี นกนั ตรวจ
แบบทดสอบ

6. สอ่ื การเรียนร/ู้ แหล่งเรยี นรู้
6.1 ส่ือสิ่งพมิ พ์
หนังสอื เรยี นวชิ า โปรแกรมกราฟิก (Photoshop CS6) ปยิ ะ นากสงค.์ (2562). กรุงเทพ :
ซัคเซส มเี ดี
6.2 ส่ือโสตทศั น์
สอ่ื Power point วชิ า การสรา้ งเวบ็ ไซต์ หน่วยท่ี 8 เร่ือง การวาดภาพและรปู ทรง

7. เอกสารประกอบการจดั การเรียนรู้ (ใบความรู้ ใบงาน ใบมอบหมายงาน ฯลฯ)
7.1 ใบความรปู้ ระกอบการเรียนวิชา โปรแกรมกราฟิก หน่วยที่ 8 เรื่อง การวาดภาพและรปู ทรง
7.2 ใบปฏบิ ัติการทดลองท่ี 1

8. การบูรณาการ/ความสัมพนั ธก์ บั วิชาอนื่
8.1 สามารถนาความร้มู าใชใ้ นการตกแตง่ ภาพกราฟิก
8.2 สามารถนาความรมู้ าใชร้ ่วมกับวชิ าโครงงาน

9. การวดั และประเมินผล
9.1กอ่ นเรียน
9.1.1.ผู้เรียนศึกษา ค้นควา้ จากเอกสาร ตารา เกี่ยวกบั ความรู้เกี่ยวกบั โปรแกรมกราฟิก
9.1.2.ผู้เรยี นทาแบบทดสอบก่อนเรียน
9.2ขณะเรียน
9.2.1.การสังเกตพฤติกรรมภายในช้ันเรยี น
9.2.2.ทาแบบฝึกหัดประจาหนว่ ย
9.3 หลังเรียน
9.3.1.ให้ผู้เรยี นชว่ ยกนั สรปุ เนอ้ื หา
9.3.2.ทาแบบทดสอบหลังเรยี น
9.3.3.ทาแบบทดสอบประจาหน่วย เพอ่ื วดั ผลสมั ฤทธท์ิ างการเรยี น

10.บันทกึ หลงั การสอน
10.1 ผลการใช้แผนการจดั การเรยี นรู้

............................................................................................................................. ...................................
................................................................................................ ................................................................
............................................................................................................................. ...................................

๑๑๒

............................................................................................................................. ...................................
................................................................................................ ................................................................
............................................................................................................................. ...................................
............................................................................................................................. ...................................

10.2 ผลการเรยี นรูข้ องนกั เรียน นักศึกษา
....................................................................................... .........................................................................
............................................................................................................................. ...................................
.................................................................................................................................. ..............................
....................................................................................................................... .........................................
............................................................................................................................. ...................................
................................................................................................................................................................

10.3 แนวทางการพัฒนาคณุ ภาพการเรยี นรู้
................................................................................................................ ................................................
............................................................................................................................. ...................................
................................................ ............................................................................................................ ....
............................................................................................................................. ...................................
............................................................................................................................. ...................................
................................................................................................ ................................................................

แผนการจดั การเรียนรู้มุ่งเน้นสมรรถนะ ๑๑๓
ชอื่ หน่วย ความรเู้ รอ่ื งสีและการใช้โหมดสี
หน่วยท่ี 9
สปั ดาหท์ ี่ 14
จานวน 3 ชั่วโมง

จานวน 3 ชวั่ โมง

1. สาระสาคญั
สีท่ีมองเห็นรอบ ๆ ตัวน้ัน เกิดข้ึนจากการที่ตาของเราที่รับแสงที่สะท้อนมาจากวัตถุเหล่านั้น

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

2. สมรรถนะประจาหน่วย
2.1 โมเดลการมองเหน็ สที ่วั ไป
2.2 โมเดลการมองเห็นสใี นโปรแกรม Photoshop
2.3 การเปล่ียนโหมดสีของภาพ

3. จดุ ประสงค์การเรียนรู้
3.1 ด้านความรู้
3.1.1 ลกั ษณะโมเดลสแี บบต่าง ๆ
3.1.2 โหมดสใี น Photoshop
3.1.3 การเปลี่ยนโหมดสีของภาพ
3.2 ด้านทกั ษะ
3.2.1 อธบิ ายลักษณะโมเดลสีแบบต่าง ๆ ได้
3.2.2 อธิบายโหมดสีใน Photoshop ได้
3.2.3 สามารถเปลย่ี นโหมดสีของภาพได้
3.3 คณุ ลกั ษณะท่ีพึงประสงค์
3.3.1 ใฝ่เรียนรู้
3.3.2 ทางานเป็นระเบียบเรยี บร้อย
3.3.3 ผเู้ รียนมคี วามรบั ผดิ ชอบตอ่ หน้าที่
3.3.4 ปฏบิ ตั งิ านด้านความซ่ือสตั ยส์ ุจริต
3.3.5 มีความม่งุ ม่นั ในการทางาน
3.3.6 ใชเ้ วลาอย่างคุ้มคา่
3.3.7 มจี ิตสาธารณะ

แผนการจัดการเรียนรู้มุ่งเน้นสมรรถนะ ๑๑๔
ชอื่ หน่วย ความรู้เร่ืองสีและการใช้โหมดสี
หน่วยที่ 9
สปั ดาห์ที่ 14
จานวน 3 ชัว่ โมง

จานวน 3 ชว่ั โมง

4. เนื้อหาสาระการเรยี นรู้
9.1 โมเดลการมองเหน็ สีทัว่ ไป

โดยท่ัวไปแล้วสีต่าง ๆ ในธรรมชาติและสีที่ถูกสร้างขึ้น จะมีรูปแบบการมองเห็นสีที่แตกต่าง
กัน ซึ่งรปู แบบการมองเหน็ สนี ้เี รยี กวา่ “โมเดล (model)” ดังนั้น จึงทาใหม้ โี มเดลหลายแบบดังทจ่ี ะได้
ศึกษาตอ่ ไปนคี้ อื

 โมเดล HSB ตามหลักการมองเหน็ สีของสายตามนุษย์
 โมเดล RGB ตามหลกั การแสดงสขี องเครอื่ งคอมพวิ เตอร์
 โมเดล CMYK ตามหลกั การแสดงสีของเครื่องพิมพ์
 โหมด Lab ตามมาตรฐานของ CIE

โมเดล HSB ตามหลกั การมองเห็นสขี องมนษุ ย์

เป็นลักษณะพื้นฐานของการมองเห็นสีด้วยสายตาของมนุษย์ โมเดล HSB จะประกอบด้วย
ลกั ษณะสี 3 ลักษณะคอื

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

๑๑๕

คา่ Hue จะบอกค่าสเี ปน็ องศาจาก 0 องศา หมนุ ไปถงึ 360 องศา
2. Saturation คือสัดส่วนของสีเทาที่มีอยู่ในสีน้ัน โดยวัดค่าสีเทาในสีหลักเป็นเปอร์เซ็นต์
ดังนี้คือ จาก 0% (สีเทาผสมอยู่มาก) จนถึง 100% (สีเทาไม่มีเลย หรือเรียกว่า “Full Saturation”
คือสีมคี วามอม่ิ ตวั เตม็ ท่)ี โดยค่า Saturation นี้จะบ่งบอกถึงความเข้มข้นและความจางของสี ถ้าถูกวัด
โดยตาแหน่งบน Standard Color Wheel ค่า Saturationจะเพิ่มข้ึนจากจุดก่ึงกลางจนถึงเส้นจะมีสี
ทช่ี ัดเจน และอิม่ ตวั ที่สุด

คา่ Saturation เรมิ่ ตง้ั แต่ 0% ทจ่ี ดุ ก่ึงกลางไล่ไปเรือ่ ยๆ จนถงึ 100% ท่ีชอบ
3. Brightness เป็นเร่อื งราวของความสวา่ งและความมดื ของสี ซงึ่ ถกู กาหนดค่าเป็น
เปอรเ์ ซ็นตจ์ าก0 % (สีดา) ถึง 100% (สีขาว) ยิง่ มเี ปอร์เซ็นต์มากจะทาใหส้ ีนน้ั สว่างมากขนึ้

โมเดล RGB ตามหลักการแสดงสีของเครอื่ งคอมพิวเตอร์

๑๑๖
โมเดล RGB เกิดจากการรวมกันของสเปกตรัมของแสงสีแดง (red), เขียว (green), และน้า
เงนิ (blue) ในสัดส่วน ความเขม้ ขน้ ที่แตกต่างกัน โดยจดุ ท่ีแสงทั้งสามสรี วมกันจะเปน็ สีขาว นยิ มเรยี ก
การผสมสีแบบน้ีว่า “Additive Color”แสงสี RGB มักจะถูกใช้สาหรับการส่องแสงทั้งบนจอภาพทีวี
และจอคอมพิวเตอร์ ซึ่งสร้างจากสารที่ทาให้เกิดแสงสีแดง สีเขียว และสีน้าเงิน ทาให้สีดูสว่างกว่า
ความเปน็ จริง

โมเดล CMYK ตามหลักการแสดงของเคร่ืองพิมพ์
โมเดล CMYK มีแหล่งกาเนิดสีอยู่ที่การซึมซับ (Absorb) ของหมึกพิมพ์บนกระดาษ โดยมีสี

พืน้ ฐานคอื สฟี า้ (Cyan) สบี านเยน็ (Magenta) และสีเหลอื ง (Yellow) โดยเรียกการผสมสที งั้ 3 สีข้าง
ต้นว่า “Subtractive color” แต่สี CMYก็ไม่สามารถผสมรวมกันให้ได้สีบางสี เช่น สีน้าตาล จึงต้องมี
การเพ่ิมสีดา (Black) ลงไปฉะนั้นเมื่อรวมกันทั้ง 4 สี คือCMYK สีท่ีได้จากการพิมพ์ จึงจะครอบคลุม
ทุกสี

โมเดล Lab ตามมาตรฐานของ CIE
โมเดล Lab เปน็ คา่ สที ีก่ าหนดขึ้นโดย CIE (commission Internationale d ́ Eclairage)ให้

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

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

๑๑๗

9.2 โมเดลการมองเหน็ สใี นโปรแกรม Photoshop
จากการมองเหน็ สีโดยท่ัวไปมาสูห่ ลกั การมองเห็นสใี น Photoshop ทจี่ ะเรยี กว่า “โหมด

(mode)” ซ่ึงโหมดของสีใน Photoshop จะแบ่งออกเป็น 3 กลมุ่ ดงั น้ี
กล่มุ ที่ 1 โหมดท่ีอ้างอิงตามโมเดล
กลุ่มที่ 2 โหมดที่ถูกกาหนดขึ้นพิเศษหรือทเ่ี รียกว่า “โหมด Specialized”
กลุ่มที่ 3 โหมดสผี สมที่เรียกว่า “โหมด Blending”

ซ่งึ มีรายละเอียดดงั ตอ่ ไปนี้
กลมุ่ ท่ี 1 โหมดที่อา้ งอิงตามโมเดล
โหมด RGB

ใช้หลักการของโมเดล RGB โดยมีการกาหนดค่าความเข้มข้นของสีแดง เขียว และน้าเงิน มา
ผสมกันในแตล่ ะจดุ สี เปน็ ค่าตงั้ แต่ 0 ถึง 255 ตัวอย่างเช่น สี Bright Red เกดิ จาก R (สีแดง) ท่ี 256
และ G (สเี ขียว) ที่ 20 และ B (สีน้าเงิน) ที่ 500

ภาพที่เกิดจากโหมด RGB จะเป็นการซ้อนภาพสี 3 ชั้น ชั้นละสี ซึ่งเรียกช้ันของสีเหล่านี้ว่า
“Channel” โดยจะมีสีท่แี ตกตา่ งเกิดข้นึ ถึง 16.7 ล้านสี หรอื 224

๑๑๘

ภาพในโหมด RGB ซ่งึ เกิดจากการ
ผสมแสงสี แดง เขียว และน้าเงนิ 

 แสงสีแดง (Red)  แสงสีเขียว (Green)  แสงสีนา้ เงิน (Blue)

โหมด CMYK
ใช้หลกั การของโมเดล CMYK โดยมีการกาหนดคา่ สีจากรอ้ ยละความเขม้ ขน้ ของสแี ตล่ ะสีที่มา

ผสมกนั เช่น สี Bright Red เกิดจาก C=2%, M=93%, Y=90% และ K = 0 % หรอื สขี าว

ภาพโหมด CMYK ซึ่งเกิดจาการผสมของหมึก
สี Cyan, Magenta, Yellow และ Black 

 สฟี า้ (Cyan)  สีบานเย็น  สเี หลือง (Yellow)  สดี า (Black)
โหมด Lab (Magenta)

๑๑๙

ใช้หลักการของโมเดล Lab ในการผสมสี โดย
โปรแกรมจะยึดโหมดนี้เป็นเหมือนตัวกลางในการแปลง
จากโหมดสีหนึ่งไปอีกโหมดสีหนึ่ง เนื่องจากหลักการของ
Lab นี้เป็นมาตรฐานที่ไม่ขึ้นอยู่กับโหมดใด ๆ จึงใช้เป็น

 ภาพในโหมด Lab ซ่งึ เกิดจากการ
ผสมกนั ของ 3 องคป์ ระกอบคือ L*a*b

 Luminance  A Component (Green-  B Component (Blue-
Red) Yellow)

๑๒๐

กลมุ่ ท่ี 2 โหมดท่ีถกู กาหนดขนึ้ พิเศษหรือท่เี รยี กวา่ “โหมด Specialized”
โหมด Bitmap

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

โหมด Gray Scale
ประกอบดว้ ยสีทั้งหมด 256 สี โดยไลส่ จี าก ขาว สี

เทาไปเร่ือย ๆ จนท้ายสุดคือสีดา ใช้พื้นท่ี ในการเก็บข้อมูล 8
บิต ตอ่ 1 จดุ สี

โหมด Duotone

เป็นโหมดสีทีเ่ กดิ จากการใชส้ เี พยี งบางสีผมสมกันให้
เกิดเป็นภาพ มักจะเห็นการนาไปใช้ ในงานสิง่ พิมพท์ ี่ต้องการ
ใชภ้ าพ 2 สี

โหมด Indexed color
ถึงแม้บางภาพจะมีสีได้มากถึง 16.7 ล้านสี แต่

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

โหมด Multichannel

เป็นโหมดสีที่ถูกแสดงด้วย Channel ตั้งแต่ 2
ช่องขึ้นไป เป็นโหมดสีที่มีประโยชน์มากสาหรับงานพิมพ์
โดยเฉพาะกรณกี ารพมิ พ์ท่สี ง่ั ให้พิมพส์ ีพเิ ศษ

แสดงภาพในโหมด MultiChannel 
ซ่ึงเกิดจากการผสมกันของส CMY
กล่มุ ท่ี 3 โหมดสผี สมท่ีเรยี กว่า “โหมด Blending”

๑๒๑

เป็นโหมดพิเศษที่ใช้ในพาเนล Layers เพื่อเป็นตัวกาหนดว่าจุดสีแต่ละจุดจะมีการ
เปล่ียนแปลงอย่างไร เม่ือมกี ารปรบั เปล่ยี นให้แสดงผลในโหมด Blending ตา่ ง ๆ
9.3 การเปล่ยี นโหมดสขี องภาพ

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

เปลี่ยนโหมดสี RGB เปน็ CMYK
มักจะเร่ิมต้นสร้างช้ินงานในโหมด RGB เพราะเป็นโหมดสีที่คุ้นเคยและเป็นโหมดสีที่ใช้

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

1. เลือกเมนคู าสัง่ Image->Mode->CMYK Color 2. แสดงผลลพั ธเ์ ป็นภาพในโหมดสี CMYK

เปลี่ยนโหมดสี CMYK เป็น RGB
สาหรับคนท่ีได้บันทกึ ช้ินงานกราฟิกไวใ้ นโหมด CMYK ถ้าจะให้สีตรงกับที่ออกแบบเพื่อนาไป

แสดงบนเว็บ ควรเปลี่ยนโหมดสีของภาพเป็น RGB เพ่ือให้ตรงกับการแยกสีในหน้าจอคอมพิวเตอร์
ดังน้ี

1. เลือกเมนคู าสง่ั Image->Mode->RGB Color 2. แสดงผลลัพธ์เปน็ ภาพในโหมดสี RGB

เปลย่ี นโหมดสเี ปน็ Grayscale
ภาพในโหมด Grayscale จะเป็นภาพไล่โทนสีขาวดา เหมาะกับการนาไปผลิตงานสิ่งพิมพ์สี

เดียว ดังนี้

๑๒๒

1. เลือกเมนูคาสัง่ Image->Mode->Grayscale

2. โปรแกรมจะเตือนว่าการเปลีย่ นโหมดจะละทิง้ คณุ สมบตั ขิ องโหมดเดิม ใหค้ ลกิ เมาสต์ อบตกลง
3. ผลลพั ธท์ ไ่ี ดใ้ นโหมด Grayscale

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

ในการเปลี่ยนโหมดจากภาพสีให้มาเป็น Bitmap จะต้องเปล่ียนภาพให้เป็น Grayscale เสียก่อน
จากน้ันจึงจะเปลี่ยนมาเป็น Bitmap ได้ และในการบันทึกภาพน้ันต้องบันทึกเป็นนามสกุล BMP ซ่ึง
เปน็ รปู แบบทร่ี องรบั ภาพในโหมด Bitmap
1. เลอื กเมนคู าสงั่ Image->Mode->Bitmap

๑๒๓

2. กาหนดคา่ ความละเอียดของภาพ

4. คลกิ OK

3. คลกิ ปุ่มลกู ศร เลอื กวิธกี ารแปลงภาพ

โหมด Grayscale 50% Threshold Diffusion Dither

๑๒๔

Pattern Dither  Halftone Screen

เปล่ียนโหมดสเี ป็น Duotone
มกั จะเห็นภาพ Duotone ในการนาไปพิมพเ์ ปน็ งานโฆษณา หรอื ใบปลิว 2 สี ในการเปลี่ยนโหมด

สีจะต้องถอดสีออกจากภาพให้เป็น Grayscale เสียก่อน จากน้ันจึงจะแปลงเป็น Duotone โดยการ
กาหนดสีแรกแทนส่วนสีดา และสีที่สองแทนสว่ นท่เี ป็นสขี าว ดังนี้
1. เลือกเมนูคาส่งั Image->Mode->Duotone

2. เลือกสที ี่จะใชแ้ ทนสีดา

4. คลิกเพื่อใชส้ ีท่ีกาหนด

3. เลอื กสที จ่ี ะใชแ้ ทนสีขาว

แผนการจดั การเรยี นรู้มุ่งเน้นสมรรถนะ ๑๒๕
ช่อื หน่วย ความรเู้ รือ่ งสีและการใชโ้ หมดสี
หนว่ ยท่ี 9
สัปดาห์ท่ี 14
จานวน 3 ชวั่ โมง

จานวน 3 ช่วั โมง

5.กิจกรรมการเรยี นการสอน
5.1 การนาเข้าส่บู ทเรยี น
5.1.1ครู เช็คช่ือและตรวจการแต่งกาย
นักเรยี น ขานชื่อและลุกขนึ้ ให้ครตู รวจการแต่งกายทีละคน
5.1.2ครู ทบทวนกอ่ นเรยี นโดยการซกั ถามเกี่ยวกบั ความรู้เรื่องสีและการใช้
โหมดสี
นักเรียน ตอบคาถาม ซักถามข้อสงสยั
5.2 การเรยี นรู้
5.2.1ครู อธิบายถึงความรู้เร่อื งสแี ละการใช้โหมดสี และการใช้งาน
โปรแกรมโดยสอ่ื PowerPoint ตอบคาถาม/ซกั ภามข้อสงสยั
นกั เรียน จดบนั ทกึ ตอบคาถาม ปรึกษา/อภปิ รายกบั เพื่อน
5.2.2ครู ทดสอบผเู้ รียนโดยการถามตอบกันภายในหอ้ งเรยี น และอธิบาย
บางในข้อทผ่ี ู้เรียนมีข้อสงสัยจดบนั ทกึ ย่อ
นกั เรียน รว่ มกันอภปิ รายหาข้อสรุป
5.2.3ครู ให้นกั เรียนทาแบบทดสอบเรื่องความรเู้ รื่องสีและการใชโ้ หมดสี
เพ่อื เกบ็ คะแนน
นกั เรยี น ทาแบบทดสอบ
5.2.4ครู ใหท้ าการทดลองใบงาน/ให้คาแนะนา
นักเรยี น ปฏิบตั กิ ารทดลองตามใบงาน
5.3 การสรปุ
5.3.1ครู สุม่ เรยี กนักเรียนออกมาสรุปเนอื้ หาท่ีได้เรียนมาทลี ะคนจน
ครอบคลุมเน้ือหาทั้งหมด โดยครชู ว่ ยใหค้ าแนะนา และอธิบาย
เพิม่ เติม
นักเรียน ออกมาหนา้ ช้นั เรยี นสรุปเนอ้ื หาซกั ถามปัญหาและจดบนั ทึก
เพ่มิ เติม
5.3.2ครู ให้นกั เรยี นทาใบปฏิบตั ิการทดลองใหเ้ สรจ็ สมบูรณ์และให้
นักเรียนซกั ถามปัญหาในการเรียน
นกั เรยี น ซักถามปัญหาและข้อสงสยั ในใบปฏิบตั ิการทดลอง สรุปผลการ
ทดลองและสง่ ใบปฏิบัติการทดลอง
5.4 การวดั และประเมนิ ผล
5.4.1ครู สุ่มถามนักเรยี นเกี่ยวกบั เนื้อหาทเ่ี รียน
นกั เรยี น ตอบคาถามที่ครถู าม

๑๒๖

5.4.2ครู ใหน้ ักเรียนทาแบบทดสอลประจาหน่วย ตรวจใบปฏิบัตกิ าร
ทดลองของนักเรยี น เฉลยแบบทดสอบประจาหน่วยและบันทึก
คะแนน

นักเรยี น ทาแบบทดสอบประจาหนว่ ย และแลกเปลยี่ นกันตรวจ
แบบทดสอบ

6. สือ่ การเรยี นร/ู้ แหล่งเรยี นรู้
6.1 สื่อสงิ่ พิมพ์
หนงั สอื เรียนวชิ า โปรแกรมกราฟกิ (Photoshop CS6) ปิยะ นากสงค.์ (2562). กรงุ เทพ :
ซัคเซส มีเดี
6.2 สื่อโสตทศั น์
สอื่ Power point วิชา การสรา้ งเวบ็ ไซต์ หน่วยที่ 9 เร่อื ง ความรู้เรือ่ งสแี ละการใชโ้ หมดสี

7. เอกสารประกอบการจดั การเรยี นรู้ (ใบความรู้ ใบงาน ใบมอบหมายงาน ฯลฯ)
7.1 ใบความรู้ประกอบการเรียนวิชา โปรแกรมกราฟิก หนว่ ยที่ 9 ความรู้เร่อื งสีและการใชโ้ หมด
สี

8. การบรู ณาการ/ความสัมพนั ธก์ บั วชิ าอน่ื
8.1 สามารถนาความรมู้ าใช้ในการตกแต่งภาพกราฟิก
8.2 สามารถนาความรู้มาใช้ร่วมกบั วิชาโครงงาน

9. การวดั และประเมินผล
9.1ก่อนเรียน
9.1.1.ผู้เรียนศกึ ษา คน้ คว้าจากเอกสาร ตารา เกย่ี วกบั ความรู้เกยี่ วกบั โปรแกรมกราฟกิ
9.1.2.ผเู้ รียนทาแบบทดสอบก่อนเรียน
9.2ขณะเรียน
9.2.1.การสงั เกตพฤติกรรมภายในช้ันเรยี น
9.2.2.ทาแบบฝึกหัดประจาหนว่ ย
9.3 หลังเรียน
9.3.1.ใหผ้ เู้ รียนช่วยกนั สรปุ เนอ้ื หา
9.3.2.ทาแบบทดสอบหลงั เรียน
9.3.3.ทาแบบทดสอบประจาหนว่ ย เพ่อื วดั ผลสัมฤทธ์ิทางการเรยี น

10.บนั ทกึ หลงั การสอน
10.1 ผลการใช้แผนการจดั การเรียนรู้

............................................................................................................................. ...................................
................................................................................................ ................................................................
............................................................................................................................. ...................................