[สอน] TH/EN ภาพในตัวหนังสือ / Picture & Text combination

chiaki	# 1 [ 06-01-2014 - 02:15:38 ]
	ภาพในตัวหนังสือ / Picture & Text Combination สวัสดีปีใหม่ค่ะ ไม่ช้าไปใช่ไหม 5555 วันนี้จะมาสอนการแต่งตัวหนังสือโดยใช้ภาพนะคะ มีน้องๆขอให้สอนเยอะเลยนานแล้วล่ะค่ะ แต่ตอนนั้นไม่มีเวลาทำซักที เอาจริงๆก็คือลืมบ้าง เพิ่งมานึกได้เมื่อตอนหยุดปีใหม่นี้เอง (ขอโทษน้า) เอาล่ะ อันนี้ไม่ยากเลย ถ้าทำเป็นแล้วก็จะแต่งฟอนต์เก๋ๆได้หลายแบบเลยค่ะ อย่างตัวอย่างข้างล่างนี้ เลือกเอาภาพดอกไม้มาเพราะดูจะง่ายสุด (ในความคิดกันต์นะ 55) แต่เพื่อนๆจะใช้ภาพอื่นก็ได้นะคะ แต่งได้ตามใจเราเลย Hello everybody! this is belated HNY tutorial haha Today I'll show you how to make a pic&text combination. The example that I show you below is just the idea. So, you can use other picture you like and make it by your own style. เริ่มเลยเนอะ! START! ขั้นแรก เปิดรูปที่จะใช้ขึ้นมาเลยค่ะ เราจะพิมพ์ตัวหนังสือลงไปบนภาพโดยใช้เครื่องมือ Horizontal Type Mask Tool นะคะ (ปกติเราใช้ horizontal mask ธรรมดากันใช่มะ) ตอนนี้ก็เล็งๆไว้นะคะ ว่าอยากจะโชว์ดีเทลตรงไหนของภาพออกมา มองไว้ว่างจะพิมพ์ฟ้อนต์ลงไปตำแหน่งไหน แล้วก็เลือกฟ้อนต์ไว้ด้วยเลยนะคะ แต่ก่อนที่จะพิมพ์อะไรลงไป สร้างเลเยอร์ใหม่ขึ้นมาเหนือภาพของเราแล้วเทสีขาวทับลงไปก่อนค่ะ (สีอื่นก็ได้) หลังจากนั้นใช้เครื่องมือ horizontal type mask tool พิมพ์ตัวหนังสือลงไปเลย [ปรับ %opacity ลงก่อนก็ได้ค่ะจะได้เห็นแล้วกะได้ว่าจะพิมพ์ลงตรงไหน ,,แต่ถ้าพิมพ์แล้วตำแหน่งยังไม่ตรง mask มันก็สามารถขยับทีหลังได้นะคะ ไม่ต้องห่วง ] เราก็จะได้ Selection เป็นรูปตัวหนังสือ หลังจากนั้นก็กด delete พื้นที่สีขาวออกไป ได้แล้ว!! ภาพอยู่ในตัวหนังสือ ทีนี้เรามาเพิ่มลูกเล่นให้ตัวหนังสือกันค่ะ ซูมเข้าไปใกล้ๆดูพื้นที่รอบๆที่เราเล็งไว้ตั้งแต่ก่อนพิมพ์ ใช้ Pen tool สร้างเส้นพาธรอบๆบริเวณนั้นขึ้นมา (ทำบนเลเยอร์สีขาวนะ) make selection แล้วก็ลบเลย ทีนี้ก็ได้ตัวหนังสือที่มีเดเทลเพิ่มขึ้นมาแล้วค่ะ แล้วในกรณีที่มองดูรอบๆตัวหนังสือแล้วมันตันหมดทางไป เราก็สามารถเอาจากทีอื่นมาใส่ได้นะคะ อย่างในรูปนี้ สนใจพื้นที่ที่วงกลมสีเหลืองไว้ ปิดตาเลเยอร์อื่นไปก่อน เหลือแค่ภาพข้างล่างพอ ทีนี้ก็ select เอาบริเวณที่คิดว่าจะไปต่อเติมไว้ค่ะ Copy แล้ว Paste ลงในเลเยอร์ใหม่นะ (อยู่เหนือเลเยอร์สีขาวด้วยนะ) ปรับขนาด ตำแหน่ง เอียงองศาให้พอดีกับตัวหนังสือเราเลยค่ะ ส่วนไหนเกินก็ลบทิ้ง (ปรับ%opacity ทำให้ทำงานง่ายขึ้นนะ ทำเสร็จก็ปรับกลับ) เสร็จแล้ว!! Finish ตัวอย่างผลงานที่นำเทคนิคนี้ไปใช้ / Example Wallpaper using this technic click for full resolution summary จากที่เห็นในตัวอย่าง มันเหมือนเป็นการเทสีขาวทับรูปแล้วเจาะรูเป็นรูปตัวหนังสือเลยใช่ไหมคะ ถ้าไม่อยากได้แบบนี้ล่ะ? อยากให้ไปอยู่บนภาพอื่นแทน ทำได้ไหม? ได้ค่ะ เราก็ใช้ horizontal type mask tool นี่แหละ พิมพ์บนภาพไปเลย เอาภาพออกมาเป็นตัวหนังสือ แล้วลากลงภาพอื่นที่เราต้องการ หลังจากนั้นจะแต่งอะไรยังไงก็ใช้วิธี copy&paste เอาก็ได้ค่ะ tutorial ข้างบนนี้ก็เป็นเพียง idea นะคะ ทุกคนสามารถเอาไปประยุกต์ทำอย่างอื่นได้อีกเอะมากๆ สุดท้ายนี้ก็ขอบคุณที่แวะเข้ามาดูกันนะคะ หวังว่ากระทู้นี้จะเป็นประโยชน์ไม่มากก็น้อย As you see in this example it's like we drill white area out and get the 'tex shape' hole but what if you don't want this drill? If you want to put the text(with picture combined) on other canvas you can use this 'horizontal type mask tool' type on the picture directly and drag it to other canvas after that add some details by 'copy&paste' method :) thank you for visiting this tutorial and feel free to ask anything note : ถ้าจะเอาการสอนไปเผยแพร่ที่อื่นเนี่ย ทำได้เลยนะคะ ยินดีมากๆเลย แต่ หากนำ tutorial นี้ออกไปเผยแพร่ กรุณาให้เครดิตเต็มนะคะ Please take out with full credit!!!

chiaki

# 1

[ 06-01-2014 - 02:15:38 ]

ภาพในตัวหนังสือ / Picture & Text Combination

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

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

Hello everybody! this is belated HNY tutorial haha
Today I'll show you how to make a pic&text combination.
The example that I show you below is just the idea. So, you can use other picture you like
and make it by your own style.

เริ่มเลยเนอะ! START!

ขั้นแรก เปิดรูปที่จะใช้ขึ้นมาเลยค่ะ เราจะพิมพ์ตัวหนังสือลงไปบนภาพโดยใช้เครื่องมือ
Horizontal Type Mask Tool นะคะ (ปกติเราใช้ horizontal mask ธรรมดากันใช่มะ)
ตอนนี้ก็เล็งๆไว้นะคะ ว่าอยากจะโชว์ดีเทลตรงไหนของภาพออกมา มองไว้ว่างจะพิมพ์ฟ้อนต์ลงไปตำแหน่งไหน
แล้วก็เลือกฟ้อนต์ไว้ด้วยเลยนะคะ

แต่ก่อนที่จะพิมพ์อะไรลงไป สร้างเลเยอร์ใหม่ขึ้นมาเหนือภาพของเราแล้วเทสีขาวทับลงไปก่อนค่ะ (สีอื่นก็ได้)
หลังจากนั้นใช้เครื่องมือ horizontal type mask tool พิมพ์ตัวหนังสือลงไปเลย
[ปรับ %opacity ลงก่อนก็ได้ค่ะจะได้เห็นแล้วกะได้ว่าจะพิมพ์ลงตรงไหน ,,แต่ถ้าพิมพ์แล้วตำแหน่งยังไม่ตรง mask มันก็สามารถขยับทีหลังได้นะคะ ไม่ต้องห่วง

]

เราก็จะได้ Selection เป็นรูปตัวหนังสือ หลังจากนั้นก็กด delete พื้นที่สีขาวออกไป
ได้แล้ว!! ภาพอยู่ในตัวหนังสือ

ทีนี้เรามาเพิ่มลูกเล่นให้ตัวหนังสือกันค่ะ ซูมเข้าไปใกล้ๆดูพื้นที่รอบๆที่เราเล็งไว้ตั้งแต่ก่อนพิมพ์
ใช้ Pen tool สร้างเส้นพาธรอบๆบริเวณนั้นขึ้นมา (ทำบนเลเยอร์สีขาวนะ)

make selection แล้วก็ลบเลย ทีนี้ก็ได้ตัวหนังสือที่มีเดเทลเพิ่มขึ้นมาแล้วค่ะ

แล้วในกรณีที่มองดูรอบๆตัวหนังสือแล้วมันตันหมดทางไป เราก็สามารถเอาจากทีอื่นมาใส่ได้นะคะ
อย่างในรูปนี้ สนใจพื้นที่ที่วงกลมสีเหลืองไว้

ปิดตาเลเยอร์อื่นไปก่อน เหลือแค่ภาพข้างล่างพอ
ทีนี้ก็ select เอาบริเวณที่คิดว่าจะไปต่อเติมไว้ค่ะ
Copy แล้ว Paste ลงในเลเยอร์ใหม่นะ (อยู่เหนือเลเยอร์สีขาวด้วยนะ)

ปรับขนาด ตำแหน่ง เอียงองศาให้พอดีกับตัวหนังสือเราเลยค่ะ ส่วนไหนเกินก็ลบทิ้ง
(ปรับ%opacity ทำให้ทำงานง่ายขึ้นนะ ทำเสร็จก็ปรับกลับ)

เสร็จแล้ว!!

Finish

ตัวอย่างผลงานที่นำเทคนิคนี้ไปใช้ / Example Wallpaper using this technic
click for full resolution

summary

จากที่เห็นในตัวอย่าง มันเหมือนเป็นการเทสีขาวทับรูปแล้วเจาะรูเป็นรูปตัวหนังสือเลยใช่ไหมคะ
ถ้าไม่อยากได้แบบนี้ล่ะ? อยากให้ไปอยู่บนภาพอื่นแทน ทำได้ไหม? ได้ค่ะ
เราก็ใช้ horizontal type mask tool นี่แหละ พิมพ์บนภาพไปเลย เอาภาพออกมาเป็นตัวหนังสือ แล้วลากลงภาพอื่นที่เราต้องการ
หลังจากนั้นจะแต่งอะไรยังไงก็ใช้วิธี copy&paste เอาก็ได้ค่ะ
tutorial ข้างบนนี้ก็เป็นเพียง idea นะคะ ทุกคนสามารถเอาไปประยุกต์ทำอย่างอื่นได้อีกเอะมากๆ
สุดท้ายนี้ก็ขอบคุณที่แวะเข้ามาดูกันนะคะ หวังว่ากระทู้นี้จะเป็นประโยชน์ไม่มากก็น้อย

As you see in this example it's like we drill white area out and get the 'tex shape' hole
but what if you don't want this drill? If you want to put the text(with picture combined) on other canvas
you can use this 'horizontal type mask tool' type on the picture directly and drag it to other canvas
after that add some details by 'copy&paste' method :)

thank you for visiting this tutorial
and feel free to ask anything

note : ถ้าจะเอาการสอนไปเผยแพร่ที่อื่นเนี่ย ทำได้เลยนะคะ
ยินดีมากๆเลย แต่ หากนำ tutorial นี้ออกไปเผยแพร่ กรุณาให้เครดิตเต็มนะคะ
Please take out with full credit!!!

Super_Naruman_Junior	# 2 [ 06-01-2014 - 15:01:45 ]
	เป็นเทคนิคที่เจ๋งจริงๆเลยคะ ไม่ยากไป แต่ก็ไม่ง่าย จะเอาไปลองทำนะคะ ขอบคุณเทคนิคดีๆจากพี่กันต์คะ

Bowiezz	# 3 [ 06-01-2014 - 21:22:50 ]
	ขอบคุณมากๆเลยค๊าาาาา :D

LEMON-LEMON	# 4 [ 27-01-2014 - 18:30:11 ]
	ขอบคุณสำหรับการแบ่งปันเทคนิคดีๆ นะคะน้องสาว ^^

sanyaindy	# 5 [ 30-01-2014 - 00:16:15 ]
	เจ๋งเลยครับ แต่ก็มีอีกวิธีนึงนะครับ คล้ายๆ กัน http://sanya-indy.com/clipping-mask-photoshop/

chiaki	# 6 [ 30-01-2014 - 22:58:05 ]
	quote : sanyaindy เจ๋งเลยครับ แต่ก็มีอีกวิธีนึงนะครับ คล้ายๆ กัน http://sanya-indy.com/clipping-mask-photoshop/ ใช้ได้เหมือนกันค่ะแล้วแต่คนถนัด ถ้าใช้ clipping mask การจะต่อเติมรายละเอียดก็จะต้องก็อปรูปขึ้นมาอีกชั้นนึงแล้วแต่งต่อข้างบน ส่วนข้อดีของ clipping mask คือ ใช้ซ้อนเลเยอร์อะไรก็ได้ไม่จำกัดเฉพาะตัวหนังสือเท่านั้น ขอบคุณที่แบ่งปันเทคนิคดีๆนะคะ

chiaki

# 6

[ 30-01-2014 - 22:58:05 ]

quote : sanyaindy

เจ๋งเลยครับ แต่ก็มีอีกวิธีนึงนะครับ คล้ายๆ กัน http://sanya-indy.com/clipping-mask-photoshop/

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

ขอบคุณที่แบ่งปันเทคนิคดีๆนะคะ

PookLoveYoona	# 7 [ 02-02-2014 - 22:16:22 ]
	ขอบคุณเทคนิคดีดีนะค่ะพี่กันต์ น้องจะลองนำไปใช้ดูนะค่ะ

nookarn	# 8 [ 30-04-2018 - 10:17:58 ]
	เทคนิคแจ่มมากค่ะ จะลองเอาไปหัดทำดู ขอบคุณมากจ้า

ต้องสมัครเป็นสมาชิกและ login เข้าสู่ระบบก่อนถึงจะสามารถลงความเห็นได้