ปฏิบัติการที่ 11...

11
ภาควิชาวิทยาการคอมพิวเตอร์และเทคโนโลยีสารสนเทศ ม.นเรศวร ปฏิบัติการที ่ 11 ตกแต่งภาพด้วยโปรแกรม Photoshop ครั้งที ่ 2 วิชา 001272 คอมพิวเตอร์สารสนเทศขั้นพื้นฐาน รหัส ชื่อ สาขา คณะ หมู ่เรียนทีวันทีเดือน .วัตถุประสงค์ 1. เพื่อแนะนาการทา Filter , การ Merge รูปภาพหลายเลเยอร์ 2. เพื่อฝึกทาตัวอย่าง ในการใช้เครื่องมือเพื่อทาแบนเนอร์ การแก้ไขภาพให้สมบูรณ์ และการสร้าง ภาพเคลื่อนไหว Merge Down หรือ Merge Linked เป็นการรวม Layer ที่ใช้งานอยู ่กับ Layer ที่อยู ่ลาดับถัดลง โดยถ้า Layer ที่อยู ่ลาดับถัดไปมีสัญลักษณ์ รูปโซ่ จะมี ข้อความว่า Merge Linked แต่หากไม่มีรูปโซ่จะมีข้อความว่า Merge Down แต่ถ้าเลือกหลายเลเยอร์พร้อมกันก็ทาได้โดย การกด Ctrl ค้างไว้แล้วคลิกเลือกเลเยอร์ที่ต้องการ จากนั ้นคลิกขวาที่เลเยอร์ก็จะพบเมนู Merge Down ดังรูป การแต่งภาพโดยใช้ Filter ฟิลเตอร์ (Filter) คือการตกแต่งภาพด้วยเทคนิคพิเศษ ที่สามารถปรับเปลี่ยนรูปแบบของภาพตามความต้องการ ของงาน เราสามารถใช้งาน Filter ได้โดยเลือก Menu > Filter > เลือกใช้ Filter ที่ต้องการ ตัวอย่างการใช้ Filter ทีMenu Bar จะมีปุ ่ม Filter (1) อยู เมื่อกดแล้วจะมี Filter Menu ปรากฏขึ้นเลื่อนเมาส์ไปยัง Filter “Blur”(2) จะ มีเมนูย่อยเพิ่มขึ้นมา ให้กดเลือกที“Redial Blur”(3) เมื่อเลือกเสร็จแล้วจะปรากฏหน้าจอการปรับเปลี่ยนลักษณะของ Filter สามารถที่จะกาหนดได้ตามต้องการ (ใน Filter แต่ละตัวนั้น หน้าจอการปรับเปลี่ยนลักษณะของ Filter จะไม่เหมือนกัน) เสร็จแล้วกดปุ ่ม OK เพื่อจบขั้นตอนการ ทางานของ Filter จะได้ภาพที่มีการตกแต่งด้วย Filter: Radial Blur ออกมา ทั้งนี ถ้าใช้ Filter อื ่นรูปงานที่ปรากฏ จะ ต่างกันออกไป

Upload: others

Post on 21-Jun-2020

4 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: ปฏิบัติการที่ 11 ตกแต่งภาพด้วยโปรแกรม Photoshop ครั้งที่ 2 · 3.2 ไปเลือกเป็นแบบ

ภาควชาวทยาการคอมพวเตอรและเทคโนโลยสารสนเทศ ม.นเรศวร

ปฏบตการท 11 ตกแตงภาพดวยโปรแกรม Photoshop ครงท 2

วชา 001272 คอมพวเตอรสารสนเทศขนพนฐาน

รหส ชอ สาขา

คณะ หมเรยนท วนท เดอน พ.ศ

วตถประสงค 1. เพอแนะน าการท า Filter , การ Merge รปภาพหลายเลเยอร 2. เพอฝกท าตวอยาง ในการใชเครองมอเพอท าแบนเนอร การแกไขภาพใหสมบรณ และการสราง

ภาพเคลอนไหว Merge Down หรอ Merge Linked

เปนการรวม Layer ทใชงานอยกบ Layer ทอยล าดบถดลง โดยถา Layer ทอยล าดบถดไปมสญลกษณ รปโซ จะมขอความวา Merge Linked แตหากไมมรปโซจะมขอความวา Merge Down แตถาเลอกหลายเลเยอรพรอมกนกท าไดโดยการกด Ctrl คางไวแลวคลกเลอกเลเยอรทตองการ จากนนคลกขวาทเลเยอรกจะพบเมน Merge Down ดงรป

การแตงภาพโดยใช Filter ฟลเตอร (Filter) คอการตกแตงภาพดวยเทคนคพเศษ ทสามารถปรบเปลยนรปแบบของภาพตามความตองการ

ของงาน เราสามารถใชงาน Filter ไดโดยเลอก Menu > Filter > เลอกใช Filter ทตองการ ตวอยางการใช Filter ท Menu Bar จะมป ม Filter (1) อย เมอกดแลวจะม Filter Menu ปรากฏขนเลอนเมาสไปยง Filter “Blur”(2) จะ

มเมนยอยเพมขนมา ใหกดเลอกท “Redial Blur”(3) เมอเลอกเสรจแลวจะปรากฏหนาจอการปรบเปลยนลกษณะของ Filter สามารถทจะก าหนดไดตามตองการ (ใน

Filter แตละตวนน หนาจอการปรบเปลยนลกษณะของ Filter จะไมเหมอนกน) เสรจแลวกดป ม OK เพอจบขนตอนการท างานของ Filter จะไดภาพทมการตกแตงดวย Filter: Radial Blur ออกมา ทงน ถาใช Filter อนรปงานทปรากฏ จะตางกนออกไป

Page 2: ปฏิบัติการที่ 11 ตกแต่งภาพด้วยโปรแกรม Photoshop ครั้งที่ 2 · 3.2 ไปเลือกเป็นแบบ

ภาควชาวทยาการคอมพวเตอรและเทคโนโลยสารสนเทศ ม.นเรศวร

ตวอยาง Filter ทนาสนใจ

ภาพตนแบบ

Smudge Stick

Gaussian

Radial Blur

Angled Strokes

Mosaic

Facet

Fragment

Lens Flare

Lighting Effects

Sharpen

Graphic Pen

Halftone Pattern

Stamp

Water Paper

Wind

Page 3: ปฏิบัติการที่ 11 ตกแต่งภาพด้วยโปรแกรม Photoshop ครั้งที่ 2 · 3.2 ไปเลือกเป็นแบบ

ภาควชาวทยาการคอมพวเตอรและเทคโนโลยสารสนเทศ ม.นเรศวร

ใหนสตฝกปฏบตตามดงตอไปน

กอนอนใหโหลดภาพ เพอใชประกอบ ไฟลชอ myPhoto.zip ซงจะมภาพดงรปดานลาง

ตวอยางท 1 การออกแบบ Wallpaper ใหท าตามขนตอนตอไปน

1.1 เรมจากการสรางงานใหม โดยก าหนดขนาดและรายละเอยดตางๆ ดงรป

1.2 จากนนน าภาพใสลงไปใน Layer ตางๆ ดงรป 3 Layer

Page 4: ปฏิบัติการที่ 11 ตกแต่งภาพด้วยโปรแกรม Photoshop ครั้งที่ 2 · 3.2 ไปเลือกเป็นแบบ

ภาควชาวทยาการคอมพวเตอรและเทคโนโลยสารสนเทศ ม.นเรศวร

1.3 ใหปรบขนาดในแตละ Layer โดยการกด Ctrl+T จากนนปรบขนาดของภาพแตงตามตองการ

1.4 ใหใชเครองมอ Selection เพอเลอกตดภาพบางสวนออกเพอใหเหนดานหลงของแตละ Layer การตดนน

เพอใหเลอกพนทไดเหมาะสมและรวดเรว ใหใชเครองมอ ซงสามารถเลอกความละเอยดจาก Tolerance ได ซงใน

ทนก าหนดเปน 10 สวนทภาพรถดานหลงอาจจะตองก าหนดเปน 20-30 เพอใหเลอก Selection แลวตดไดเรวขน

หมายเหต ถาตองการเลอกแบบตอเนองใหกด Shift คางไวดวย

จากนนใหใชเครองมอ เพอปรบขอบภาพทถกตดไปใหเนยนขน

Page 5: ปฏิบัติการที่ 11 ตกแต่งภาพด้วยโปรแกรม Photoshop ครั้งที่ 2 · 3.2 ไปเลือกเป็นแบบ

ภาควชาวทยาการคอมพวเตอรและเทคโนโลยสารสนเทศ ม.นเรศวร

1.5 ก าหนด Layer Style ใหกบภาพ Car5 โดยการก าหนดเงาภาพใน Drop shadow และ Outer Glow แลว

ปรบแตงตามตองการ ดงรป

จากนนให copy Layer Style ของ Car5 มาใชกบภาพ Girl2 ดวย โดยการคลกขวาท Layer ทตองการคดลอก

แลวเลอก copy Layer style จากนน ไป Layer Girl2 แลวคลกขวา เลอก Paste

1.6 วาดรปสเหลยมดวยเครองมอ Shape จากนนก าหนด Opacity เพอท าใหสเหลยมมทบนอยลง ท าใหมองเหนภาพดานหลงได

Page 6: ปฏิบัติการที่ 11 ตกแต่งภาพด้วยโปรแกรม Photoshop ครั้งที่ 2 · 3.2 ไปเลือกเป็นแบบ

ภาควชาวทยาการคอมพวเตอรและเทคโนโลยสารสนเทศ ม.นเรศวร

1.7 พมพขอความตามตองการ

1.8 ใส Filter ใหมแสง เลอก Layer Wal2 กอน จากนนไปทเมน FilterRenderLens Flare จากนนใหปรบ

คาดงรป

1.9 บนทกไฟลเปน JPG เพอน าไปใช

Page 7: ปฏิบัติการที่ 11 ตกแต่งภาพด้วยโปรแกรม Photoshop ครั้งที่ 2 · 3.2 ไปเลือกเป็นแบบ

ภาควชาวทยาการคอมพวเตอรและเทคโนโลยสารสนเทศ ม.นเรศวร

ตวอยางท 2 การแกไขภาพหรอรทชภาพ

2.1 ใหเปดภาพทตองการแกไขภาพ ในทนจะใชภาพ Girl5 ซงเปนภาพทอาจจะมบางสวนทตองการแกไข ดงรป

โดยจะใชเครองมอในชด Heal Brush Tool, Patch Tool, Dodge Toolและ Blur Tool เปนตน

หมายเหต ภาพนใชเพอการเรยนรเทานน ไมไดตงใจมเจตนาอยางอน

2.2 ถาตองการลบรวรอยใตตาใหเรยบ เราจะใช ลากใตตาทละหนอยแลวปลอย ภาพดานขางกจะถกปรบ

ใหดขน หรอใช เพอแกทละจด โดยสามารถจะเลอกโทนสใกลเคยงกบบรเวณทตองการแกไขไดดวยการกด ALT

จากนนกจะมวงกลมทมเสนผาศนยกลางเลกแสดงขนในในบรเวณสทเลอก เมอน าเมาสถไปกจะมสญลกษณ + แสดง

ขนมาดวย

หรอ

Page 8: ปฏิบัติการที่ 11 ตกแต่งภาพด้วยโปรแกรม Photoshop ครั้งที่ 2 · 3.2 ไปเลือกเป็นแบบ

ภาควชาวทยาการคอมพวเตอรและเทคโนโลยสารสนเทศ ม.นเรศวร

ภาพกอนและหลงการแกไข

2.3 ตอไปจะเอาแปงออกจากแกม โดยใชเครองมอ ลากครอบบรเวณทตองการเอาออก จากนนลาก

บรเวณทมเสนปะ ไปยงบรเวณสทตองการ แลวปลอย โปรแกรมจะดงสทใกลเคยงปรบสใหอตโนมต จากนนใหลบแปง

ออกใหหมด ดวยวธการเดม ดงรป

2.4 จากนนใชเครองมอ เพอปรบภาพใหกลมกลนกนมาขน โดยเฉพาะบรเวณทใชเครองมอไป โปรด

ระมดระวง ใหคอยๆปรบ ตามแนว อยาปดมว เพราะจะท าใหไมไดแนวส และอาจจะใช ขดภาพใหขาวขน

โดยเฉพาะตรงแกม โดยใหปรบเปนขนาดใหญๆ แลวกดทละครงเพอดภาพทเกดขนวาเพยงพอไหม จากนนใหนสตแกไข

ภาพทงหนาด โดยใชวธการเดม

Page 9: ปฏิบัติการที่ 11 ตกแต่งภาพด้วยโปรแกรม Photoshop ครั้งที่ 2 · 3.2 ไปเลือกเป็นแบบ

ภาควชาวทยาการคอมพวเตอรและเทคโนโลยสารสนเทศ ม.นเรศวร

ตวอยางท 3 การท าภาพ Animation อยางงายส าหรบท าแบนเนอรบนเวบไซต

สมมตวาตองการท าปายแบนเนอร เพอแนะน าสนคา

3.1 ซงเรมจากการก าหนดขนาด ในทนใช 600x90 พกเซล

3.2 ไปเลอกเปนแบบ Animation โดยไปทเมน Window Animation วงจะมมมมอง 2 แบบ คอ Timelines

และแบบ Frames ใหเราเลอกตามทชอบ แตในทนขอใหเลอกแบบ Frames โดยไปทมมขวาลาง เพอก าหนดการแสดงเปน

แบบ Frame ดงรป

3.3 น าภาพและพมพขอความทตองการแสดงใหครบ ตามต าแหนงทตองการ ดงรป

3.4 ปรบเวลาการแสดงแตละเฟรมวาจะใหแสดงกวนาท ดงรป

Page 10: ปฏิบัติการที่ 11 ตกแต่งภาพด้วยโปรแกรม Photoshop ครั้งที่ 2 · 3.2 ไปเลือกเป็นแบบ

ภาควชาวทยาการคอมพวเตอรและเทคโนโลยสารสนเทศ ม.นเรศวร

3.5 จ านวนครงทจะแสดงภาพ Animation นน ในทนก าหนด Forever คอแสดงแบบไมมจ ากด ดงรป

3.6 เพอทเราจะใหก าหนดแสดงทละ Layer ดงนน จะตองเพมเฟรมไปอก 3 เฟรม กดไปท จ านวน 3 ครง

รวมกจะได 4 เฟรม ซงจะม Layer เหมอนกนทกเฟรม ดงรป

3.7 จากนนใหก าหนดแตละเฟรมใหแสดงขอมลแตกตางกน ดงนนในแตละเฟรมกจะตองปดการแสดงบางอยาง

โดยกดท ใน Layer เพอใหการแสดงทละ Layer นนเอง ตวอยางดงรป

ลองรนเพอดผลลพธ

Page 11: ปฏิบัติการที่ 11 ตกแต่งภาพด้วยโปรแกรม Photoshop ครั้งที่ 2 · 3.2 ไปเลือกเป็นแบบ

ภาควชาวทยาการคอมพวเตอรและเทคโนโลยสารสนเทศ ม.นเรศวร

3.8 ในเฟรมสดทาย ถาตองการแสดงขอความตวอกษรขนมาทละ โดยใช Tween Animation ใหคลกไปทเฟรม

สดทายกอน แลวกดไปท จากนนกจะปรากฏ ดงรป

จากนนใหปรบเวลาแตละเฟรมใหมเปน 0.2 วนาท ทกเวลา

3.9 จากนนใหบนทกไฟลเปนไฟลประเภท Gif โดยไปทเมน FileSave for Web & Device..

แบบฝกหด

ใหนสตออกแบบการดเชญแขกมารวมงานวนเกดของตวเอง โดยตองมรปตวเองอยในการดนดวย ออกแบบตาม

รปแบบงานทตองการ มขอมลทใหผทถกเชญดวย จากนนใหบนทกไฟลสงทง PSD และ JPG