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

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

รหสั วิชา 20901-1004
คอมพิวเตอรก์ ราฟิ กเบอื้ งต้น

หลกั สตู รประกาศนียบตั รวิชาชีพ (ปวช.)
ภาคเรยี นที่ 2 ปี การศึกษา 2563

นายพฒั น์สาริทธ์ิ มณีเขียว
ตาแหน่ง ครู

แผนกวิชาเทคโนโลยีสารสนเทศ

วิทยาเทคนิคสมทุ รปราการ
สานักงานคณะกรรมการการอาชีวศึกษา กระทรวงศึกษาธิการ

แผนการจัดการเรยี นรู้มุ่งเนน้ สมรรถนะ

ช่อื วิชา คอมพิวเตอรก์ ราฟิกเบ้อื งตน้ รหัสวชิ า 20901-1004
ทฤษฎี 1 ปฏิบตั ิ 2 หนว่ ยกิต 2

หลักสตู รประกาศนยี บตั รวิชาชีพ หลักสตู รประกาศนียบัตรวชิ าชพี ขนั้ สงู
ประเภทวชิ า เทคโนโลยีสารสนเทศและการสอื่ สาร
สาขาวิชา เทคโนโลยีสารสนเทศ

จัดทาโดย
นายพัฒนส์ ารทิ ธ์ิ มณีเขยี ว

วทิ ยาลยั เทคนิคสมทุ รปราการ
สานกั งานคณะกรรมการการอาชีวศึกษา

กระทรวงศึกษาธิการ

ก

คำนำ

แผนการสอนวชิ า เทคโนโลยีสารสนเทศเพอ่ื การจัดการอาชพี รหัสวิชา 3001-2001 จัดทา
ขึ้นเพื่อเป็นแนวทางในการจัดการเรียนการสอน วิชา คอมพิวเตอร์กราฟิกเบ้ืองต้น ตามหลักสูตร
ประกาศนียบัตรวิชาชีพ พุทธศักราช 2562 ของสานักงานคณะกรรมการการอาชีวศึกษา เป็น
การศึกษาและปฏิบัติเก่ียวกับพ้ืนฐานของกราฟิก หลักการของภาพกราฟิกแบบเวกเตอร์และบิตแมป
ประเภทและคุณลักษณะของแฟ้มภาพกราฟิก การสร้างและตกแต่งภาพกราฟิก การจัดการแฟ้ม
ภาพกราฟิก การใช้โปรแกรม สร้างภาพกราฟิกแบบเวกเตอร์และบิตแมป โดยจัดการเรียนการสอน
ท้ังหมด 18 สัปดาห์ สัปดาห์ละ 3 ชั่วโมง เนื้อหาแบ่งเป็น 12 หน่วย ดังนี้ หน่วยท่ี 1 พ้ืนฐาน
โปรแกรม Photoshop CS6 หน่วยท่ี 2 หลักการสร้างงานกราฟิกและใช้เคร่ืองมือพื้นฐาน หน่วยท่ี
3 การตกแต่งและตัดภาพ หน่วยที่ 4 การปรับรูปทรงภาพด้วยวิธี Transform หน่วยท่ี 5 การสร้าง
ข้อความตกแต่งภาพ หน่วยที่ 6 การทางานกับเลเยอร์ หน่วยที่ 7 เทคนิคการตกแต่งภาพในเลเยอร์
หน่วยที่ 8 การวาดภาพและรูปทรง หน่วยท่ี 9 ความรู้เรื่องสีและการใช้โหมดสี หน่วยท่ี 10 การ
ปรับแต่งภาพ หน่วยท่ี 11 ตกแต่งภาพด้วยการรีทัช และหน่วยท่ี 12 ตกแต่งภาพอย่างสร้างสรรค์
ดว้ ยฟลิ เตอร์

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

พัฒนส์ าริทธิ์ มณเี ขยี ว

สารบญั ข

เรอื่ ง หนา้
คำนำ ก
สำรบญั ข
หลักสตู รรำยวิชำ ค
หนว่ ยกำรเรียนรู้ ง
หน่วยกำรเรยี นรูแ้ ละสมรรถนะประจำหน่วย จ
แผนกำรจัดกำรเรียนรู้ หนว่ ยท่ี 1 เร่มิ ตน้ กบั Photoshop CS6 1
แผนกำรจดั กำรเรียนรู้ หน่วยที่ 2 หลกั กำรสรำ้ งงำนกรำฟิกและใช้เคร่อื งมอื พืน้ ฐำน 15
แผนกำรจดั กำรเรยี นรู้ หนว่ ยท่ี 3 กำรตกแต่งและตัดภำพ 31
แผนกำรจัดกำรเรยี นรู้ หนว่ ยท่ี 4 กำรปรบั รปู ทรงภำพด้วยวิธี Transform 44
แผนกำรจัดกำรเรยี นรู้ หน่วยที่ 5 กำรสร้ำงข้อควำมตกแต่งภำพ 54
แผนกำรจดั กำรเรยี นรู้ หนว่ ยท่ี 6 กำรทำงำนกับเลเยอร์ 66
แผนกำรจัดกำรเรยี นรู้ หนว่ ยที่ 7 เทคนิคกำรตกแตง่ ภำพในเลเยอร์ 84
แผนกำรจดั กำรเรยี นรู้ หนว่ ยที่ 8 กำรวำดภำพและรูปทรง 94
แผนกำรจดั กำรเรียนรู้ หนว่ ยที่ 9 ควำมรเู้ รื่องสีและกำรใช้โหมดสี 113
แผนกำรจัดกำรเรียนรู้ หนว่ ยท่ี 10 กำรปรบั แตง่ ภำพ 128
แผนกำรจดั กำรเรียนรู้ หน่วยท่ี 11 ตกแตง่ ภำพด้วยกำรรีทัช 145
แผนกำรจัดกำรเรยี นรู้ หน่วยที่ 12 ตกแตง่ ภำพอย่ำงสรำ้ งสรรคด์ ้วยฟิลเตอร์ 157
บรรณำนกุ รม 164

ค

หลักสูตรรายวชิ า

ชอื่ วิชา คอมพวิ เตอรก์ ราฟิกเบ้ืองต้น รหัสวชิ า 20901-1004
ทฤษฎี 1 ปฏบิ ตั ิ 2 หน่วยกติ 2

หลักสูตรประกาศนียบตั รวชิ าชพี หลกั สตู รประกาศนยี บตั รวิชาชพี ขัน้ สงู
ประเภทวชิ า เทคโนโลยสี ารสนเทศและการส่อื สาร สาขาวิชา เทคโนโลยสี ารสนเทศ

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

สมรรถนะรายวชิ า
1. แสดงความรแู้ ละหลักการของภาพกราฟิกแบบเวกเตอร์และบิตแมป
2. สร้างและตกแต่งภาพกราฟิก

คาอธบิ ายรายวิชา
ศึกษาและปฏิบัติเกี่ยวกับพื้นฐานของกราฟิก หลักการของภาพกราฟิกแบบเวกเตอร์และ

บิตแมป ประเภทและคุณลักษณะของแฟ้มภาพกราฟิก การสร้างและตกแต่งภาพกราฟิก การจัดการ
แฟ้มภาพกราฟิก การใชโ้ ปรแกรม สร้างภาพกราฟิกแบบเวกเตอรแ์ ละบติ แมป

หนว่ ยการเรยี นรู้ ง

หน่วยที่ ชอื่ หน่วย / หัวข้อย่อย จานวน สปั ดาหท์ ่ี
ชัว่ โมง
1 พื้นฐานโปรแกรม Photoshop CS6
2 หลักการสร้างงานกราฟิกและใชเ้ คร่อื งมือพน้ื ฐาน 31
3 การตกแต่งและตดั ภาพ 6 2–3
4 การปรบั รูปทรงภาพดว้ ยวธิ ี Transform 6 4–5
5 การสร้างข้อความตกแตง่ ภาพ 36
6 การทางานกับเลเยอร์ 37
38
สอบกลางภาคเรยี นท่ี 2/2563 39
7 เทคนิคการตกแต่งภาพในเลเยอร์ 6 10 – 11
8 การวาดภาพและรปู ทรง 6 12 – 13
9 ความรู้เร่อื งสีและการใชโ้ หมดสี 3 14
10 การปรบั แต่งภาพ 3 15
11 ตกแตง่ ภาพด้วยการรที ัช 3 16
12 ตกแตง่ ภาพอยา่ งสร้างสรรค์ด้วยฟลิ เตอร์ 3 17
3 18
สอบปลายภาคเรียนท่ี 2/2563 54
รวมทั้งหมด

หมายเหตุ

1. การกาหนดชว่ั โมงสอน ผู้สอนอาจยดึ หยุ่นไดต้ ามกความเหมาะสม
2. สอบทฤษฎแี ละปฏบิ ัตกิ ลางภาคเรียน สอบในสัปดาหท์ ี่ 9 จดั สอบโดยผ้สู อน
3. สอบปลายภาค 1 ชัว่ โมง สอบตามตารางสอบทวี่ ทิ ยาลยั ฯกาหนด ในสัปดาหท์ ่ี 18
4. การเรียงลาดับหน่วยการสอน ผู้สอนจะพิจารณาจากความยากง่าย ความต่อเนื่อง

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

หน่วยการเรยี นรู้และส

ชือ่ หน่วย ความรู้

หน่วยที่ 1 1.1 ความหมายของคอมพวิ เตอร์ 1. บอ
เรมิ่ ต้นกับ Photoshop CS6
กราฟิก กร

1.2 การเกิดภาพในคอมพิวเตอรก์ ราฟกิ 2. อธ

1.3 การประมวลผลภาพใน คอ

คอมพิวเตอร์กราฟกิ 3. อธ

1.4 ความสามารถโดยรวมของ คอ

โปรแกรม Photoshop 4. อธ

1.5 ส่วนตา่ ง ๆ บนหนา้ จอโปรแกรม โปร

Photoshop และการเรยี กใช้งาน 5. อธ

1.6 สร้างไฟล์ใหมแ่ ละบันทึกไฟลใ์ หม่ โปร

เบอื้ งตน้ เรีย

6. นา

สแ

7. สร้า

เบอื้

จ

สมรรถนะประจาหน่วย

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

ช่ือหน่วย ความรู้

หนว่ ยที่ 2 2.1 หลักการสรา้ งงานกราฟิก 1. อธ
หลักการสร้างงานกราฟิกและใช้
เคร่ืองมือพน้ื ฐาน 2.2 การเลอื กใชส้ ีโฟร์กราวด์และแบล็ค 2. สาม

กราวนด์ด้วยวธิ ีต่าง ๆ แล

2.3 การเลอื กใช้สีและระบายสีเบ้ืองต้น ได้

2.4 การลบภาพในส่วนทไ่ี ม่ต้องการ 3. สาม

ออกได้ เบื้อ

2.5 การตัด เปลีย่ นขนาด และเพ่ิม 4. สาม

ขนาดพ้นื ทีภ่ ายในภาพได้ ตอ้

2.6 การยอ่ ขยายภาพใหเ้ หมาะสมกับ 5. สาม

การตกแต่งภาพ ขน

6. สาม

กับ

ฉ

สมรรถนะ

ทักษะ คณุ ลักษณะท่พี ึงประสงค์

ธบิ ายหลักการสร้างงานกราฟิกได้ 1. ใฝเ่ รยี นรู้

มารถการเลอื กใชส้ ีโฟรก์ ราวด์ 2. ทางานเป็นระเบยี บเรียบร้อย

ละแบล็คกราวนดด์ ้วยวิธตี า่ ง ๆ 3. ผู้เรียนมีความรับผดิ ชอบตอ่ หน้าท่ี

4. ปฏิบตั งิ านด้านความซื่อสตั ย์สุจรติ

มารถการเลอื กใชส้ แี ละระบายสี 5. มีความมุง่ ม่นั ในการทางาน

องต้น 6. ใชเ้ วลาอย่างคมุ้ คา่

มารถลบภาพในส่วนทไ่ี ม่ 7. มีจติ สาธารณะ

องการออกได้

มารถตดั เปล่ียนขนาด และเพิ่ม

นาดพนื้ ทีภ่ ายในภาพได้

มารถย่อขยายภาพให้เหมาะสม

บการตกแตง่ ภาพ

ชือ่ หน่วย ความรู้

หนว่ ยท่ี 3 3.1 การเลอื กพ้ืนท่ีภาพในรปู ทรง 1. สาม
การตกแตง่ และตดั ภาพบางสว่ น
เรขาคณติ เรข

3.2 การเลอื กพน้ื ทแ่ี บบอิสระ 2. สาม

3.3 การเลือกเคร่ืองมือพื้นท่ีภาพได้ 3. สาม

เหมาะสมกับลกั ษณะของภาพ ได้

3.4 การปรบั ขอบเขตการเลอื กพืน้ ท่ีให้ 4. สาม

เปน็ รูปแบบใหมต่ ามที่ต้องการ พ้ืน

3.5 การใช้พน้ื ทท่ี เ่ี ลือกไว้ ตอ้

5. สาม

ช

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

ชือ่ หน่วย ความรู้
หน่วยที่ 4
การปรบั รูปทรงภาพด้วยวิธี 4.1 การปรับขนาดภาพดว้ ยวิธีการ 1. สาม
Transform
Scale Sca
หน่วยที่ 5
การสรา้ งข้อความตกแตง่ ภาพ 4.2 การหมุนภาพดว้ ยคาสัง่ Scale 2. สาม

4.3 การเอียงภาพดว้ ยคาสง่ั Skew Sca

4.4 การบดิ ภาพด้วยคาส่งั Distort 3. สาม

4.5 การบิดภาพให้มมี ิตดิ ว้ ย 4. สาม

Perspective 5. สาม

4.6 การดดั ภาพใหโ้ ค้งด้วยคาส่ัง Warp Pe

6. การ

5.1 ความแตกต่างระหว่างตัวอกั ษร 1. อธ
แบบเวกเตอร์และบิตแมพ ตวั
ได้
5.2 ตัวอักษรแบบ Point Type และ
Paragraph Type 2. สรา้
แล
5.3 การปรบั รูปแบบอกั ษรเพ่ือ
ประกอบชน้ิ งาน 3. สาม
ปร
5.4 การใชต้ วั อักษรภาษาไทยใน
Photoshop 4. สาม
Ph
5.5 การสร้างตวั อักษรแบบบิตแมพ

ซ

สมรรถนะ

ทกั ษะ คุณลกั ษณะทพ่ี ึงประสงค์

มารถปรบั ขนาดภาพดว้ ยวิธกี าร 1. ใฝเ่ รียนรู้

ale 2. ทางานเปน็ ระเบยี บเรยี บร้อย

มารถการหมุนภาพดว้ ยคาสั่ง 3. ผู้เรียนมคี วามรบั ผิดชอบต่อหนา้ ที่

ale 4. ปฏิบตั ิงานด้านความซอ่ื สตั ย์สจุ ริต

มารถเอียงภาพด้วยคาสัง่ Skew 5. มคี วามมงุ่ ม่นั ในการทางาน

มารถบิดภาพด้วยคาสัง่ Distort 6. ใช้เวลาอย่างคุ้มค่า

มารถบิดภาพใหม้ ีมิตดิ ว้ ย 7. มีจติ สาธารณะ

erspective

รดัดภาพให้โค้งด้วยคาสั่ง Warp

ธบิ ายความแตกตา่ งระหว่าง 1. ใฝเ่ รียนรู้

วอกั ษรแบบเวกเตอรแ์ ละบติ แมพ 2. ทางานเปน็ ระเบียบเรยี บร้อย

3. ผเู้ รยี นมีความรบั ผิดชอบต่อหน้าที่

างตวั อกั ษรแบบ Point Type 4. ปฏิบตั งิ านดา้ นความซื่อสตั ย์สจุ ริต

ละ Paragraph Type ได้ 5. มีความมงุ่ ม่ันในการทางาน

มารถปรบั รปู แบบตวั อกั ษรเพ่ือ 6. ใชเ้ วลาอย่างคุม้ คา่

ระกอบชิ้นงานได้ 7. มีจติ สาธารณะ

มารถใชต้ วั อักษรภาษาไทยใน

hotoshop ได้

ช่อื หน่วย ความรู้
5.6 การตกแต่งตัวอักษรด้วยพาเนล
5. สาม
Style และ Layer Style แม

6. สาม
เนบ

หนว่ ยที่ 6 6.1 การซ้อนภาพด้วยเลเยอร์ 1. สาม
ทางานกับเลเยอร์ 6.2 การจดั การกับเลเยอร์ในลักษณะ 2. สาม

ต่าง ๆ ลกั
6.3 การจดั หมวดหมู่ 3. สาม
6.4 การลงิ คใ์ หเ้ ลเยอร์ทางานร่วมกนั 4. สาม
6.5 การรวมเลเยอร์
ร่วม
5. สาม

สมรรถนะ ฌ
ทักษะ คุณลักษณะท่พี ึงประสงค์
มารถสร้างตัวอักษรแบบบติ
มพได้
มารถตกแต่งตัวอกั ษรด้วยพา
บ Style และ Layer Style

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

ช่ือหน่วย ความรู้
หนว่ ยท่ี 7 7.1 การตกแตง่ ภาพในเลเยอรด์ ว้ ย 1. สาม
เทคนิคการตกแต่งภาพในเลเยอร์ Layer La
7.2 การเจาะภาพให้โปร่งใสดว้ ย Layer 2. สาม
หนว่ ยท่ี 8
การวาดภาพและรปู ทรง Mask La
7.3 การเลม็ ส่วนเกินของภาพออกดว้ ย 3. สาม

Clipping Mask ด้ว
7.4 การตกแตง่ ภาพดว้ ย Fill Layer 4. การ
แล
และ Adjustment Layer
7.5 การผสมสโี ดยการใช้ Layer
Blending mode 5. เข้า

Ble
6. แส
เดยี
8.1 การวาดภาพด้วยรปู ทรงสาเรจ็ รปู 1. สาม
8.2 การวาดรปู ทรงอิสระ สา
8.3 การใช้คาส่ังจดั การกบั
2. สาม
สว่ นประกอบของพาธ 3. สาม

ส่ว

ญ

สมรรถนะ คุณลกั ษณะท่ีพึงประสงค์
1. ใฝ่เรียนรู้
ทักษะ 2. ทางานเป็นระเบยี บเรยี บร้อย
มารถตกแต่งภาพในเลเยอรด์ ้วย 3. ผเู้ รียนมคี วามรับผดิ ชอบตอ่ หนา้ ท่ี
ayer ได้ 4. ปฏบิ ัติงานด้านความซอื่ สตั ย์สุจรติ
มารถเจาะภาพใหโ้ ปร่งใสดว้ ย 5. มีความมุ่งม่นั ในการทางาน
ayer Mask ได้ 6. ใชเ้ วลาอยา่ งคุ้มค่า
มารถเล็มส่วนเกนิ ของภาพออก 7. มีจิตสาธารณะ
วย Clipping Mask
รตกแต่งภาพด้วย Fill Layer 1. ใฝ่เรียนรู้
ละ Adjustment Layer 2. ทางานเปน็ ระเบยี บเรียบร้อย
าใจการผสมสีโดยการใช้ Layer 3. ผู้เรียนมีความรบั ผิดชอบตอ่ หน้าที่
ending mode 4. ปฏบิ ัตงิ านด้านความซื่อสตั ย์สจุ รติ
สดงงานหลายรปู แบบในไฟล์ 5. มีความมุง่ มั่นในการทางาน
ยวโดยใช้ Layer Comp ได้ 6. ใชเ้ วลาอย่างคุ้มคา่
มารถวาดภาพดว้ ยรูปทรง 7. มจี ติ สาธารณะ
าเร็จรปู ได้
มารถวาดรูปทรงอสิ ระได้
มารถใชค้ าส่ังจัดการกับ
วนประกอบของภาพได้

ช่ือหน่วย ความรู้ 1. อธ
9.1 ลักษณะโมเดลสีแบบต่าง ๆ ได้
หน่วยท่ี 9 9.2 โหมดสีใน Photoshop
ความรูเ้ รื่องสีและการใชโ้ หมดสี 9.3 การเปล่ยี นโหมดสขี องภาพ 2. อธ
3. สาม

หน่วยท่ี 10 10.1 การปรับแตง่ ภาพแบบอตั โนมตั ิ 1. สา
การปรับแตง่ ภาพ 10.2 การปรบั แต่งความมืดสวา่ ง อตั

ใหก้ บั ภาพ 2. สา
10.3 การปรับแตง่ สีให้กับภาพ
10.4 การปรบั แตง่ ภาพดว้ ยเทคนิค
พเิ ศษ ใหก้
3. สา
10.5 การปรับแต่งภาพด้วยแสงเงาได้
10.6 ปรับแต่งภาพดว้ ยการแทนสี 4. สา
และปรับสีใหเ้ ขา้ กนั
พเิ ศ

5. สา

ได้

6. ปร

ปร

ฎ

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

รับแตง่ ภาพด้วยการแทนสแี ละ
รับสีใหเ้ ขา้ กัน

ชื่อหน่วย ความรู้ 1. สา
11.1 ปรับแต่งความคมชดั ของภาพ ภา
หน่วยที่ 11
ตกแต่งภาพดว้ ยการรที ัช ตามความต้องการ 2. สา
11.2 ปรับโทนสีของภาพให้สวยงาม สวย
11.3 สร้างลวดลายให้ภาพ
11.4 เลอื กใช้เคร่อื งมือรที ัชให้ 3. สา
4. สา
เหมาะสมกบั ภาพ
11.5 ใชเ้ ทคนิครที ัชเพอ่ื แก้ไขสว่ นที่ เหม
5. สา
เป็นตาหนใิ นภาพ
11.6 ทาสาเนาภาพเพอื่ ใชใ้ นการ สว่ น
6. สา
ตกแตง่ ภาพ
11.7 อธบิ ายการแกไ้ ขภาพ การ
7. อธ

ฏ

สมรรถนะ คณุ ลักษณะท่พี ึงประสงค์

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

ชอื่ หน่วย ความรู้ 1. อธ
12.1 คณุ สมบัติและความสาคัญของ ขอ
หนว่ ยที่ 12
ตกแตง่ ภาพดว้ ยฟิลเตอร์ ฟิลเตอร์ 2.อธิบ
12.2 การใช้งานฟลิ เตอร์ชนิดต่าง ๆ ๆไ
12.3 กฎการใช้เงานฟิลเตอร์
12.4 การใช้ฟิลเตอรใ์ นการตกแตง่ 3. อธ
4. สา
ภาพให้สวยงาม
12.5 การใช้ Liquify มาใช่วยในการ ภา
5. สา
ปรบั สัดส่วนของภาพได้
การ

ฐ

สมรรถนะ

ทกั ษะ คณุ ลักษณะท่พี ึงประสงค์

ธบิ ายคณุ สมบัติและความสาคญั 1. ใฝ่เรยี นรู้

องฟลิ เตอร์ได้ 2. ทางานเปน็ ระเบยี บเรียบร้อย

บายการใชง้ านฟิลเตอรช์ นดิ ตา่ ง 3. ผเู้ รยี นมคี วามรับผดิ ชอบตอ่ หน้าท่ี

ได้ 4. ปฏิบตั งิ านดา้ นความซื่อสตั ย์สุจรติ

ธิบายกฎการใชเงานฟลิ เตอร์ได้ 5. มคี วามม่งุ ม่นั ในการทางาน

ามารถใชฟ้ ลิ เตอรใ์ นการตกแต่ง 6. ใช้เวลาอยา่ งคมุ้ คา่

าพให้สวยงามได้ 7. มีจิตสาธารณะ

ามารถใช้ Liquify มาใช่วยใน

รปรบั สัดสว่ นของภาพได้

แผนการจัดการเรยี นรู้มงุ่ เนน้ สมรรถนะ ๑
ชอื่ หน่วย เร่มิ ต้นกับ Photoshop CS6
หน่วยที่ 1
สัปดาหท์ ่ี 1
จานวน 3 ชัว่ โมง

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

1. สาระสาคญั
ภาพกราฟิก เป็นสว่ นประกอบสาคัญทีเ่ ราต่างได้พบเห็นอยใู่ นรูปแบบของแผ่นโฆษณา งานพ

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

2. สมรรถนะประจาหน่วย
2.1 ความหมายของคอมพวิ เตอร์กราฟิก
2.2 การเกดิ ภาพในคอมพวิ เตอร์กราฟกิ
2.3 การประมวลผลภาพในคอมพิวเตอรก์ ราฟิก
2.4 ความสามารถโดยรวมของโปรแกรม Photoshop
2.5 ส่วนตา่ ง ๆ บนหนา้ จอโปรแกรม Photoshop และการเรยี กใชง้ าน
2.6 สร้างไฟลใ์ หมแ่ ละบันทึกไฟลใ์ หม่เบอื้ งต้น

3. จดุ ประสงค์การเรียนรู้
3.1 ด้านความรู้
3.1.1 ผูเ้ รียนบอกความหมายของคอมพวิ เตอร์กราฟกิ
3.1.2 ผเู้ รียนอธิบายการเกิดภาพในคอมพวิ เตอร์กราฟิก
3.1.3 ผู้เรยี นอธบิ ายการประมวลผลภาพในคอมพิวเตอรก์ ราฟกิ
3.1.4 ผเู้ รียนบอกความสามารถโดยรวมของโปรแกรม Photoshop
3.1.5 ผเู้ รียนบอกสว่ นต่าง ๆ บนหน้าจอโปรแกรม Photoshop และการเรยี กใช้
งาน
3.1.6 ผูเ้ รยี นสร้างไฟล์ใหมแ่ ละบันทึกไฟลใ์ หม่เบื้องต้น
3.2 ด้านทักษะ
3.2.1 บอกความหมายของคอมพวิ เตอร์กราฟิกได้
3.2.2 อธบิ ายการเกดิ ภาพในคอมพวิ เตอร์กราฟิกได้
3.2.3 อธบิ ายการประมวลผลภาพในคอมพิวเตอร์กราฟกิ ได้
3.2.4 อธบิ ายความสามารถโดยรวมของโปรแกรม Photoshop ได้
3.2.5 อธิบายสว่ นตา่ ง ๆ บนหนา้ จอโปรแกรม Photoshop และการเรียกใช้งานได้

๒

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

แผนการจัดการเรยี นรู้มุง่ เน้นสมรรถนะ ๓
ชอ่ื หน่วย เรม่ิ ตน้ กับ Photoshop CS6
หนว่ ยที่ 1
สัปดาห์ที่ 1
จานวน 3 ชว่ั โมง

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

4. เนื้อหาสาระการเรียนรู้
1.1 ความสาคญั ของภาพกราฟิก

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

รปู ท่ี 1.1 ภาพกราฟิก

กราฟกิ ในยคุ แรก
การสร้างภาพกราฟิกในยุคแรกนั้น จะเริม่ ต้นจากการวาดการระบายสี ในหลายสิบปกี ่อน จะ

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

รปู ที่ 1.2 ภาพกราฟกิ ในยุคแรก

กราฟิกในยคุ ดจิ ติ อล
ในอดีตคอมพิวเตอร์และเคร่ืองพิมพ์ จะทางานเฉพาะด้านข้อความเท่าน้ัน แต่ปัจจุบันจะ

สามารถใช้คอมพิวเตอร์ และเครื่องพิมพ์ทางานด้านกราฟิกได้ด้วย โดยเราสามารถแก้ไขภาพกราฟิก
ในคอมพวิ เตอร์ ส่งออกภาพกราฟิก

๔

รูปท่ี 1.3 ภาพกราฟิกในยคุ ดิจติ อล
1.2. การเกิดภาพบนคอมพิวเตอร์

ภาพโดยทั่วไป แบ่งได้เป็น 2 ประเภท คือ Physical Image คือ ภาพที่เราเห็นอยู่ทั่ว ๆ ไป
เช่น ภาพถ่าย ส่วนภาพอีกประเภทก็คือ Digital Image หรือ Computer Graphic คือ ภาพท่ีใช้ใน
การประมวลผล

รูปท่ี 1.4 การเกิดภาพบนคอมพิวเตอร์
ภาพทีป่ รากฏบนหนา้ จอคอมพิวเตอร์ ทีเ่ ราเห็นอยู่ทวั่ ไปนั้น เกิดจากจุดสี่เหล่ียมเล็ก ๆ ของสี
ที่เราเรียกว่า พิกเซล (pixel) พิกเซลเป็นองค์ประกอบ ที่เล็กที่สุดของภาพ มาประกอบกันเป็นภาพ
ขนาดต่าง ๆ ดงั นี้

รูปท่ี 1.5 ความละเอยี ดของภาพ
คอมพิวเตอร์ประมวลผลภาพ

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

1. การประมวลผลแบบเวกเตอร์ (Vector)

๕

เป็นการประมวลผลแบบอาศัยการคานวณทางคณติ ศาสตร์ โดยมสี ีและตาแหน่งของ
สีท่ีแน่นอน ฉะน้ันไม่ว่าเราจะมีการเคล่ือนย้ายท่ีหรือย่อขยายขนาดของภาพ ภาพจะไม่เสีย
รูปทรงในเชิงเรขาคณิต ตัวอย่างเช่น รูปการ์ตูน โปรแกรม โปรแกรมท่ีประมวลผลภาพแบบ
เวกเตอร์ ไดแ้ ก่ Iluustrator และ CorelDraw เป็นตน้
2. การเก็บรายละเอยี ดแสดงผลแบบบิตแมพ (Bitmap)

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

รูปที่ 1.6 ภาพเปรียบเทียบการแสดงผลแบบเวกเตอร์ และบิตแมพ

1.3. สว่ นต่าง ๆ บนหนา้ จอโปรแกรม Photoshop
ความสามารถโดยรวมของ Photoshop

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

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

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

เมื่อเร่ิมต้นใช้งานโปรแกรม หน้าจอแรกที่พบจะประกอบด้วยส่วนประกอบต่าง ๆ ซ่ึงหน้าท่ี
การใชง้ านทแ่ี ตกต่างกนั ออกไป เราจึงต้องทาความเขา้ ใจกับส่วนประกอบต่าง ๆ ของหนา้ จอท่ีปรากฏ
คร่าว ๆ ดังตอ่ ไปนี้ คือ

๖

แถบกำหนดรปู แบบของเครอ่ื งมือใช้งำน (Tool options bar)
แถบเมนูคำสั่ง (Menu bar)

กลอ่ งเครื่องมอื (Toolbox) พ้นื ท่ีกำรทำงำน พำเนล (Panal) ที่รวบรวมคุณสมบตั ิ

(Document window) กำรทำงำนต่ำง ๆ อยู่ในกรอบทีจ่ ดั เกบ็

1.5 แถบเมนูคาส่ัง (Menu bar)

เป็นแถบเมนูที่ใช้เก็บคาสั่งหลักๆ ของโปรแกรม เราสามารถคลิกเมาส์เรียกใช้คาสั่งในแถบ

คาสั่งได้ โดยหากคาสัง่ ไหนมีรูปลูกศรอยู่ด้วย แสดงวา่ เม่ือเราเรียกใช้คาส่งั น้นั จะมคี าส่งั ย่อยเพมิ่ ข้ึนมา

อีก ดงั น้ี

คาสง่ั ในแถบเมนูมที งั้ หมด 11 กลมุ่ ดังตอ่ ไปน้คี ือ

File ๗
Edit
ทางานเก่ยี วกับไฟล์ภาพ เช่น การเปดิ ไฟล์ (Open) และปดิ ไฟล์ (Close)
Image ปรบั แตง่ ภาพในรูปแบบตา่ ง ๆ เชน่ การคดั ลอก (Copy) เตมิ สี (Fill) รวมไป
ถึงการกาหนดคุณสมบัติที่มีผลต่อการปรับแต่งภาพ เช่น กาหนดลักษณะ
Layer พูก่ นั (Define Brush) การกาหนดคา่ สี Color Settings
Type ปรับแต่งทม่ี ีผลต่อภาพทั้งภาพ เช่น การปรบั ขนาดภาพ และการปรับโหมด
Select สี
Filter ปรับแตง่ ภาพในแตล่ ะเลเยอร์ และสรา้ งความสมั พันธร์ ะหวา่ งเลเยอร์
ปรบั แตง่ ขอ้ ความ แปลงขอ้ ความ
View จัดการกับพืน้ ท่ีภาพที่เลอื กไว้ มกั ใชร้ ่วมกับเครอื่ งมือ
Window ปรับแต่งภาพอัตโนมัติด้วยคาส่ังสาเร็จรูป เช่น การทาภาพเบลอ หรือสร้าง
ภาพสีน้า
Help กาหนดมุมมองการแสดงภาพในรปู แบบตา่ ง ๆ เช่น การขยายดูภาพใกล้ ๆ
จัดการหน้าต่างแต่ละหน้าต่างท่ีปรากฏบนหน้าจอของโปรแกรม เพื่อนช่วย
ให้ทางานได้สะดวกข้นึ
รวบรวมวธิ ีการใชง้ านและคาแนะนาเก่ียวกบั โปรแกรม Photoshop CS6

1.6 กลอ่ งเครอ่ื งมือ (Toolbox)
เป็นสว่ นทเ่ี ก็บรวบรวมเครอ่ื งมือท่ใี ชใ้ นการสร้าง การปรับแตง่ และการแก้ไขภาพ ซง่ึ มีไอคอน

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

กลมุ่ คำสัง่ Selection เกี่ยวกับกำรเลือก ๘
พนื้ ทีใ่ นส่วนของภำพท่ีต้องกำรจะตกแต่ง
กล่มุ คำส่งั สำหรับตดั ภำพเฉพำะ
กลุ่มคำส่ังเกย่ี วกบั กำรตกแต่งภำพ ส่วนที่ต้องกำรและแบ่งภำพ
ออกเป็นส่วนยอ่ ย ๆ

กลุ่มคำสงั่ เกี่ยวกบั กำรระบำยสภี ำพ

กลมุ่ คำสง่ั พเิ ศษเกี่ยวกับกำรวำด
ภำพ และสร้ำงตัวอักษร

กล่มุ คำสง่ั ในกำรเลือกสี Foreground กลุ่มคำสั่ง View เกี่ยวกับกำรมองภำพ
(สีทีป่ รำกฏเมื่อเตมิ หรือวำดลงไปและสี
Background (สที ่ีปรำกฏเม่ือทำกำรลบ กลุ่มคำสัง่ Quick mask เกี่ยวกับกำร
หรือตัดบรเิ วณนั้นออก) เลอื กพ้ืนที่รูปแบบหนึง่

1.7 แถบกาหนดรูปแบบของเครอ่ื งมือ (Tool options bar)
ออปชนั่ บาร์ (options bar) คอื แถบตัวเลอื กสาหรบั กาหนดค่าการทางานของเครื่องมือที่เรา

กาลงั ใช้งานอยู่ โดยเมื่อเราคลิกเมาส์ทีเ่ คร่ืองมือในกล่องเครื่องมือท่ีแถบน้กี จ็ ะแสดงตวั เลือกให้เรียกใช้
งาน เพื่อช่วยใหก้ ารทางานสะดวกยิง่ ขึน้
1.8 พ้ืนทก่ี ารทางาน (Document window)

๙

พ้ืนทีก่ ารทางานเป็นบรเิ วณทเ่ี ราใชแ้ สดงภาพ และตกแตง่ ภาพ ซ่งึ สามารถแสดงอยใู่ นรปู แบบ
แท็บซ่อนกนั หรือรปู แบบหนา้ ต่างซอ้ นกนั ก็ได้ แต่ผู้ใช้งานจะถนดั แบบไหน
1.9 พาเนลควบคมุ การทางาน (Panel)

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

เราสามารถเปิด/ปิดพาเนลได้จากคาส่ัง Window แล้วเลือกชื่อพาเนลท่ีเราต้องการแสดง
หรือไม่แสดงและจะเห็นว่าถ้าพาเนลไหนถูกเปิดอยู่ จะมีเคร่ืองหมายหน้าช่ือพาเนลน้ัน พาเนลที่ถูก
เปิดอยู่ในกรอบท่ีจัดเก็บพาเนล (dock)แต่ละพาเนลจะมีเมนูคาสั่งของตัวเองเพื่อควบคุมการทางาน
สามารถเรียกดูเมนูในแต่ละพาเนลได้โดยคลกิ ท่ี และคลิกเลือกคาส่ังทตี่ อ้ งการ
การยุบพาเนลเปน็ ไอคอน

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

เราสามารถเคล่ือนย้ายเพื่อเปลี่ยนตาแหน่งของกลุ่มพาเนล และพาเนลภายในกรอบจัดเก็บ
(dock) โดยการเลื่อนตาแหน่งข้ึน/ลง หรือนาพาเนลเข้า/ออกจากกรอบจัดเก็บได้ จากการคลิกเมาส์
แล้วลากบริเวณแถบหัวข้อ (title bar) เพื่อย้ายตาแหน่งท้ังกลุ่มพาเนล หรือคลิกท่ีแต่ละเเท็บ (tab)
ของพาเนลเพื่อยา้ ยเฉพาะพาเนลท่ีต้องการ
1.10 นาเขา้ ไฟล์จากกลอ้ งดจิ ติ อลและสแกนเนอร์
นาภาพจากกลอ้ งดจิ ิตอลลงคอมพิวเตอร์

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

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

๑๐

1.12 การสรา้ งไฟล์ภาพด้วยคาสงั่ New
ขน้ั ตอนการสรา้ งไฟลภ์ าพเปลา่ และนาภาพมาตกแต่งภายหลงั มีขัน้ ตอนดงั น้ี
1. เลอื กเมนูคาสง่ั File ->New

2. พมิ พช์ ่อื ไฟล์ 4. คลกิ เมำส์ตกลงเพื่อสร้ำงไฟล์ใหม่

3. กำหนดรำยละเอยี ดของไฟล์ที่

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

หรือไฟล์ภาพในเคร่อื ง ซ่ึงมขี ั้นตอนดังนี้
1. เลอื กเมนคู าส่ัง File -> Open

๑๑

2. เลือกไฟล์ภำพที่
ต้องกำร

3. คลิกเมำส์เพ่ือเปิด
ไฟล์ภำพ

แผนการจดั การเรียนรู้ม่งุ เน้นสมรรถนะ ๑๒
ช่อื หน่วย เรม่ิ ตน้ กับ Photoshop CS6
หนว่ ยท่ี 1
สัปดาหท์ ี่ 1
จานวน 3 ช่ัวโมง

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

5.กจิ กรรมการเรียนการสอน
5.1 การนาเขา้ สบู่ ทเรียน
5.1.1ครู เชค็ ชอื่ และตรวจการแต่งกาย
นกั เรียน ขานชือ่ และลุกข้ึนให้ครตู รวจการแตง่ กายทีละคน
5.1.2ครู ทบทวนกอ่ นเรยี นโดยการซักถามเก่ยี วกบั การใช้งานโปรแกรม
Photoshop
นักเรียน ตอบคาถาม ซักถามข้อสงสัย
5.2 การเรียนรู้
5.2.1ครู อธบิ ายถึงการเร่มิ ต้นใช้งานโปรแกรม Photoshop CS6 และการ
ใชง้ านโปรแกรมโดยสือ่ PowerPoint ตอบคาถาม/ซักภามข้อ
สงสัย
นกั เรียน จดบันทกึ ตอบคาถาม ปรึกษา/อภิปรายกบั เพ่อื น
5.2.2ครู ทดสอบผเู้ รยี นโดยการถามตอบกันภายในห้องเรยี น และอธิบาย
บางในข้อทผี่ ูเ้ รียนมีข้อสงสยั จดบันทกึ ย่อ
นักเรยี น รว่ มกนั อภปิ รายหาข้อสรปุ
5.2.3ครู ให้นักเรียนทาแบบทดสอบเร่ืองการเริ่มต้นใชง้ านโปรแกรม
Photoshop CS6 เพ่ือเก็บคะแนน
นกั เรียน ทาแบบทดสอบ
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 วิชา การสร้างเวบ็ ไซต์ หนว่ ยที่ 1 เรื่อง พน้ื ฐานโปรแกรม Photoshop
CS6

7. เอกสารประกอบการจัดการเรียนรู้ (ใบความรู้ ใบงาน ใบมอบหมายงาน ฯลฯ)
7.1 ใบความรู้ประกอบการเรียนวิชา โปรแกรมกราฟิก หนว่ ยท่ี 1 เร่ือง เร่ิมต้นการใช้งาน
โปรแกรม Photoshop CS6
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 แนวทางการพัฒนาคุณภาพการเรียนรู้
............................................................................................................................. ...................................
................................................................................................ ................................................................
............................................................................................................................. ...................................
.................................................................................................................................. ..............................
............................................................................................................................. ...................................
............................................................................................................................. ...................................

๑๕

แผนการจัดการเรยี นรู้มุ่งเนน้ สมรรถนะ หนว่ ยท่ี 2

สปั ดาหท์ ่ี 2 - 3

ช่อื หน่วย หลกั การสร้างงานกราฟิกและใช้เคร่ืองมือพ้ืนฐาน จานวน 6 ชั่วโมง

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

1. สาระสาคญั
ในบทน้ีจะกล่าวถึงแนวคิดในการสร้างงานกราฟิกว่าต้องกาหนดวัตถุประสงค์ กาหนด

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

2. สมรรถนะประจาหน่วย
2.1 แนวคิดในการสร้างงานกราฟิก
2.2 หลกั การสร้างงานกราฟิก
2.3 การทางานกับสี
2.4 เลอื กใชส้ แี ละระบายสเี บอ้ื งต้น
2.5 การเทสแี บบไล่เฉดสี
2.6 การระบายสดี ว้ ยพ่กู นั และดนิ สอ
2.7 ลบส่วนประกอบในภาพทไี่ ม่ต้องการ
2.8 การใส่ขอ้ ความข้นั ต้น
2.10 การเปล่ียนขนาดของภาพ
2.11 การเพ่ิมพนื้ ท่ีของรูปภาพ
2.12 การปรบั ยอ่ ขยายมมุ มองของรปู ภาพ

3. จุดประสงคก์ ารเรยี นรู้
3.1 ดา้ นความรู้
3.1.1 หลักการสร้างงานกราฟิก
3.1.2 การเลอื กใช้สีโฟรก์ ราวดแ์ ละแบล็คกราวนดด์ ้วยวิธีตา่ ง ๆ
3.1.3 การเลือกใชส้ แี ละระบายสเี บอ้ื งตน้
3.1.4 การลบภาพในส่วนท่ไี ม่ต้องการออกได้
3.1.5 การตดั เปลย่ี นขนาด และเพิ่มขนาดพนื้ ท่ภี ายในภาพได้
3.1.6 การย่อขยายภาพให้เหมาะสมกบั การตกแต่งภาพ
3.2 ด้านทักษะ
3.2.1 อธบิ ายหลกั การสรา้ งงานกราฟิกได้
3.2.2 สามารถการเลือกใชส้ ีโฟร์กราวด์และแบลค็ กราวนด์ด้วยวิธีตา่ ง ๆ ได้
3.2.3 สามารถการเลอื กใชส้ ีและระบายสีเบ้ืองต้น

๑๖

3.2.4 สามารถลบภาพในสว่ นท่ไี มต่ ้องการออกได้
3.2.5 สามารถตดั เปล่ยี นขนาด และเพ่ิมขนาดพ้นื ทีภ่ ายในภาพได้
3.2.6 สามารถยอ่ ขยายภาพให้เหมาะสมกับการตกแต่งภาพ
3.3 คณุ ลกั ษณะที่พงึ ประสงค์
3.3.1 ใฝ่เรียนรู้
3.3.2 ทางานเปน็ ระเบยี บเรียบรอ้ ย
3.3.3 ผเู้ รยี นมีความรบั ผิดชอบตอ่ หนา้ ท่ี
3.3.4 ปฏบิ ตั ิงานด้านความซ่ือสัตย์สจุ ริต
3.3.5 มีความม่งุ มั่นในการทางาน
3.3.6 ใช้เวลาอย่างคมุ้ ค่า
3.3.7 มีจติ สาธารณะ

๑๗

แผนการจัดการเรียนรู้มงุ่ เนน้ สมรรถนะ หน่วยท่ี 2

สปั ดาหท์ ่ี 2 - 3

ช่อื หน่วย หลกั การสรา้ งงานกราฟิกและใชเ้ ครื่องมือพน้ื ฐาน จานวน 6 ช่วั โมง

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

4. เนอื้ หาสาระการเรยี นรู้
2.1 แนวคิดในการสรา้ งงานกราฟิก

การออกแบบงานกราฟิกท่ีดีจะช่วยในการนาเสนอสินค้าและโฆษณาโดยมีมูลค่า สวยงาม ตรง
กล่มุ เป้าหมายและช่วยดึงดดู ความสนใจของคนทั่วไป

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

ขัน้ ตอนที่ 1 วเิ คราะห์/ประเมนิ ผลสินคา้
ข้นั ตอนที่ 2 รา่ งแบบภาพครา่ วๆ
ขน้ั ตอนที่ 3 หาภาพที่จะใช้
ขั้นตอนที่ 4 ลงมอื สร้างแผ่นโฆษณา
ขนั้ ตอนที่ 1 การวิเคราะห์ และการประเมินผลชิน้ งาน
1.วัตถุประสงค์

1.1 เพอื่ สรา้ งงานโฆษณาประชาสัมพนั ธส์ นิ ค้าใหม่ลงในนิตยสารขนาด 18.5x26
ซม.

1.2 เพ่ือใหส้ ินค้าเปน็ ท่ีรู้จัดในกล่มุ เป้าหมาย
2 การวเิ คราะหส์ นิ คา้

เช่นศึกษาถึงข้อดี ข้อเสยี ของสินคา้ ว่ามีประโยชน์ หรอื โทษอย่างไรบ้าง
3 การวเิ คราะหก์ ลุ่มเป้าหมาย

เช่น กลุ่มเป้าหมายของอยู่ในช่วงอายุเท่าใด รสนิยมเป็นอย่างไร และมีความต้องการ
สินคา้ อย่างไร ประเภทไหน
4 ประเมนิ ผลการวเิ คราะห์

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

๑๘

ขัน้ ตอนน้ีจะแสดงเคร่อื งมือ หรือคาสงั่ ตา่ ง ๆ ในโปรแกรม Photoshop ทีใ่ ช้ในการตกแตง่ งาน
โฆษณาทีต่ ้องการ ให้สวยงามและมคี วามน่าสนใจ
2.2 หลักการสร้างงานกราฟิก

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

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

2.3 การทางานกับสี

เลอื กใชส้ ีโฟร์กราวนดแ์ ละแบ็คกราวนด์ด้วยวธิ ีต่างๆ

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

สีโฟร์กราวนด(์ Foreground) และสแี บลค็ กราวนด์(Background)

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

๑๙

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

2.4 เลือกใช้สแี ละระบายสเี บอ้ื งตน้
1. การเทสดี ว้ ยถังสี

คาส่ัง Paint Bucket Tool ให้เราเติมสีภาพในบริเวณติดกัน และมีค่าสีใกล้กันเคียงกัน กับ
บริเวณท่ีเรา Click mouse คาส่ัง Paint Bucket Tool ไม่สามารถใช้กับภาพใช้กับภาพใน Bitmap
Mode ได้ เราสามารถเติมสีด้วย Paint Bucket Tool ได้ดังน้ี

1. Selection เลือกพืน้ ทภ่ี าพที่เราต้องการเติมสี
2. Click mouse ทไ่ี อคอน
3. Click mouse ท่ี Foreground Color เพื่อเลือกสีทจี่ ะเติม
4. ปรับค่าสที จ่ี ะเตมิ ในภาพด้วย Tool Options bar โดยมรี ายละเอียดต่าง ๆ Fill เลือกสที ่ใี ช้
เตมิ ได้แก่
Foreground ใชส้ เี ดยี วกับ Foreground color
Pattern เตมิ ภาพดว้ ยลวดลาย
Mode กาหนดโหนดพเิ ศษของสี
Opacity กาหนดคา่ ความโปร่งแสงสี
Telerance จากัดขอบเขตในการระบายสี
Anit-aliased กาหนดให้ขอบของพน้ื ที่ภาพท่เี ทสีลงไปมคี วามเรียบยิ่งขึน้
Contiquous จะทาการเทสีตรงบริเวณพกิ เซลทีเ่ รา Click mouse เทา่ นนั้
3.การไล่โทนสภี าพโดยการใช้คาสั่ง Gradient Tool
การใช้งานคาสัง่ Gradient Tool

1. เลอื กพ้ืนท่ีที่ตอ้ งการเทสีภาพ ในท่นี ี้คอื พ้ืนท่ีทเ่ี ปน็ เสน้ ประสเ่ี หลีย่ ม
2. Click mouse ท่ไี อคอน Gradient Tool
3. Click mouse เลอื กรูปแบบไล่โทนสที ่ี Tool Options bar
4. Drag mouse จากจุดเร่มิ ตน้ ไปยังจดุ ปลาย ตามตาแหน่งทตี่ อ้ งการ แล้วปลอ่ ย
เมาส์
- จุดท่ีเริ่มกดเมาส์ ถือว่าเป็นจุดเรม่ิ ต้น
- จุดทีป่ ล่อยเมาส์ ถือว่าเปน็ จุดปลาย
2.5 การเทสีแบบไลเ่ ฉดสี
โดยปกติเมอ่ื เราสร้างงานดว้ ยโปรแกรม Adobe Photoshop เรามกั จะใชส้ พี นื้ ในการ
ออกแบบ แต่สาหรบั งานออกแบบทีต่ ้องการความแตกต่าง ลองเปลีย่ นมาใช้สีพนื้ หลังแบบไล่ระดับสี ก็
จะได้งานทสี่ วยงาม และโดดเด่นไปอีกแบบ สาหรบั ข้ันตอนการสร้างพื้นหลังแบบไลร่ ะดบั สมี ีดังตอ่ ไปน้ี

1. เปดิ หรือสร้างงานใหม่

๒๐

2. คลิกเครือ่ งมือ Gradient Tool
3. สังเกตท่ี Foreground และ Background color เป็นสขี าว และสีชมพู ตามลาดับ คุณสามารถ
เปลยี่ นสีตามความต้องการ
4. จากนน้ั นาเมาสไ์ ปคลิกเมาสค์ า้ ง แล้วลากตามตวั อย่างด้านล่าง (หากต้องการลายเฉยี ง ๆ กค็ ลิกเมาส์
ค้าแล้วลากเฉยี ง)

๒๑

5. เมอ่ื ปล่อยเมาส์จะได้พื้นหลงั แบบไลร่ ะดับสีเรยี บร้อยแล้ว

2.6 การระบายสีดว้ ยพู่กันและดินสอ
Painting Tool เปน็ กลุ่มเครอื งมอื ท่ีใชส้ าหรับวาดเส้น และระบายสมี อี ยู่ 3 ชนดิ คือ Pencil

Tool , Paint Brush Toolและ Airbrush Tool ซ่ึงจะใหล้ ักษณะของเสน้ ท่ีแตกต่างกัน
พกู่ ัน (Paint Brush Tool)และ ดนิ สอ (Pencil Tool) เปน็ เครอ่ื งมือระบายสี และวาดใส่

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

1. คลิกเลอื ก Paint Brush Tool หรือ Pencil Tool
2. กาหนดคณุ สมบตั ิของเครื่องมือเพ่ิมเติม

Opacity กาหนดคา่ ความโปรง่ แสงของสที ี่ระบายลงไป
Mode กาหนดโหมดในการผสมสีระหว่างสีทีร่ ะบายลงไปกับสขี องภาพเดมิ
Brush กาหนดลักษณะของหัวแปรง

๒๒

Scale กาหนดขนาดของหวั แปรง
Brush Dynamics ต้งั คา่ เพ่ิมเติม เช่น แรงกด (Pressure) ความไว(Velocity) หรือตั้ง
แบบสมุ่ (Random) เหมาะกับการใช้กับเคร่ือง Tablet
Fade out กาหนดลกั ษณะเส้นใหค้ ่อยๆ จางหายไป สามารถกาหนดระยะ Length
เป็นความยาวของเสน้ ทีค่ ่อยๆ จางหายไป
Apply Jitter กาหนดความถ่ี/หา่ งของหวั แปรงเม่ือลากเส้นต่อเนื่อง
Incremental กาหนดลักษณะเส้นโดยใช้สพี ้ืนแบบสเี ดียว หรอื ตามลกั ษณะหวั แปรงท่ี
กาหนด
Use color from gradient กาหนดสีเสน้ เปน็ แบบการไล่เฉดสี (Gradient)
3. คลิกระบายสีบนภาพ
2.7 ลบสว่ นประกอบในภาพท่ไี มต่ อ้ งการ
Eraser Tool ลบพ้ืนที่ของภาพในสว่ นทไ่ี ม่ต้องการออก โดยแทนทดี่ ้วยสแี บ็คกราวนด์
Background Eraser Tool ลบพ้นื ท่ีภาพลากเมาส์ผา่ นให้มีลักษณะทโ่ี ปรง่ ใส
Magic Eraser Tool ลบพ้ืนที่ภาพทส่ี ีใกล้เคยี งกันใหม้ ลี ักษณะโปร่งใส

รปู ที่ 2.1 กลมุ่ เครอ่ื งมอื Eraser Tool

2.7.1 ลบภาพโดยแทนที่ด้วยสแี บค็ กราวนด์
ใช้ในกรณีท่ีต้องการใช้สีแบล็คกราวนด์ลบจุดที่ลากเมาส์ โดยผลท่ีได้จะทาให้สีแบลค็ กราวนด์

แทนที่พื้นหลงั ในจดุ ท่ลี ากเมาส์ ดงั ตวั อยา่ งเราจะลบพนื้ หลังโดยใช้แบค็ กราวนด์สสี ีขาวไปแทนที่
1. คลกิ เลือก Eraser Tool จะปรากฏตัวชี้เมาส์เปน็ รูป
2. เลือกสีแบ็คกราวนดใ์ หเ้ ป็นสเี ดียวกับพนื้ หลัง
3. เลือกขนาดของหัวยางลบในออปชั่นบาร์
3.1 Brush เลือกขนาดหัวยางลบ
3.2 Mode กาหนดโหมดท่ใี ชก้ าหัวยางลบ
3.3 Opacity ใชเ้ พม่ิ /ลดความชดั บนพนื้ ที่ ทถ่ี ูกลบ
3.4 Flow กาหนดแรงถูของยางลบ หากตั้งค่านี้ต่าเม่ือใช้เครื่องมือลบภาพจะ

ไมเ่ กล้ยี งตอ้ งถลู บซ้าแต่หากตั้งคา่ สูงกจ็ ะสามารถลบได้เกลี้ยงเกลาในครง้ั เดยี ว
3.5 ป่มุ Set to enable airbrush capibilities
3.6 Eraser Tool History เมื่อเลือกออปช่ันนี้แล้วนาเคร่ืองมือไปลบจุดที่เคย

ลบไปแลว้ ภาพจดุ นน้ั จะปรากฏข้นึ เหมือนเดิม

๒๓
3.7 ปุ่ม Toggle the brushes panel คลิกเพื่อเปิด/ปิดพาแนล Brushes ใช้สาหรับ
ปรบั แตง่ ลักษณะหัวยางลบ

รปู ที่ 2.2 การปรบั แต่ง Options Bar ของ Eraser Tool
4. ลากเมาส์ลบบริเวณภาพทไ่ี ม่ต้องการออกไป

พ้นื ทีท่ ี่ถกู

พน้ื ท่โี ฟร์กราวด์

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

๒๔
Background Eraser Tool ลบพ้ืนที่ภาพท่ีลากเมาส์ผ่านให้มีลักษณะโปร่งใส เหมาะที่จะ
ใช้กับพน้ื ท่ีทม่ี ีหลายสีหรอื เป็นลวดลาย ถา้ เป็นสีเดียวกันควรใช้ Magic Eraser Tool
1. คลิกเครอื่ งมือ Magic Eraser Tool หรอื เคร่ืองมอื Background Eraser Tool คลิก
เมาส์เพ่อื ลบพ้นื ทใี่ หเ้ ป็นสเี ดยี วกัน

รปู ท่ี 2.4 ลบส่วนที่ไม่ตอ้ งการออก
2.8 การใสข่ อ้ ความข้ันต้น

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

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

๒๕

2. คลกิ ท่ีเครอื่ งหมาย ดา้ นบน
2.9 การซมู ขยาย – ย่อภาพ

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

การขยายภาพ สามารถขยายภาพที่นาเข้ามาให้ดูชัดเจนมากข้ึน โดยการใช้งานเคร่ืองมือ
Zoom Tool ดังน้ี

การย่อภาพ เมื่อต้องการย่อภาพให้เลก็ ลง ให้กด <Alt>+คลิกเมาส์ลงบนภาพ จากนั้นภาพจะ
คอ่ ย ๆ ถกู ยอ่ ใหเ้ ล็กลงตามจานวนครั้งทค่ี ลิกเมาส์
2.10 การเปลีย่ นขนาดของภาพ

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

2. กาหนดขนาดของภาพใหม่

๒๖

3. คลกิ เมาส์ OK เพอ่ื สัง่ ใหโ้ ปรแกรมเปลี่ยนขนาดภาพใหมต่ ามทีก่ าหนด
2.11 การเพิ่มพน้ื ที่ของรูปภาพ

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

1. เลอื กคาสั่ง Image > Canvas Size

2. กาหนดขนาด Width และ Height ตามต้องการ