Glass Bar "แท่งแก้ว" (Re-Publish)

อันนี้แหละที่เราจะทำกัน

1. สร้างงานใหม่ขึ้นมาโดยกด (CTRL + N) หรือเลือกเมนู File > New
กำหนด Properties ดังรูป แล้ว OK

2. พื้นที่ชิ้นงานที่เราจะทำประมาณนี้

3. เลือกเครื่องมือ Rounded Rectangle Tool (U) ดังภาพ

4.ที่ด้านบนเลือกการวาดเป็นแบบ Shape และกำหนด Radius = 0.2 cm ดังรูป

5.วาดลงไปในพื้นที่ให้มีขนาดตามที่ต้องการ

6.ตั้งชื่อเลเยอร์ที่เราวาดไว้เมื่อขั้นตอนที่แล้วเป็น base ดังรูป ( กันงงทั้งคนทำคนสอน ) จากนั้นคลิกขวาที่เลเยอร์ base แล้วเลือกคำสั่ง Blending Options…

7.ติ๊กเลือกที่ Gradient Overlay แล้วกำหนด Properties ดังภาพ จากนั้นคลิกที่ Gradient ( ข้าง ๆ คำว่า Reverse ) เพื่อกำหนดการไล่สี

8.ที่ Gradient Editor กำหนดค่าต่าง ๆ ดังรูป จากนั้นกด OK..OK ตามลำดับ

9.เราจะได้ฐานของแท่งแก้วเป็นประมาณภาพด้านล่าง

10.ใช้เครื่องมือ Rounded Rectangle Tool (U) และกำหนดค่าต่าง ๆ ดังรูป ( เช่นเดียวกับขั้นตอนในข้อ 4. นั้นเอง )

11.วาดลงไปในพื้นที่งานแต่ให้มีขนาดเล็กกว่าเลเยอร์ base เล็กหน่อย

12.ตั้งชื่อเลเยอร์นี้ว่า Base2 ( กันงงอีกเช่นเคย ) ตามภาพ

13.นำรูปที่ต้องการจะนำมาทำเป็น Background ของปุ่มแล้วก็ลากเข้ามาไว้ในพื้นที่งานเรา

14.ตั้งชื่อเลเยอร์ภาพนี้ว่า Picture ตามรูป จากนั้นคลิกขวาที่เลเยอร์ Picture แล้วเลือกคำสั่ง Create Clipping Mask
***ข้อสังเกต เลเยอร์ Picture จะอยู่เหนือบนเลเยอร์ Base2 ตามภาพ

15.หลังจากเราเลือกคำสั่ง Create Clipping Mask เรียบร้อยแล้วจะมีลูกศรเล็ก ๆ โผล่ขึ้นมาที่หน้าเลเยอร์ Picture ( เป็นอันว่าใช้ได้ )

16.และผลงานที่ได้ก็จะเป็นตามภาพด้านล่าง
*** คำสั่ง Create Clipping Mask จะทำให้เลเยอร์ที่อยู่ข้างใต้ของภาพทำหน้าที่เป็นตัว Mask(หน้ากาก) ให้แสดงเฉพาะส่วนของงานที่ต้องการเท่านั้น ในที่นี้เลเยอร์ Base2 ถูกทำให้เป็นตัว Mask และแสดงในส่วนที่เลเยอร์ Base2 เห็นเท่านั้น ( หวังว่าผู้อ่านคงจะเข้าใจและพยายามเข้าใจ เพราะคนทำเองมันก็ไม่รู้จะอธิบายยังไงดี )

…พักตรงนี้ไว้ก่อนต่อไปจะมาทำในส่วนของ Pattern กัน

17.สร้างงานขึ้นมาใหม่โดยกด (CTRL +N) หรือเมนู File > New กำหนดขนาดและคุณสมบัติต่าง ๆ ตามรูปเลย

18.ใช้เครื่องมือ Pencil Tool(B) กำหนดขนาดหัวดินสอเป็น 1px

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

เวลาใช้จริง ๆ ต้องเปลี่ยนจุดดำ ๆ ให้เป็นขาวตามภาพด้านล่าง (หรือกดคีย์ลัด CTRL + I(ไอ) เพื่อกลับสีให้เป็นสีตรงข้าม)

20.ไปที่เมนู Edit > Define Pattern… ดังรูป

21.ตั้งชื่อ Pattern ที่เราสร้างเอาไว้เป็นชื่ออะไรก็ได้ จากนั้นกด OK

กลับมาที่ชิ้นงานหลักของเราต่อ..

22. คลิกขวาที่เลเยอร์ Base2 แล้วเลือกคำสั่ง Blending Options…

23.ติ๊กเลือกที่แท๊บ Pattern Overlay แล้วกำหนด Opacity = 75% และเลือก Pattern ที่เราได้สร้างไว้เมื่อขั้นตอนที่ 19.

Pattern ที่สร้างเอาไว้จะอยู่แถว ๆ นี้แหละ

24.ผลงานที่ได้จะออกมาตามภาพด้านล่าง

25.ใช้เครื่องมือ Rounded Rectangle Tool (U) และกำหนดค่าต่าง ๆ ตามข้อ (4.) และวาดลงไปในพื้นที่งานของเราเลยแต่ให้มีขนาดเล็กกว่าเลเยอร์ Base2 เล็กน้อย

26.และตั้งชื่อเลเยอร์นี้ว่า shade ( กันงงอีกตามเคย )

27.คลิกเลือก Shape ที่เลเยอร์ shade ให้เกิดเส้นขอบพื้นที่รอบ ๆ Shape ขึ้นก่อน ( ตรงนี้ต้องสังเกตดีดี )
ใช้เครื่องมือ Rounded Rectangle Tool (U)
จากนั้นกด Shift ค้างไว้และวาดลงไปตามภาพ
** ข้อสังเกต(อย่างแรง) ในขณะที่วาด Shape เพิ่มเข้าไปที่เลเยอร์ shade ตรงเคอเซอร์ตัววาดจะมีเครื่องหมายบวก (+) ปรากฎขึ้นมาด้วย ซึ่งแสดงว่าเรากำลังจะวาด Shape เพิ่มเข้าไปใน Shape เดิม ถ้าไม่มีเครื่องหมาย ( + ) โผล่ขึ้นมาให้ลองคลิกเลือกที่ Shape เพื่อให้เกิดเส้นพื้นที่รอบ ๆ Shape เสียก่อน

28.เมื่อวาดแล้วก็จะได้ตามภาพด้านล่าง ( สังเกตุว่า Shape ที่วาดเพิ่มเข้ามาจะอยู่รวมที่เดียวกันกับเลเยอร์ shade ไม่ได้ถูกแยกเลเยอร์ขึ้นมาใหม่ )

29.ใช้เครื่องมือ Path Selection Tool (A) ( ลูกศรสีดำ )

30. คลิกเลือกไปที่ shape ที่เราวาดเพิ่มขึ้นมาเมื่อขั้นตอนที่ 28. ( สังเกตว่าจะมีจุด หนา ๆ โผล่ขึ้นมาแสดงว่า shape เมื่อกี้ที่วาดไว้ได้ถูกเลือกแล้ว )

31.ที่ด้านบนคลิกเลือก Subtract From Shape area (-) ตามรูปครับ

32.ผลที่ได้มันจะตัดส่วนที่เราวาดทับกันออกไป ^^

33. ต่อไปคลิกขวาที่เลเยอร์ shade แล้วเลือกคำสั่ง Blending Options…

34. ติ๊กเลือกที่แท๊บ Gradient Overlay แล้วกำหนด Properties ต่าง ๆ ดังภาพครับ จากนั้นคลิกเลือกที่ Gradient เพื่อกำหนดการไล่สี

35.ที่ Gradient Editor กำหนดค่า Opacity และ Color ดังรูปเลยครับ

35.เลือกที่แท๊บ Blending Options : Custom และปรับ Fill Opacity เป็น 0% ดังรูป
จากนั้นกด OK

36. เสร็จแล้ว ดูผลกรรมที่เราได้สร้างไว้ครับ

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

Download .PSD Source file : [ LINK 1 ]