Page 1 of 1

ใช้ Photoshop ในการ separate แบ่งรูปภาพกันดีกว่า แยกรูป หนึ่งรูปเป็นหลายๆ รูป

Posted: 28/05/2016 12:22 pm
by worachat
ใช้ Photoshop ในการ separate แบ่งรูปภาพกันดีกว่า แยกรูป หนึ่งรูปเป็นหลายๆ รูป

วันนี้ผมจะมาบอกเคร็ดลับการ แยก แบ่ง หรือ ตัด ภาพ เมื่อเวลาเอาไปใช้งานภาพที่ถูกแบ่ง นำยังมาต่อกันเป็นภาพเหมือนเดิม งงกันแล้วช่ายป่าวครับ ไปทำพร้อมๆ กันเรยครับ
1. ให้เราเลือกภาพที่จะแบ่งส่วน มาโดย ให้เราไปที่ Menu คลิก File > Open หรือ กด Ctrl + O เมื่อเลือกภาพตามที่ต้องการก็ให้คลิก Open อีกครั้งนึงครับ
Image

2. เมื่อเราได้ภาพที่ต้องการจะแบ่งส่วนมาและต่อไปก็เริ่งต้นการแบ่งส่วนกันเลย
โดยให้เรา คลิกที่ View > New Guides
Image
มันจะมีให้เราเลือก จะเอา เส้นแนวตั้งหรือนอน ซึ่งทำได้ทีละเส้น
Image
หรือวิธีใช้วิธีง่ายๆ ให้เราคลิกเมาส์ที่ แถบบันทัดแล้วลาก ได้ทั้งแนวทั้งและแนวนอน
Image
***หมายเหตุ ทำเพื่องานต่อการตัด เช่น เราต้องการจะแบ่งส่วน เป็น 4 ภาพ เท่าๆกน มันก็จะง่ายต่อการแบ่งส่วนให้เท่าๆ กันครับ

3. เราจะใช้ Slice Tool ในการตัด เพื่อแบ่งส่วนภาพ
ใช้ Photoshop ในการ separate แบ่งรูปภาพกันดีกว่า แยกรูป หนึ่งรูปเป็นหลายๆ รูป separat5.jpg
separat5.jpg (50.48 KiB) Viewed 9327 times
4. ลาก tool มาช่องที่ได้แบ่งเอาไว้ในการตัด
Image

5. เมื่อครบทุกช่องหรือตามที่เราต้องการเเล้ว ให้เรา เลือก Save โดยไปที่ Menu File -> Save for Web หรือ กด Ctrl + Alt + Shift + S

6. เมื่อ Save เรียบร้อย ภาพจะถูกสร้าง Folder ใหม่ขึ้งเองอัตโนมัติ
Image
ใช้ Photoshop ในการ separate แบ่งรูปภาพกันดีกว่า แยกรูป หนึ่งรูปเป็นหลายๆ รูป separat8.jpg
separat8.jpg (21.79 KiB) Viewed 9327 times
เท่านี้ก็เสร็จเรียนร้อยครับ

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

Re: ใช้ Photoshop ในการ separate แบ่งรูปภาพกันดีกว่า

Posted: 17/10/2019 6:07 pm
by mindphp
บทเรียนอื่นๆ ของ Photoshop
https://www.mindphp.com/%E0%B8%9A%E0%B8 ... oshop.html

Re: ใช้ Photoshop ในการ separate แบ่งรูปภาพกันดีกว่า

Posted: 18/10/2019 2:56 pm
by LEG
:like: