วันศุกร์ที่ 11 กรกฎาคม พ.ศ. 2551

สร้างปุ่มกด สำหรับเว็บ






1.สร้างรูปภาพขนาด 200*200 พิกเซล กำหนดสีเป็น RGB และพื้นหลังเป็น Transparent



















2.เริ่มสร่างปุ่ม โดยเลือกเครื่องมือ Round Rectangle บนออปชั่นบาร์คลิก Shape Layers กำหนดค่า radius =8 ใช้พาเล็ต color เลื่อกสีปุ่ม (ในที่นี้ใช้ค่า H:30,S:98,B:100)จากนั้นลากเมาส์บนรูปภาพจนได้ขนาดปุ่มเหมาะสม จะได้รูปทรงใหม่อยู่บนเลเยอร์ shape1










เนื่องจากเราต้องการสร้างรูปทรงที่ปุ่มแตกต่างออกไปจากปกติ ดังนั้นเลือกคำสั่ง Edit >Transform Path >Perspective แล้วคลิกลากที่ปุ่มแฮนเดิลตรงมุมซ้ายล่าง จนได้รูปทรงดังรูป แล้วกดคีย์ Enter








แปลงเลเยอร์ shape เป็นเลเยอร์ธรรมดา โดยคลิกขวาบนชื่อ shape1 แล้วเลือกคำสั่ง Resterize Layer
ต่อไปเราจะทำปุ่มให้มีลักษณะนูนโดยแบ่งเป็น 2 ขั้นตอน ตอนแรกเป็นการสร้างส่วนที่เป็นถูกแสงส่อง ตอนที่สองเป็นการสร้างส่วนที่อยู่ในเงา









วิธีสร้างส่วนแรกเริ่มจากการเลือกเครื่องมือ pen บนออปชั่นบาร์คลิกปุ่ม Paths และ Add to path area จากนั้นสร้าง path ให้ครอบคลุมพื้นที่บนปุ่มตรงส่วนที่ต้องการให้สว่างกว่าส่วนอื่นดังรูป6.สร้าง selection จากเส้น path ที่ได้ โดยคลิกขวาบนรูปภาพ แล้วเลือก Make Selection กำหนดค่า Feather Radius = 0











เลือกเครื่่องมือ Magic Wand จากนนั้นกดคีย์ Alt ค้างไว้ แล้วคลิกพื้นที่ภายใน selection แต่อยู่นอกปุ่ม ดังรูป ผลก็คือจะเหลือเพราะ selection ส่วนที่อยู่ในปุ่ม














หด selection เข้ามาเล็กน้อย โดยเลือกคำสั่ง select >Modify>Contract by =1 เเล้วคลิกเลือก ok










คลิกปุ่ม บนพาเล็ต layer เพื่อสร้างเลเยอร์ใหม่ จะได้ layer1







เลือกเครืองมือ Gradient เลื่อกสี forground เป็นสีขาว บนออปชั่นเลือกให้ใล่สีแบบ Linear Gradient ด้วยสี forground to transparent จากนั้นคลิกลากบนรูปภาพดังรูป










วิธีสร้างส่วนที่2 ก็คล้ายกับการสร้างส่วนแรก ตามขั้นตอนที่ 5-10






















ต่อไปเป็นการใส่ตัวอักษรโดยเริ่มจากคลิกเลือกเลเยอร์ shape1 บนพาเล็ต Layers






เลือกเครื่องมือ Horizontal Type





กำหนดฟอนต์ตามความต้องการ




กำจัดพื้นที่ส่วนเกินในรูปออกไปโดย เลือกคำสั่ง Image>Trim





ไม่มีความคิดเห็น: