OWATMATE.COM Slogan slogan slogan
Simple New simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simple simle
***Note: Right click here. And select for Edit header image ***
Search

Main Menu
Counter
Today  56 คน
 Months 6864 คน 
 Year 22264 คน 
Total 5588348 คน
Start 2008-11-28

Link
My marquee text
Welcome to Website .........
 
การทำปุ่มแก้วแบบที่ 1 หลายคนอาจจะสงสัยว่าเว็บต่างๆ เขาทำกันอย่างไร เราน้องใหม่ก็อยากจะทำบ้าง จริงๆ แล้วก็ใช้พื้นฐานที่เราศึกษามาทั้งสิ้นไม่ว่าจะเป็นเรื่อง Gradient หรือแม้แต่การใส่สี เริ่มไม่ยากแล้วใช่ไหม ลองมาดูขั้นตอนการทำ

ขั้นตอนการทำ

1. สร้างเอกสารขึ้นมาโดยให้มีขนาดใหญ่กว่าปุ่มที่เราต้องการ (เช่นเราต้องการปุ่มขนาด 125 x 30 px อาจจะสร้างขนาด 150 x 50 px เพื่อเวลาที่เราทำงานจะได้ไม่ตกขอบ ดังนั้นผมจะสร้างเอกสารขึ้นมาขนาด 150 x 50 px ดังภาพ



2. จากนั้นให้เราใช้เครื่องมือ วาดปุ่มสี่เหลี่ยมตามขนาดที่เราต้องการ ดังภาพ
* ใช้เครื่องมือ info เข้ามาช่วยเช็คขนาดก็ได้ ดังภาพ


ใช้เครื่องมือขณะวาดพร้อมเช็คขนาดจาก info ไปในตัว



3. จากนั้นเทสีโดยใช้เครื่องมือที่เราคุ้นเคย หรือใช้ Key ลัดช่วย Alt + Back Space , Ctrl + Back Space ดังภาพ
* อย่าลืม New Layer ขึ้นมาใหม่ก่อนที่เราจะใส่สีด้วยนะครับ และอย่าเพิ่งยกเลิก Selection เพื่อที่เราจะใช้เทขอบในขั้นตอนต่อไป


สีที่เราทำการเท #FF6600



4. เข้าไปที่เมนู Edit --> Stroke ให้เลือกสีที่เข้มกว่าพื้น ดังภาพ

สีที่เราใช้เทขอบ #BD4C01



5. จากนั้นให้เราใช้เครื่องมือ วาดส่วนของพื้นที่เป็นแก้ว ดังภาพ




6. เตรียมสีเพื่อใช้ในการทำ Gradient ดังภาพ



7. จากนั้นนำสีที่เราเตรียมมาเทใส่ในพื้นที่ๆ เราได้เตรียมไว้ ดังภาพ


หลังจากที่เทสีด้วย Gradient แล้วอย่าเพิ่งยกเลิกเส้น



8. ใส่ Filter --> Blur --> Gaussian Blur ใส่ค่าลงไปประมาณ 1 แล้วยกเลิก Selection จะได้ผลดังภาพ


มาถึงขั้นตอนนี้ได้ผลตรงดังตัวอย่างหรือไม่ จากนั้นตบแต่งใสตัวอักษรให้สวยงาม เราก็จะได้ปุ่มมาใช้ดังภาพ

More


Copyright (c) 2006 by Your Name