ภาพสำเร็จงาน PHOTOSHOP ทั้ง 14 งาน

สร้างโลโก้สำหรับเว็บ

สายฟ้าฟาด

สร้างขอบรูปแบบแปลกๆ

ลดความมืดเพิ่มความสว่างให้ภาพ

พื้นหินชนวน

ลายไม่แบบที่1

ลายไม่แบบที่2

ลายริ้วในภาพ

เกล็ดหิมะโปรยปราย

คลื่นบนผิวน้ำ

ตัวอักษรโลหะ

สร้างภาพให้ดูเก่า

ปรับความนุ่มนวลให้ภาพ

หน้ากระดาษ 3 มิติ

ภาพหน้ากระดาษที่ได้จากการสแกนสิ่งพิมพ์ หรือแม้แต่ไฟล์รูปภาพทั่วๆไป เราสามารถทำให้มันดูเหมือนหน้ากระดาษจริงๆที่มีการบิดงอเป็น 3 มิติได้อย่างสวยงาม

1.เปิดไฟล์รูปภาพที่ต้องการทำเป็นหน้ากระดาษ 3 มิติ
2.เปลี่ยนรูปภาพธรรมดาให้เป็นเลเยอร์ โดยดับเบิลคลิกบนชื่อเลเยอร์ Background ในพาเล็ต Layers แล้วคลิก OK ในไดอะล็อกบ๊อกซ์ New Layer จะได้ Layer 0
3.ขยายพื้นที่ทำงานออกไปอีก 20% โดยเลือกคำสั่ง Image>Canvas Size เลือกออปชั่น Relative แล้วกำหนดค่าในช่อง Width และ Height เป็น 20 หน่อยเป็น percent

4.ตะแคงรูป โดยเลือกคำสั่ง Image>Rotate Canvas>90 ํ CCW

5.เลือกคำสั่ง Filter>Distort>Shear ในไดอะล็อกบ็อกซ์ Shear คลิกบนเส้นให้เกิดจุดแต่ละจุดแล้วลากไปทางซ้ายหรือขวาเล็กน้อย ดังรูป (สังเกตผลลัพธ์ที่ภาพตัวอย่าง ระวังอย่าให้ภาพตกออกนอกกรอบ)

6.ตะแคงรูปกลับที่เดิมโดยเลือกคำสั่ง Image>Rotate Canvas>90 ํ CW


7.เลือกคำสั่ง Edit>Transform>Rotate แล้วหมุนรูปภาพเล็กน้อย ดังรูป เสร็จแล้วกดคีย์ Enter

8.เลือกคำสั่ง Edit>Transform>Perspective ร่วมกับคำสั่ง Edit>Transform>Distort เพื่อปรับรูปภาพให้มีลักษณะดังรูป(คุณสามารถเลือกคำสั่งทั้งสองขึ้นมาใช้สลับกันได้โดยยังไม่ต้องกดคีย์ Enter จนกว่าจะได้ผลลัพธ์ตามต้องการ) เสร็จแล้วกดคีย์ Enter

>>>>>>ยังไม่เสร็จครับ ไปทำต่อก่อนนะครับ <<<<<<<<

ลวดลายพืนหินชนวน

เราสามารถใช้ Photoshop สร้างลวดลายพื้น (texture)ได้มากมายหลายแบบ ไม่ว่าจะเป็นแก้ว,หิน,ไม้,ผ้า,โลหะ,หญ้า และอื่นๆ โดยใช้เทคนิคต่างๆกันออกไป ในที่นี้จะขอแนะนำวิธีสร้างลวดลายหินชนวนโดยอาศัยคุณสมบัติของแชนเนลสร้างเอฟเฟ็คต์พิเศษอีกแบบหนึ่ง

1.สร้างรูปภาพใหม่ขนาด 300x300 พิกเซล กำหนดโหมดสีเป็น RGB Color และพื้นหลังเป็น White

2.เติมพื้นเป็นสีเทา โดยเลือกคำสั่ง Edit>Fill ในช่อง Use เลือกเป็น50% Gray และเลือกออปชั่นอื่นๆดังรูป

3.เปิดพาเล็ต Channel แล้วคลิกปุ่ม... เพื่อสร้างแชนเนลใหม่ จะได้แชนเนล Alpha 1 ซึ่งมีพื้นเป็นสีดำทั้งหมด

4.เลือกเครื่องมือ Brush บนออปชั่นบาร์กำหนดขนาดแปรงค่อนข้างใหญ่ (ในที่นี้ใช้ขนาด 65) กำหนด Opacity = 30% และคลิกปุ่ม...เพื่อให้เครื่องมือทำงานเหมือนแอร์บรัช
5.เลือกสี foreground เป็นสีขาว แล้วใช้แอร์บรัชระบายบนภาพให้เกิดเป็นจุดและแถบสีเทาบนพื้นดำ ดังรูป

6.เลือกคำสั่ง Filter>Artistic>Palette Knife และกำหนดออปชั่นดังรูป




7.ถ้าต้องการสร้างรอยสลักเป็นข้อความไว้บนหินก็เลือกเครื่องมือ Horizontal Type กำหนดออปชั่นต่างๆบนออปชั่นบาร์ เช่น ฟอนต์,สไตล์ และขนาดตามต้องการ ส่วนสีอักษรให้เลือกเป็นสีขาว
8.คลิกบนรูปภาพและพิมพ์ข้อความที่ต้องการ เสร็จแล้วคลิกปุ่มเครื่องหมายถูก บนออปชั่้นบาร์ ถ้าข้อความไม่อยู่ในตำแหน่งที่เหมาะสม ให้ใช้เครื่องมือ Move คลิกลากย้ายตำแหน่งได้




9.เพื่อให้รอยสลักข้อความมีขอบที่หยาบเหมือนรอยสลักหินจริง ให้เลือกคำสั่ง Filter>Pixelate>Crystallize กำหนด Cell Size=3 แล้วคลิก OK หลังจากนั้นกดคีย์ Ctrl+D เพื่อยกเลิก selection
10.เปิดพาเล็ต Layers แล้วคลิกบนเลเยอร์ Background จะกลับเข้าสู่โหมดการแก้ไขรูปภาพตามปกติ

11.สร้างภาพลวดลายพื้นจากข้อมูลในแชนเนล โดยเลือกคำสั่ง Filter>Render>Lighting Effecis คลิกลากปุ่มแฮนเดิลทั้ง4 เพื่อปรับทิศทางและขอบเขตของแสง พร้อมทั้งกำหนดออปชั่นต่างๆ ดังรูป
12.ถ้าต้องการปรับความคมชัดของผลลัพธ์ก็เลือกคำสั่ง Filter>Sharpen>Unsharp Mask แล้วกำหนดค่าออปชั่นตามต้องการ
13.ถ้าต้องการใส่สีก็คลิกปุ่ม... บนพาเล็ต Layers แล้วเลือก Hue\Saturation เลือกออปชั่น Colorize แล้วกำหนดค่า Hue,Saturation และ Lightness ตามต้องการ

รูปที่ทำสำเร็จแล้ว จะได้ดังรูป

ตัวอักษรโลหะ

ตัวอักษรธรรมดาๆ เมื่อผ่านเข้าสู่โปรแกรม Photoshop เราก็สามารถตกแต่งให้มันมีความสวยงามได้หลากหลายแบบอย่างแทบไม่น่าเชื่อต่อไปนี้เป็นตัวอย่าง

แบบหนึ่งของการทำตัวอักษรเป็นตัวโลหะ 3 มิติ โดยเพิ่มเกล็ดประกายคล้ายกากเพชรเข้าไปเพื่อให้ดูมีค่ายิ่งขึ้น

1.สร้างรูปภาพใหม่ขนาด 400x200 พิกเซล กำหนดโหมดสีเป็น RGB Color และพื้นหลังเป็น White
2.เลือกเครื่องมือ Horizontal Type บนออปชั่นบาร์เลือกฟอนต์ที่มีความหนามากๆ และใช้ตัวอักษรขนาดใหญ่(ในที่นี้ใช้ฟอนต์ JSChanokas ขนาด 200pt)เลือกสีเป็นสีดำ จากนั้นคลิกบนรูปภาพและพิมพ์ข้อความที่ต้องการ เสร็จแล้วคลิกปุ่มเครื่องมือถูกบนออ ปชั่น บาร์ จะได้เลเยอร์ข้อความอยู่เหนือ Background

3.สร้าง selection เฉพาะส่วนที่เป็นข้อความโดยกดคีย์ Ctrl ค้างไว้ แล้วคลิกบนเลเยอร์ข้อความ

4.คลิกปุ่ม..บนพาเล็ต Layers เพื่อสร้างเลเยอร์ใหม่ จะได้ Layer1
5.เลือกเครื่องมือ Gradient เลือกสี foreground/background เป็นดำ/ขาว บนออปชั่นบาร์เลือกให้ไล่สีแบบ Linear Gradient ด้วยสี Foreground to Background จากนั้นคลิกลากบนรูปภาพตั้งแต่ด้านบนของ selection ลงมาถึงด้านล่างเพื่อให้เกิดการไล่สีดังรูป
6.สร้างข้อมูลสำหรับการทำให้ตัวอักษรนูนเป็น 3 มิติ โดยเลือกคำสั่ง Filter>Blur>Gaussian Blur กำหนดค่า Radius=2.2(ถ้าใช้ค่ามากขึ้นจะทำให้ตัวอักษรนูนเพิ่มขึ้น)

7.ทำให้ตัวอักษรนูน โดยเลือกคำสั่ง Filter>Render>Lighting Effects และกำหนดออปชั่นดังรูป (สังเกตตรง Texture Channel จะต้องเลือกเป็น Layer 1 Transparency)

8.ปรับตัวอักษรให้เกิดเงาแบบโลหะ โดยคลิกปุ่ม..บนพาเล็ต Layers แล้วเลือก Curves จากนั้นปรับเส้นกราฟให้เป็นดังรูป(การจะได้เงาโลหะที่สวยหรือไม่อยู่ที่การปรับตำแหน่งของจุดบนเส้นกราฟทั้ง 3) หลังจากคลิก OK และทำการซ่อนเลเยอร์ข้อความไว้แล้ว จะได้ผลลัพธ์ดังรูป

9.ต่อไปเราจะทำให้ข้อความโลหะนี้ดูมีค่ายิ่งขึ้นโดยใส่พื้นผิวคล้ายกากเพชรเพิ่มลงไป เนื่องจากตอนนี้ selection เดิมได้หายไปแล้ว ดังนั้นให้เรียกกลับมาใหม่โดยกดคีย์ Ctrl ค้างไว้ แล้วคลิกบนเลเยอร์ข้อความ จากนั้นหด selection ลง โดยเลือกคำสั่ง select>Modify>Contract กำหนดค่า Contract By=6

10.คลิกปุ่ม..บนพาเล็ต Layers เพื่อสร้างเลเยอร์ใหม่ จะได้ Layer 2 แล้วใช้เครื่องมือ เติมสีขาวลงบน selection

11.เลือกคำสั่ง Filter>Noise>Add Noise กำหนดออปชั่นดังรูป แล้วคลิก OK จากนั้นเลือกคำสั่ง Filter>Add Noise เพื่อใส่เอฟเฟ็คต์เดิมซ้ำลงไปอีกครั้ง เสร็จแล้วกดคีย์ Ctrl+D เพื่อยกเลิก selection

12.คลิกปุ่ม..บนพาเล็ต Layers และเลือก Bevel and Emboss กำหนดค่าต่างๆ ดังรูป

13.ถ้าต้องการทำเป็นโลหะสีทอง ก็คลิกเลือกเลเยอร์ Curves 1 จากนั้นคลิกปุ่ม..แล้วเลือก Hue/Saturation เลือกออปชั่น Colorize แล้วปรับค่า Hue/Saturation/Lightness ดังรูป

เทคนิคเพิ่มเติม

ในข้อ 8 ข้างต้นเราสามารถทำให้ผิวโลหะมีความมันวาวยิ่งขึ้นได้ โดยการใส่เอฟเฟ็คต์ Curve ซ้ำลงไปอีกครั้ง เช่นจากรูปตัวอย่างเดิม เมื่อใส่ Curve ซ้ำจะได้ผลลัพธ์ดังรูป

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

1.สร้างรูปภาพใหม่ให้มีความกว้าง 200 และสูง 92 พิกเซล สำหรับโหมดสีกำหนดเป็น RGB Color พื้นหลังเป็น White ส่วน Resolution เนื่องจากเป็นรูปนี้เป็นรูปที่จขะนำไปแสดงบนจอคอมพิวเตอร์ ดังนั้นกำหนดเท่ากับ 72 pixel/inch
2.เลือกคำสั่ง Window>Color เพื่อแสดงพาเล็ต Color(ถ้าจำเป็น) แล้วคลิกปุ่ม..เลือกโหมดสีเป็น HSB Sliders จากนั้นปรับค่า HSB เพื่อกำหนดสีที่จะใช้เป็นพื้นหลังของโลโก้(การใช้โหมด HSB จะช่วยให้เลือกสีที่เหมาะสมได้ง่ายกว่าโหมด RGB)
3.เลือกเครื่องมือ Paint Bucket แล้วคลิกเพื่อเติมสี foreground ลงบนรูป

4.เลือกเครื่องมือ Custom Shape

5.คลิกปุ่ม..บนออปชั่นบาร์เพื่อเปิดพาเล็ต Custom Shape คลิกปุ่ม..แล้วเลือก All เพื่อแสดงรูปทรงสำเร็จรูปทั้งหมดที่โปรแกรมมีมาให้ จากนั้นคลิก Ok เพื่อยืนยัน
6.คลิกเลือกรูปภาพจากพาเล็ต Custom Shape จากนั้นบนออปชั่นบาร์คลิกปุ่ม Shape Layers

7.ใช้พาเล็ต Color เลือกสีจะใช้กับรูปทรง

6.คลิกเลือกรูปภาพจากพาเล็ต Custom Shape จากนั้นบนออปชั่นบาร์คลิกปุ่ม Shape Layers

8.คลิกเมาส์บนรูปภาพจนได้รูปคนที่มีขนาดตามต้องการ รูปคนนี้จะอยู่บนเลเยอร์ใหม่ชื่อ Shape1

9.กลับด้านซ้าย-ขวาของรูปทรงโดยเลือกคำสั่ง Edit>Transform>Flip Horizontal แล้วใช้เครื่องมือ Move เพื่อปรับตำแหน่งตามต้องการ

10.ใส่รูปทรงเพิ่มเติม โดยเลือกเครื่องมือ Custom Shape แล้วคลิกเลือกรูปเส้นซิกแซกจากพาเล็ต Custom Shape
11.บนออปชั่นบาร์คลิกปุ่ม Shape layers และ Create new shape layer (เพื่อให้รูปทรงใหม่ถูกสร้างบนเลเยอร์ใหม่) แต่ยกเลิกปุ่ม.. (เพื่อให้การกำหนดสีและออปชั่นอื่นบนออปชั่นบาร์มีผลต่อรูปทรงที่กำลังจะสร้างแทนนที่จะเป็นการแก้ไขคุณสมบัติของรูปทรงเดิมที่กำลังเลือก)
12.ใช้พาเล็ต Color เลือกสีที่จะใช้กับรูปทรง
13.คลิกลากเมาส์บนรูปภาพ จนได้รูปทรงที่มีขนาดตามต้องการ รุปเส้นซิกแซกนี้จะอยู่บนเลเยอร์ใหม่ชื่อ Shape 2

14.บนพาเล็ต Layers ให้คลิกลากเลเยอร์ Shape 2 สลับลงมาอยู่ใต้ Shape 1 และใช้เครื่องมือ Move เพื่อปรับตำแหน่งตามต้องการ

15.คลิกเลือกเลเยอร์ Shape 1 จากนั้นเลือกเครื่องมือ Horizontal Type บนออปชั่นบาร์เลือกฟอนต์,สไตล์,ขนาด และสีตัวอักษรตามต้องการ (ในที่นี้ใช้สีขาว)
16.คลิกบนรูปภาพแล้วพิมพ์ข้อความ WAISAI.NET เมื่อเสร็จก็คลิกปุ่มเครื่องหมายถูก บนออปชั่นบาร์ แล้วใช้เครื่องมือ Move ปรับตำแหน่งตามต้องการ
17.ถ้าต้องการปรับแก้ลักษณะตัวอัษร ก็เลือกเครื่งมือ Horizontal Type อีก แล้วเปลี่ยนค่าบนออปชั่นบาร์ เช่น ทดลองเปลี่ยนฟอนต์และขนาดตัวอักษรจนกว่าจะพอใจ

18.ใส่รูปทรงเพิ่มอีกโดยทำข้อ 10-13 ซ้ำ แต่คราวนี้เลือกรูปทรงรูปดาว และเลือกสีเป็นสีเหลือง (ค่า HSBคือ H:60,S:50,B:100)จะได้รูปดาวอยู่บนเลเยอร์ใหม่ชื่อ Shape 3

19.บนพาเล็ต Layers คลิกลากเลเยอร์ Shape 3 ลงมาทับปุ่ม..จะได้เลเยอร์ใหม่ชื่อ Shape 3 copy จากนั้นใช้เครื่องมือ Move ย้ายรูปดาวแยกออกจากกัน

20.ย่อรูปดาวดวงที่ 2 นี้ลงเล็กน้อย โดยเลือกคำสั่ง Edit>Transform Path>Scale คลิกลากเมาส์ที่แฮนเดิลเพื่อปรับขนาด เสร็จแล้วกดคีย์ Enter ผลก็คือจะได้ภาพโลโก้สำหรับนำไปใช้กับเว็บดังรูป

21.เราอาจตกแต่งโลโก้นี้เพิ่มเติมอีกเล็กน้อย โดยคลิกเลือกเลเยอร์ Background แล้วคลิกปุ่ม..จะได้เลเยอร์ใหม่ชื่อ Layer 1

22.เลือกคำสั่ง Edit>Fill แล้วเติมด้วยpattern ตามที่สร้างไว้ในหัวข้อ "ลายริ้วในรูปภาพ"
23.ปรับค่า Opacity ของ Layer 1 ลดลงเหลือ 20% จะได้ผลลัพธ์ดังรูป

บันทึกรูปภาพสำหรับนำไปใช้ในเว็บ

1.เลือกคำสั่ง File>Save for Web

2.คลิกแท็บ 4-Up เพื่อทดลองปรับออปชั่นการบันทึกภาพหลายๆแบบ

3.คลิกบนรูปตัวอย่างผลลัพธ์รูปแรก

4.ปรับออปชั่นการบันทึกภาพตามต้องการ(เนื่องจากภาพนี้มีลักษณะเป็นลายเส้นและใช้สีจำนวนน้อยจึงควรบันทึกเป็นไฟล์ชนิด GIF ส่วนออปชั่นอื่นให้เลือกตามความเหมาะสม เช่นลองเริ่มจากการใช้จำนวนสีน้อยๆ แล้วค่อยเพิ่มขึ้นจนกว่าจะได้ผลที่น่าพอใจ)5.คลิกบนรูปตัวอย่างผลลัพธ์รูปถัดไป แล้วปรับออปชั่นต่างๆในทำนองเดียวกับข้อ 4 โดยเลือกใช้ค่าที่แตกต่างจากที่เคยใช้ และทำเช่นนี้กับรูปตัวอย่าง ผลลัพธ์อื่นอีกตามความจำเป็น

ได้รูปที่นำไปใช้ในเว็บแล้ว