เทคนิค : การทำ Glass Bar ที่เขานิยมทำกันเพื่อเอาไว้เป็นเมนู
ไฟล์ประกอบ PSD >> http://www.ziddu.com/download/6897801/Glass_Bar_TUT_by_Xenogenesis.rar.html
อันนี้แหละที่เราจะทำกัน
1.สร้างงานใหม่ขึ้นมา 1 อัน กำหนด 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.สร้างงานขึ้นมาใหม่ 1 ชิ้น กำหนดขนาดและคุณสมบัติต่าง ๆ ตามรูปเลยนะ
18.ใช้เครื่องมือ Pencil Tool(B) กำหนดขนาดหัวดินสอเป็น 1px น่ะจ๊ะ
19.วาดลงไปดังภาพเลยครับ สีดำนี้ทำให้เห็นภาพว่าต้องวาดลงจุดไปยังไงแต่เวลาใช้จริง ๆ ต้องเป็นสีขาวครับ (ขยายงาน 1600% ไปเลยเพราะพื้นที่งานเล็กมาก )
เวลาใช้จริง ๆ ต้องเปลี่ยนจุดดำ ๆ ให้เป็นขาวอย่างนี้นะ
20.ไปที่เมนู Edit > Define Pattern… ดังรูปเลย
21.ตั้งชื่อ Pattern ที่เราสร้างเอาไว้เป็นอะไรก็ได้แล้วก็ OK โลด
กลับมาที่ชิ้นงานหลักของเราต่อ..
22. คลิกขวาที่เลเยอร์ Base2 แล้วเลือกคำสั่ง Blending Options…
23.ติ๊กเลือกที่แท๊บ Pattern Overlay แล้วกำหนด Opacity = 75% และเลือก Pattern ที่เราได้สร้างไว้เมื่อกี้
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 ที่เราวาดเพิ่มขึ้นมาเมื่อกี้นี้ ( สังเกตุว่าจะมีจุด หนา ๆ โผล่ขึ้นมาแสดงว่า 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% ดังรูป แล้วก็โอเคเล้ย.
36. เสร็จแว้วววว ( ใส่ข้อความตกแต่งเอาตามสะดวกจ้า )
ประยุกต์ใช้กับงานหลาย ๆ อย่างอาจจะลองเปลี่ยนเส้น Pattern เป็นแบบอื่น หรือ Background แบบอื่น ๆ ดูบ้างก็ได้นะ กรณีที่พื้นสี Background เป็นสีอื่นนอกจากสีขาวในขั้นตอนการไล่สีในเลเยอร์ base ก็อาจจะต้องมีการเปลี่ยนแปลงไปด้วยตามความเหมาะสมครับ ทำเสร็จกันแล้วเป็นยังไงเอามาอวดกันบ้างก็ได้นะ เอิ๊ก ๆ
บทความนี้ได้จากเว็บxenstudio.wordpress.com
Site : www.it4x.com
ไฟล์ประกอบ PSD >> http://www.ziddu.com/download/6897801/Glass_Bar_TUT_by_Xenogenesis.rar.html
อันนี้แหละที่เราจะทำกัน
1.สร้างงานใหม่ขึ้นมา 1 อัน กำหนด 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.สร้างงานขึ้นมาใหม่ 1 ชิ้น กำหนดขนาดและคุณสมบัติต่าง ๆ ตามรูปเลยนะ
18.ใช้เครื่องมือ Pencil Tool(B) กำหนดขนาดหัวดินสอเป็น 1px น่ะจ๊ะ
19.วาดลงไปดังภาพเลยครับ สีดำนี้ทำให้เห็นภาพว่าต้องวาดลงจุดไปยังไงแต่เวลาใช้จริง ๆ ต้องเป็นสีขาวครับ (ขยายงาน 1600% ไปเลยเพราะพื้นที่งานเล็กมาก )
เวลาใช้จริง ๆ ต้องเปลี่ยนจุดดำ ๆ ให้เป็นขาวอย่างนี้นะ
20.ไปที่เมนู Edit > Define Pattern… ดังรูปเลย
21.ตั้งชื่อ Pattern ที่เราสร้างเอาไว้เป็นอะไรก็ได้แล้วก็ OK โลด
กลับมาที่ชิ้นงานหลักของเราต่อ..
22. คลิกขวาที่เลเยอร์ Base2 แล้วเลือกคำสั่ง Blending Options…
23.ติ๊กเลือกที่แท๊บ Pattern Overlay แล้วกำหนด Opacity = 75% และเลือก Pattern ที่เราได้สร้างไว้เมื่อกี้
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 ที่เราวาดเพิ่มขึ้นมาเมื่อกี้นี้ ( สังเกตุว่าจะมีจุด หนา ๆ โผล่ขึ้นมาแสดงว่า 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% ดังรูป แล้วก็โอเคเล้ย.
36. เสร็จแว้วววว ( ใส่ข้อความตกแต่งเอาตามสะดวกจ้า )
ประยุกต์ใช้กับงานหลาย ๆ อย่างอาจจะลองเปลี่ยนเส้น Pattern เป็นแบบอื่น หรือ Background แบบอื่น ๆ ดูบ้างก็ได้นะ กรณีที่พื้นสี Background เป็นสีอื่นนอกจากสีขาวในขั้นตอนการไล่สีในเลเยอร์ base ก็อาจจะต้องมีการเปลี่ยนแปลงไปด้วยตามความเหมาะสมครับ ทำเสร็จกันแล้วเป็นยังไงเอามาอวดกันบ้างก็ได้นะ เอิ๊ก ๆ
บทความนี้ได้จากเว็บxenstudio.wordpress.com
Site : www.it4x.com
บันทึกการเข้า
