Photoshop: อักษรแผ่รังสี (Radiation Text)

0 ความคิดเห็น

เขียนเมื่อ วันพุธ, เมษายน 07, 2553

ขั้นตอนที่ 1. เริ่มจากสร้่างไฟล์ Photoshop ขึ้นใหม่ในขนาด 300x300 ให้เทพื้นหลังเป็นสีดำ

ขั้นตอนที่ 2. พิมพ์คำที่ต้องการลงไป โดยในตัวอย่างนี้ใช้ตัวอักษรแบบ "Arial Rounded MT Bold" ขนาด 60 pt (ส่วนสีของตัวอักษรจะเป็นสีอะไรก็ได้ที่ไม่ใช่ขาวกับดำเพราะมันจะกลืนกับพื้นหลังเวลาทำตามขั้นตอน) จากนั้นกด Ctrl ที่เลเยอร์ตัวอักษรเพื่อสร้าง selection

ขั้นตอนที่ 3. ปรับค่า Selection ที่สร้างขึ้นดังนี้
ไปที่ Select > Modify > Expand ตั้งค่า Expand By: 3 หลังจากนั้นให้
ไปที่ Select > Modify > Feather ตั้งค่า Feather Radius: 5

ขั้นตอนที่ 4. สร้างเลเยอร์ขึ้นใหม่ใต้เลเยอร์ตัวอักษรโดยตั้งชื่อเลเยอร์ที่เพิ่มขึ้นใหม่ว่า Layer 1 แล้วเทสีขาวลงไป

ขั้นตอนที่ 5. ไปที่เลเยอร์ตัวอักษรแล้วเลือกเปลี่ยนสีตัวอักษรที่พิมพ์ไว้ให้กลายเป็นสีดำ

ขั้นตอนที่ 6. ไปที่ Layer 1 เลือก Layer > Layer Style > Outer Glow จากนั้นให้กดเลือกที่แถบสี Gradient

ขั้นตอนที่ 7. จากนั้นปรับค่าใน Gradient Editor ดังนี้

ตั้งค่าของ Stops ในแถบด้านบนว่า
A > Opacity: 100, Location: 0
B > Opacity: 50, Location: 100

ตั้งค่าของ Stops ในแถบด้านล่างว่า
C > Color: #ffffff, Location: 0
D > Color: #ffffff, Location: 5
E > Color: #ffff00, Location: 16
F > Color: #32a300, Location: 65
G > Color: #00610e, Location: 100

ขั้นตอนที่ 8. ไปที่ Window > Animation โดยใช้แบบ Animation (Frames) จากนั้นเลือกที่
Selects frame delay time > Other แล้วปรับค่า Set Delay: 0.15  และตั้งค่า looping options เป็นแบบ Forever

ขั้นตอนที่ 9. คลิกเลือกที่ Duplicates selected frames จำนวน 2 ครั้ง เพื่อคัดลอกเฟรมแรกเพิ่มขึ้นอีกสองเฟรม

ขั้นตอนที่ 10. เลือกเฟรม 2 ไว้แล้วไปที่ Layer 1 แล้วเลือก Layer > Layer Style > Outer Glow และปรับค่าของ Structure ให้ Opacity: 0

ขั้นตอนที่ 13. เลือกเฟรม 2 ไว้จากนั้นเลือกที่ Tweens animation frames แล้วปรับค่า Frames to Add: 4 โดยเมื่อทำแล้วในขณะนี้ก็จะมีทั้งหมด 7 เฟรม

ขั้นตอนที่ 12. เลือกเฟรม 7 ไว้จากนั้นเลือกที่ Tweens animation frames แล้วปรับค่า Frames to Add: 4 โดยเมื่อทำแล้วในขณะนี้ก็จะมีทั้งหมด 11 เฟรม

ขั้นตอนที่ 13. ลบเฟรมที่ 11 ทิ้งไป

ขั้นตอนที่ 14. เลือก File > Save for Web & Devices โดยให้เลือกเซฟเป็น GIF ก็จะได้อนิเมชั่นตามต้องการ

Photoshop: อนิเมชั่นอักษรเบลอสั่นไหว (Animated Vibrating Blur Text)

0 ความคิดเห็น

เขียนเมื่อ วันอาทิตย์, กุมภาพันธ์ 28, 2553

ขั้นตอนที่ 1. สร้างไฟล์ Photoshop ขึ้นมาขนาดพื้นที่ทำงาน 300x300 วาดพื้นหลังขึ้นมาตามต้องการหรือจะลองตั้งค่าตามตัวอย่างข้างล่างนี้ดูก็ได้โดยตั้งชื่อเลเยอร์พื้นหลังอันนี้ว่า Layer 1

---

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

พื้นที่ด้านบนให้ไล่สี Gradient จากบนลงล่างโดยตั้งค่า Foreground: #ffc600 และ Background: #ffba00
เส้นสีที่แบ่งด้านบนและส่วนกลางคือ #e0750d และ #fff600 ตามลำดับ
พื้นที่ตรงกลางให้ไล่สี Gradient จากบนลงล่างโดยตั้งค่า Foreground: #ffa800 และ Background: #ff8800
เส้นสีที่แบ่งส่วนกลางและด้านล่างคือ  #c64000  และ #ece100 ตามลำดับ
พื้นที่ด้านล่างให้ไล่สี Gradient จากบนลงล่างโดยตั้งค่า Foreground: #ff9d00 และ Background: #ff9000

---

ขั้นตอนที่ 2. พิมพ์ตัวอักษรสีขาว (#ffffff) ใส่ลงไปตามต้องการ โดยในตัวอย่างนี้ใช้ อักษรแบบ Bookman Old Style แบบ Bold ขนาด 72 Pt จากนั้นตั้งชื่อเลเยอร์อักษรนี้ว่า "Quick"

ขั้นตอนที่ 3. สั่งคัดลอกเลเยอร์ "Quick" ขึ้นมาอีกหนึ่งอันโดยนำไปวางไว้ด้านบนสุดแล้วให้ตั้งชื่อเลเยอร์ที่เพิ่มขึ้นมาใหม่นี้ว่า "Shadow"

ขั้นตอนที่ 4. ไปที่เลเยอร์ "Shadow" จากนั้นเปลี่ยนสีตัวอักษรในเลเยอร์นี้ให้เป็น #753e12 จากนั้นขยับตำแหน่งตัวอักษรในเลเยอร์  "Shadow" นี้เลื่อนไปด้านขวา 1 px และเลื่อนลงด้านล่าง 1 px

ขั้นตอนที่ 5. ย้ายเลเยอร์ "Shadow" ไปไว้ใต้เลเยอร์ "Quick"

ขั้นตอนที่ 6. เปลี่ยนเลเยอร์ตัวอักษรให้เป็นรูปภาพโดยเลือกเลเยอร์ "Quick" และ "Shadow" ไว้พร้อมกันแล้วไปที่ Layer > Rasterize > Type
จากนั้นให้รวมเลเยอร์ตัวอักษรทั้งสองอันนี้เข้าด้วยกันโดยเลือกเลเยอร์ "Quick" และ "Shadow" ไว้พร้อมกันแล้วไปที่ Layer > Merge Layers หรือใช้การกดปุ่ม Ctrl+E แทนก็ได้โดยให้ตั้งชื่อเลเยอร์ที่รวมกันแล้วว่า "Text Stop"

ขั้นตอนที่ 7. ให้สั่งคัดลอกเลเยอร์ "Text Stop" เพิ่มขึ้นมาอีกหนึ่งอันแล้ววางไว้ด้านบนสุดโดยตั้งชื่อว่า "Text Blur"

ขั้นตอนที่ 8. ไปที่เลเยอร์ "Text Blur" แล้วเลือกที่  Filter > Blur > Motion Blur โดยตั้งค่าดังนี้
Angle: 0
Distance : 16 px

ขั้นตอนที่ 9. สั่งซ่อนเลเยอร์ "Text Blur" แล้วเลือกที่ Window > Animation
เปิดใช้หน้าจอทำงานแบบ "Convert to frame animation"
ตั้งค่ารูปแบบการแสดงของ Animation เป็น Forever
และตั้งค่า Delay ในเฟรมแรกเป็น 0.2 sec

ขั้นตอนที่ 10. สั่งคัดลอกเฟรมแรกที่มีอยู่เพิ่มขึ้นมาอีก 4 อัน แล้วเลือกทำงานในเฟรมที่ 5 โดยในเฟรมนี้ให้สั่งซ่อนเลเยอร์ "Text Stop" แต่ให้เปิดแสดงภาพเลเยอร์ "Text Blur" แทน

ขั้นตอนที่ 11. เลือก File > Save for Web & Devices โดยให้เลือกเซฟเป็น GIF ก็จะได้อนิเมชั่นอักษรเบลอตามต้องการ

Credit: http://www.voidix.com/imageready_blur_text.html

Photoshop: อักษรโมเสกสี่เหลี่ยม (Mosaic Cubed Text)

0 ความคิดเห็น

เขียนเมื่อ วันพุธ, กุมภาพันธ์ 03, 2553

ขั้นตอนที่ 1. สร้างไฟล์ Photoshop ขึ้นมาขนาดพื้นที่ทำงาน 300x300 จากนั้นเทพื้นหลังเป็นสีดำ (#000000) แล้วพิมพ์ตัวอักษรสีขาวใส่ลงไปตามต้องการ โดยในตัวอย่างนี้ใช้ อักษรแบบ Arial Black ขนาด 60 Pt

ขั้นตอนที่ 2. ตั้งชื่อเลเยอร์พื้นหลังสีดำว่า Layer 1 และ ตั้งชื่อเลเยอร์ตัวอักษรว่า CUBIC
จากนั้นเปลี่ยนตัวอักษรเป็นรูปภาพโดยเลือกที่เลเยอร์ตัวอักษรไว้แล้วไปที่ Layer > Rasterize > Type

ขั้นตอนที่ 3.  ไปที่เลเยอร์ตัวอักษรแล้วเลือกที่ Filter > Blur > Gaussian Blur
โดยตั้งค่า Radius ให้เป็น 4

ขั้นตอนที่ 4. เลือกเลเยอร์ตัวอักษรแล้วไปที่ Filter > Pixelate > Mosaic
โดยตั้งค่า Cell Size  ให้เป็น 8

ขั้นตอนที่ 5. เลือกเลเยอร์ตัวอักษรแล้วไปที่ Filter > Sharpen > Sharpen
เพื่อให้ขอบของโมเสกคมชัดขึ้น แต่ถ้ายังรู้สึกว่า เส้นคมไม่พอก็ให้กด Ctrl+F เพื่อสั่งทำ Filter ที่เพิ่งใช้ไปซ้ำอีกครั้งจนกว่าจะพอใจ (ในตัวอย่างนี้ใช้  Sharpen ไป 2 ครั้ง)

ขั้นตอนที่ 6. เลือก Selection ของเลเยอร์ตัวอักษร CUBIC ที่ทำไว้
จากนั้นสร้างเลเยอร์เพิ่มขึ้นใหม่โดยตั้งชื่อว่า Layer 2 แล้วเทสี #00b4ff ลงไปใน Selection นี้และเปลี่ยน Blending Mode เป็น Difference  เสร็จแล้วจึงย้าย  Layer 2 ไปไว้ใต้เลเยอร์  CUBIC

ขั้นตอนที่ 7. เลือก Selection ของเลเยอร์ตัวอักษร CUBIC ที่ทำไว้
จากนั้นสร้างเลเยอร์เพิ่มขึ้นใหม่โดยตั้งชื่อว่า Layer 3 แล้วเทสี #0c397c ลงไปใน Selection นี้และเปลี่ยน Blending Mode เป็น Linear Dodge (Add) เสร็จแล้วจึงย้าย  Layer 3 ไปไว้ใต้เลเยอร์  CUBIC แต่อยู่เหนือเลเยอร์ Layer 2

ขั้นตอนที่ 8. ตบแต่งพื้นหลังตามต้องการ และกดบันทึกก็เสร็จแล้ว

Credit: http://www.voidix.com/cubetext.html

Photoshop: อักษรนูนด้วยการขยับเลเยอร์ (Pixel Bevel Text)

0 ความคิดเห็น

เขียนเมื่อ วันอังคาร, กุมภาพันธ์ 02, 2553

ขั้นตอนที่ 1. สร้างไฟล์ Photoshop ขึ้นมาขนาดเท่าไรก็ได้ โดยในตัวอย่างนี้ใช้ขนาด 200x200 เทพื้นหลังเป็นสีเทา (4a4a4a) แล้วพิมพ์ตัวอักษรลงไป

ขั้นตอนที่ 2. คัดลอกเลเยอร์ตัวอักษรที่ทำไว้เพิ่มอีก 2 เลเยอร์ จากนั้นใส่สีของตัวอักษรในแต่ละเลเยอร์ดังนี้

• เลเยอร์ตัวอักษรด้านบนสุด : สีเทาปานกลาง (828282)
• เลเยอร์ตัวอักษรตรงกลาง :  สีเทาอ่อน (bababa)
• เลเยอร์ตัวอักษรด้านหลัง : สีเทาเข้ม (222222)

ขั้นตอนที่ 3. ขยับตำแหน่งเลเยอร์ตัวอักษรดังนี้

• เลเยอร์ตัวอักษรด้านบนสุด : ปล่อยไว้เฉยๆ ไม่ต้องขยับย้ายตำแหน่ง
• เลเยอร์ตัวอักษรตรงกลาง : ขยับเลื่อนไปทางด้านซ้ายและด้านบนเล็กน้อย
• เลเยอร์ตัวอักษรด้านหลัง : ขยับเลื่อนไปทางด้านขวาและด้านล่างเล็กน้อย

ขั้นตอนที่ 4. ลองดูผลที่ได้

Credit: http://www.voidix.com/pixeltext.html

Flash: อนิเมชั่นบอลเด้งดึ๋ง (Animate Bouncing Ball)

0 ความคิดเห็น

เขียนเมื่อ วันศุกร์, มกราคม 08, 2553

การทำอนิเมชั่นลูกบอลกระเด้งเหมือนในตัวอย่างมีขั้นตอนดังนี้

---

ขั้นตอนที่ 1. สร้างไฟล์แฟลชขึ้นมาใหม่ (New Document)
สร้างไฟล์แฟลชขึ้นมาใหม่โดยจะใช้ Actionscript 2.0 หรือ 3.0 ก็ได้เพราะชิ้นงานที่จะทำนี้ไม่ต้องใช้วิธีเขียนสคริปต์

---

ขั้นตอนที่ 2. ตั้งค่าไฟล์เอกสาร (Document Settings)
ชื่อไฟล์: Bouncing Ball
ขนาดพื้นที่ทำงาน: 400x400
พื้นหลัง: สีขาว (#ffffff)
เฟรมเรท (Frame Rate): 21 fps

---

ขั้นตอนที่ 3. ตั้งชื่อเลเยอร์ (Layer)
กดเปลี่ยนชื่อเลเยอร์ที่มีอยู่จากเดิมโดยกดดับเบิ้ลคลิกที่ "Layer 1" ให้เปลี่ยนเป็นชื่อใหม่ว่า "Ball"

---

ขั้นตอนที่ 4. สร้างลูกบอล (Ball)
สร้างลูกบอลขึ้นมาด้วย Oval Tool จากแถบเมนูด้านซ้ายมือ
โดยอย่าลืมเลือกเปิดใช้ Object Drawing ไว้ด้วยแล้วตั้งค่าดังนี้
วงกลมสี #f0d637 ขนาดกว้าง 120px และสูง 120px
ใช้เส้นขอบสี #000000 ขนาด 3 px

---

ขั้นตอนที่ 5. เปลี่ยนลูกบอลเป็นซิมโบล (Symbol Creation)

เลือกวงกลมลูกบอลที่สร้างเอาไว้ในขั้นตอนที่แล้วจากนั้นกด F8 เพื่อเปลี่ยนให้กลายเป็นซิมโบล (Symbol) ชนิด "Movie Clip" โดยตั้งชื่อว่า "mc_ball" และเลือก registration ให้ตั้งอยู่ที่จุดตรงกลางดังรูป

---

ขั้นตอนที่ 6. ใส่เงา (Shadow)

สร้างเลเยอร์ขึ้นใหม่โดยตั้งชื่อว่า "Shadow" โดยนำไปให้วางอยู่ใต้เลเยอร์ "Ball" ดังรูปแล้ววาดวงรีด้วย Oval Tool ลงไปในเลเยอร์ "Shadow" ให้มีขนาดกว้าง 100px และสูง 25px  ด้วยสีพื้นหลัง #e2e0e5 โดยไม่ต้องมีเส้นขอบ

จากนั้นเลือกเงาวงรีนี้ไว้แล้วกด F8 เพื่อแปลงเงานี้ให้เป็นซิมโบลชนิด "Movie Clip" โดยตั้งชื่อว่า "mc_shadow" และเลือก registration ให้ตั้งอยู่ที่จุดตรงกลางดังรูปเช่นเดียวกับลูกบอล

---

ขั้นตอนที่ 7. จัดตำแหน่ง (Position)
เปิดเมนู Window > Align เพื่อจัดตำแหน่งวัตถุจากนั้นจัดตำแหน่ง "mc_ball" และ "mc_shadow"
ตำแหน่งในแนวนอนให้อยู่ตรงกลางของพื้นที่ทำงาน
ตำแหน่งในแนวตั้งให้วางอยู่บริเวณส่วนล่างของพื้นที่ทำงาน

โดยตำแหน่งของซิมโบลในตัวอย่างนี้หลังจัดตำแหน่งเสร็จแล้วก็คือ
mc_ball  อยู่ที่ X:200,Y:310
mc_shadow อยู่ที่ X:200,Y:372

---

ขั้นตอนที่ 8. เพิ่มคีย์เฟรม (Add Keyframes)
เลือกเฟรมที่ 20 ของทั้งเลเยอร์ "Ball" และ "Shadow" ซึ่งสามารถเลือกทำงานในหลายเลเยอร์พร้อมกันด้วยการกดปุ่ม Ctrl จากนั้นกด F6 เพื่อสร้างคีย์เฟรมดังรูป

จากนั้นให้เลือกเฟรมที่ 10 ของทั้งเลเยอร์ "Ball" และ "Shadow" แล้วกด F6 เพื่อสร้างคีย์เฟรมดังรูป

---

ขั้นตอนที่ 9. วางบอลไว้ตรงจุดสูงสุด (High Point)
ในเฟรมที่ 10 ให้ขยับซิมโบลลูกบอล "mc_ball" เลื่อนขึ้นมาด้านบนไว้บริเวณจุดสูงสุดที่ต้องการให้ลูกบอลกระเด้งขึ้นไปถึง โดยตำแหน่งของลูกบอลในตัวอย่างนี้คือ X:200,Y:90

---

ขั้นตอนที่ 10. ค่าสีของเงา (Color Settings)
ในเฟรมที่ 10 ให้ปรับขนาดกว้างของเงา "mc_shadow" จากเดิมที่กว้าง 100px และสูง 25px
ให้กลายเป็นกว้าง 200px และสูง 25px โดยตำแหน่งในแนวแกน X และ Y อยู่ที่เดิม
และตั้งค่าของ "mc_shadow" ในเฟรมนี้ให้เป็น Color: Alpha 30%

---

ขั้นตอนที่ 11. ทำให้เคลื่ิอนไหว (Tweening)
สร้างการเคลื่อนไหวโดยเลือกเฟรมอันไหนก็ได้ที่อยู่ตั้งแต่เฟรมที่ 2 ถึง 9 ของทั้งเลเยอร์ "Ball" และ "Shadow" แล้วในเมนู Properties Inspector ให้กำหนดค่าเป็น Tween: Motion และตั้งค่า Ease: 100 เพื่อให้ลูกบอลมีจังหวะเด้งขึ้นที่นุ่มนวล

---

ขั้นตอนที่ 12. จังหวะตกลงสู่พื้น (Back Down to Earth)
สร้างการเคลื่อนไหวโดยเลือกเฟรมอันไหนก็ได้ที่อยู่ตั้งแต่เฟรมที่ 11 ถึง 19 ของทั้งเลเยอร์ "Ball" และ "Shadow"

แล้วในเมนู Properties Inspector ให้กำหนดค่าเป็น Tween: Motion
และตั้งค่า  Ease: -100  เพื่อให้ลูกบอลมีจังหวะตกลงที่รวดเร็ว

เมื่อกดปุ่ม F12 จะได้ผลดังนี้

---

ขั้นตอนที่ 13. ย่อขนาดเพื่อความสมจริง (Extra Touch of Realism)

ทำให้ลูกบอลยุบในจังหวะกระทบพื้นโดยเลือกทั้งเลเยอร์ "Ball" และ "Shadow" แล้วสั่งสร้างคีย์เฟรมขึ้นในเฟรมที่ 21 โดยการกด F6

ซึ่งในเฟรมที่ 21 นี้ให้ย่อขนาดในแนวตั้งของซิมโบลลูกบอล "mc_ball" จากเดิมที่มีความสูง 120px ให้กลายเป็น 90px แต่ให้ความกว่างยังคงเป็น 120px เท่าเดิม และตำแหน่งในตอนนี้อยู่ที่ X:200,Y:325

---

ขั้นตอนที่ 14. แก้ไขซิมโบล (Edit Symbol)
ต่อมาเป็นการเพิ่มส่วนทึบใต้ลูกบอลโดยให้เลือกทำงานในเฟรมที่ 1 ไว้แล้วกดดับเบิ้ลคลิกที่วัตถุซิมโบล "mc_ball" เพื่อเข้าไปแก้ไขซิมโบล

---

ขั้นตอนที่ 15. คัดลอกเฟรม (Copy Frame)
สั่งเปลี่ยนชื่อของ "Layer 1" ให้กลายเป็น "Ball Spinning" แล้วสร้างเลเยอร์เพื่มขึ้นมาอีกหนึ่งอันไว้ด้านบนสุดโดยตั้งชื่อเลเยอร์ที่อยู่ด้านบนนี้ว่า "Shade"

เมื่อสร้างเลเยอร์เสร็จแล้วก็ให้ใช้เมาส์คลิกเลือกเฟรมที่ 1 ของเลเยอร์  "Ball Spinning" เอาไว้แล้วคลิกขวาเลือกที่ "Copy Frames" จากนั้นให้เลือกเฟรมที่ 1 ของเลเยอร์ "Shade" แล้วคลิกขวาเลือกที่ "Paste Frames"

---

ขั้นตอนที่ 16. เปลี่ยนสีวัตถุ (Change object colors)
จากนั้นให้สั่งล็อกเลเยอร์และซ่อน "Ball Spinning" ไว้แล้วเปลี่ยนสีของลูกทรงกลมในเลเยอร์ "Shade" ให้สีพื้นหลังกลายเป็น #e2e0e5 และไม่ต้องมีเส้นขอบ

---

ขั้นตอนที่ 17. ผสานวัตถุ (Combine Objects)
ต่อมาให้วาดวัตถุทรงกลมขนาด 240x240 px แล้ววางไว้เยื้องจากวัตถุลูกบอลสีเทาในเลเยอร์ "Shade" ไปทางด้านขวาบนเล็กน้อย โดยในตัวอย่างนี้วางไว้ที่อยู่ที่ X:-98,Y:-198 จากนั้นเลือกทั้งรูปทรงกลมทั้งสองอันที่อยู่ในเลเยอร์ "Shade" นี้แล้วเลือกที่ Modify > Combine Objects > Punch

---

ขั้นตอนที่ 18. ความโปร่งใสของส่วนทึบ (Shade Opacity)

กดเลือกชิ้นส่วนเศษเสี้ยววงกลมที่ได้จากการตัดด้วย Punch ในขั้นตอนที่แล้วจากนั้นกด  F8 เพื่อเปลี่ยนให้กลายเป็นซิมโบล โดยตั้งชื่อว่า "mc_ball_shading" และเลือก registration ให้ตั้งอยู่ที่จุดตรงกลาง แล้วค่อยเลือก Blend: Multiply

เมื่อกดปุ่ม F12 จะได้ผลดังนี้

---

ขั้นตอนที่ 19. ตบแต่งลวดลายให้บอล (Ball Details)
สั่งล็อกและซ่อนเลเยอร์ "Shade" แล้วจากนั้นไปที่เลเยอร์ "Ball Spinning" แล้วสั่งยกเลิกการล็อก

สั่งแปลงเป็น "mc_ball_base." จากนั้นแล้วดับเบิ้ลคลิกเพื่อแก้ไขแล้ววาดตบแต่งรายละเอียดของลูกบอลตามต้องการโดยในตัวอย่างนี้วาดลายด้วยสี #f3643c

โดยเมื่อใส่ตบแต่งเสร็จแล้วจะได้ลูกบอลลักษณะคล้ายในภาพข้างล่างนี้

ซึ่งเมื่อตบแต่งลายของลูกบอลเสร็จแล้วก็ให้สั่งยกเลิกการล็อกเลเยอร์ "Shade" เพื่อลองดูผล

เมื่อกดปุ่ม F12 จะได้ผลดังนี้

---

ขั้นตอนที่ 20. เพิ่มคีย์เฟรมในซิมโบลลูกบอล (As the Ball Turns)
โดยเลือกเฟรมที่ 32 ของทั้งเลเยอร์ "Shade" และ "Ball Spinning" แล้วกด F6 เพื่อสร้างคีย์เฟรมดังรูป

---

ขั้นตอนที่ 21. ใส่การหมุน (Rotational Tweening)
สร้างการหมุนให้บอลโดยเลือกเฟรมอันไหนก็ได้ที่อยู่ตั้งแต่เฟรมที่ 2 ถึง 31 ของเลเยอร์ "Ball Spinning" แล้วในเมนู Properties Inspector ตั้งค่าดังนี้
Tween: Motion
Rotate: CW 1 times

---

ขั้นตอนที่ 22. จากนั้นกดบันทึกไฟล์ก็เสร็จแล้ว โดยเมื่อกดปุ่ม F12 จะได้ผลดังนี้



Credit: http://vector.tutsplus.com/tutorials/animation/illustrate-and-animate-a-bouncing-ball-part-1-adobe-flash/