การทำ aqua_button

การทำ aqua_button

1. เตรียมพื้นที่สำหรับสร้าง aqua_button ขึ้นมาจากนั้นดับเบิ้ลคลิกที่  Rectangle Tool (R) เพื่อเรียก Rectangle Settings ขึ้นมา ใส่ตัวเลขลงไปใน Corner radius เลขยิ่งมากเส้นก็จะยิ่งโค้ง

2. จากนั้นวาดรูปปุ่มตามขนาดที่ต้องการ

3. ใช้ Selection Tool (V) ลากคลุมปุ่มที่สร้างขึ้นเมื่อสักครู่ จากนั้นกด Stroke Colors แล้วเลือก   ดังภาพเพื่อลบเส้นขอบด้านนอกทิ้ง

4. หลังจากตัดขอบเสร็จแล้ว กด Ctrl + เพื่อ Zoom in เพื่อให้ภาพใหญ่ขึ้น

5. ใช้ Selection Tool (V) ลากคลุมปุ่มแล้วกด F8 เพื่อ Convert to Symbol เลือก Type : Button

6. ดับเบิ้ลคลิกที่ bar Layer ด้านหน้าเพื่อเปลี่ยนชื่อ Layer ให้จำง่ายขึ้นหรือไม่อยากเปลี่ยนก็ได้นะครับ งานแรกผมใช้ชื่อว่า่ background

>>>

7.  ใช้ Selection Tool (V) ลากคลุมปุ่มอีกครั้ง แล้วเลือก Window > Color Mixer

8. จะได้ Tool แบบนี้ออกมาให้เลือก Type : Solid และ Color Code #1A2953  (สีอื่นก็ได้นะครับ)

9. สร้าง Layer เพิ่มมาอีก 1 Layer โดยให้ชื่อว่า gradient

10. ทำการ Copy ปุ่มจาก Layer background มาวางที่ gradient และทับ background ไว้

11. จากนั้นใช้ Selection Tool (V) ลากคลุมปุ่มใน Layer gradient แล้วไปที่ Coler Mixer Type : Linear และ Color Code #95D5DF (สีอื่นก็ได้นะครับ)

12. จากนั้นกด F เพื่อเลือก   gradient Transform Tool (F) ปรับ

13. สังเกตุให้ สีเข้ม อยู่ด้านบนเป็นอันจบ

14. จากนั้นกด Q เพื่อเลือก Free Transform Tool (Q)  เลือก Options Scale

15. จากนั้น กด Alt และย่อขนาดปุ่มใน Layer gradient ด้านข้าง

16. จากนั้น กด Alt และย่อขนาดปุ่มใน Layer gradient ด้านบน – ล่าง (เมื่อกด Alt มันจะย่อพร้อมกันเอง โดยรักษาสัดส่วนให้ด้วยครับ)

17. สร้าง Layer ใช้ชื่อว่า shine (ใช้ชื่ออื่นก็ได้นะครับ)

18. Copy ปุ่มของ Layer gradient มาวางที่ Layer shine และใช้สีอื่นนะครับ สีอะไรก็ได้เพราะต้องเปลี่ยนอยู่แล้ว อันนี้เอาแค่มองง่ายๆแค่นั้น

19. จากนั้นกด Q เพื่อเลือก Free Transform Tool (Q) กด Alt ย่อขนาดในแนวทะแยงมุม เพื่อให้ได้สัดส่วน

20. ตัดออกมาเป็น 2 ส่วนด้วยวิธีการ ใช้ Selection Tool (V) ลากคลุมส่วนหน้าหลังและดึงไปด้านหลัง

21. ใช้ Selection Tool (V) ลากคลุมส่วนท้ายของด้านหน้า เพื่อการทำการเชื่อมต่อกับส่วนหน้าของด้านหลัง

22. จากนั้นกด Q เพื่อเลือก Free Transform Tool (Q) ลากคลุมจนถึงด้านหลังจนเป็นรูปเดียวกัน

23. จากนั้นใช้ Selection Tool (V) ลากคลุมแถบสีเหลืองใน Layer shine แล้วไปที่ Coler Mixer Type : Linear และ Color Code #E1E1E1 Alpha 0%

24. จากนั้น กด F เพื่อเลือก   gradient Transform Tool (F) ปรับหมุนย่อ (แบบเดียวกับข้อ 12, 13) และสังเกตุให้สีเข้มอยู่ด้านบน เป็นอันจบ

25.จากนั้นเพิ่ม Layer มาอีก 1 Layer ให้อยู่ระหว่าง shine กับ gradient  ใช้ชื่อว่า Text

26. จากนั้นพิมพ์อักษรที่ต้องการลงไปก็เป็นอันเสร็จแล้วครับ

ข้อความนี้ถูกเขียนใน Micromedie Flash คั่นหน้า ลิงก์ถาวร

ใส่ความเห็น

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / เปลี่ยนแปลง )

Twitter picture

You are commenting using your Twitter account. Log Out / เปลี่ยนแปลง )

Facebook photo

You are commenting using your Facebook account. Log Out / เปลี่ยนแปลง )

Google+ photo

You are commenting using your Google+ account. Log Out / เปลี่ยนแปลง )

Connecting to %s