ทำเอฟเฟคไฟลุกแบบไม่ยาก by

30
Apr
0

เคยมั้ยลองวาดไฟไม่เหมือนไฟเลย ยากจัง นั้นมาลองวิธีทำไฟลุกกันแบบไม่ยาก ตามขั้นตอนต่อไปนี้กัน ^^
1 เริ่มแรกให้ทำการสร้างไฟล์ใหม่โดยให้พื้นหลังเป็นสีดำ ขนาดไหนก็ได้ขึ้นมา
01

2 ให้ทำการสร้างรูปขึ้นมา 1 รูป ในที่นี้ผมใช้สี่เหลี่ยมผืนผ้าแนวตั้ง
02

3 เมื่อสร้างเสร็จให้ไปที่แทปคำสั่งด้านบน Filter > Blur > Gussian Blur โดยปรับค่า Radius = 1.0 pixels

4 จากนั้นให้ทำการหมุนภาพ โดยใช้ที่คำสั่ง Images > Rotate Canvas > 90 CW

5 ต่อไปกดที่คำสั่ง Filter > Stylize> Wind ให้ทำการปรับค่าตามภาพ (จากนั้นใหเกด Ctrl+F ซ้ำอีก 2-3 ที จะเป็นการทำเอฟเฟคเดิมซ้ำ)
03

6 หลังจากนั้นให้ทำการหมุนกลับมาที่เดิมโดยไปที่คำสั่ง Images > Rotate Canvas > 90 CCW

7 เพิ่มเอฟเฟคทำไฟเพิ่มโดยไปกดที่ Filter > Distort > Ripple โดยปรับค่า Amount = 300-500% ก็จะได้ดังภาพ
04

8 จากนั้นสร้างเลเยอร์ใหม่โดยใช้คำสั้ง Gradient(G) ไล่เฉดให้โทนแดงส้ม แบบ Foreground to Background ให้เป็นแบบนี้
05

9 เลือก Blending ของเลเยอร์เป็นแบบ Overlay
06

10 กลับมาใส่เอฟเฟคให้รูปสี่เหลี่ยม โดยใช้ Outer Glow ก็จะได้ดังภาพ
07
เสร็จแล้วกับเอฟเฟคทำไฟครับ

[Unity] ว่าด้วยเรื่อง Audio Compression Format หรือวิธีบีบอัด Audio ให้ไม่กิน Memory ขณะรัน by

30
Apr
0

ปกติแล้วเวลาเราใส่ Audio ต่างๆลงในโปรเจ็คแล้วสั่งเล่น ขณะรันจะพบว่าตัว Audio นั้นกิน Memory มากเกินควร ซึ่งทั้งๆที่ Source Audio ของเรานำเข้ามาเป็น MP3 ขนาดไฟล์ไม่ใหญ่แท้ๆ แต่พอนำเข้ามากลับมีกิน Memory ไปเยอะมากขณะรัน ซึ่งถ้าเรามาย้อนดู Inspect ที่ตัวไฟล์ตั้งแต่แรกนั้นก็จะพบว่า Audio ของเรานั้นมีขนาดมากกว่าตัวไฟล์จริงๆ ซึ่งเกิดจากเจ้า Unity ไม่ว่าจะนำ Audio ใดๆก็ตามเข้ามาจะพยายามแกะให้เป็น Audio ที่ Decompress (ไม่บีบอัดเลย) ขณะรัน ซึ่งก็เหมือนกับเราเอา WAV ไฟล์มาใส่ตรงๆนั่นแหละครับ พอ Decompress ไฟล์ก็จะบานออกทำให้กิน Memory มากขึ้นนั่นเอง เราจึงต้องทำการปรับ Setting ใน Inspect ให้เรียบร้อยก่อนการรันนั่นเองครับ

จากรูปด้านบน ที่ใต้สุดของรูปจะเห็นได้ว่า ขนาดของ Audio ตัวนี้กลายเป็น 10.3 MB ซึ่งขนาดจริงมีเพียง 2.7 MB ซึ่งสิ่งที่เราต้องเช็คคือ Load Type และ Compression Format

ให้เราทำการเปลี่ยน Load Type เป็น Compressed In Memory ซึ่งจะทำงานตามชื่อมันเลยคือจะยัง Compressed (บีบอัด) อยู่เหมือนเดิมเวลาเก็บลง Memory แต่ ถ้าถามว่าอ่าวแล้วไม่มีข้อเสียเลยหรอ มีครับ การที่มันบีบอัดอยู่ใน Memory ก็แปลว่าการรันของมันจะต้องทำการแกะมาอ่านในทุกๆ Sample เสียงแทน ซึ่งจะใช้งาน Process มากขึ้น แต่ถ้าเพื่อแลกกับการทำให้ Memory ล้นจนเกมพัง ก็ยังถือว่าคุ้มครับ

ส่วน Compression Format มัน Default ไว้ที่ Vorbis อยู่แล้วให้ทิ้งไว้แบบนั้นครับ Format อื่นๆ แทบจะไม่ได้ลดขนาดลงเท่าไรเลยครับ และ Quality แนะนำว่าเต็มไว้ดีแล้วครับ ลดลงจากนี้จะทำให้เริ่มฟังออกแล้วว่าคุณภาพเสียงตกลง

เมื่อปรับเรียบร้อย แถ่นแท้นนน 1.8 MB เองครับ

ว่าด้วยเรื่อง Texture Compression Format หรือวิธีบีบอัด Texture ให้เล็กลง by

30
Apr
0

ปกติเราทำเกมลงมือถือ เราอาจจะพบปัญหาเช่น apk ใหญ่เกิน 50MB เอาลง Google Play ไม่ได้ หรือ Memory ถูกกินไปหมดเครื่องโทรศัพท์ ซึ่งส่วนใหญ่แล้วที่กินพื้นที่ไปมากที่สุดก็ไม่ใช่อะไร มาจากรูปภาพที่ใช้ในเกมหรือ Texture ต่างๆ นั่นเอง ดูตามรูปด้านล่างเลย คือตัวอย่าง Inspector เมื่อคลิกที่รูปภาพ

texture_inspect

เปลี่ยน Texture Type เป็น Advanced ก็จะได้ดังรูป

texture_inspect2

เลือกที่ Format จะมีรูปแบบให้เลือกมากมาย (bpp = bytes per pixel)

  • Automatic Compressed – ตัวนี้หากไม่ได้กด Advance มันคือ Compress เฉยๆ ซึ่งจะเลือก RGBA 16 bit ให้อัตโนมัติ ใช้ได้กับรูปภาพทุกรูปแบบ ทุก device และรองรับ Transparent มีข้อเสียคือพวก Gradient สีจะเละมาก โดยสามารถกินพิ้นที่ 2 bpp
  • RGB DXT1 – ใช้สำหรับอุปกรณ์ที่รองรับ Direct X ซะส่วนใหญ่และอุปกรณ์ที่มีชิป Vivante, Nvidia กินพื้นที่ 0.5 bpp
  • RGBA DXT5 - ใช้สำหรับอุปกรณ์ที่รองรับ Direct X ซะส่วนใหญ่และอุปกรณ์ที่มีชิป Vivante, Nvidia กินพื้นที่ 1 bpp ใช้ transparent ได้
  • RGB ETC1 – รองรับในอุปกรณ์ Android ตั้งแต่ 2.3 ขึ้นไปทุกยี่ห้อไม่ว่าจะใช้ชิปเซ็ตใดก็ได้ เรียกว่ามีโอกาสใช้ได้ก็ใช้ไปเลย วิธีนี้มีข้อเสียหลักคือไม่รองรับ Transparent กินพื้นที่ 0.5 bpp
  • RGB PVRTC 2 bits – 0.25 bpp รองรับ ios ทุกรุ่น และ PVR ชิปเป็นหลัก
  • RGBA PVRTC 2 bits – 0.25 bpp รองรับ ios ทุกรุ่น และ PVR ชิปเป็นหลัก
  • RGB PVRTC 4 bits – 0.5 bpp รองรับ ios ทุกรุ่น และ PVR ชิปเป็นหลัก
  • RGBA PVRTC 4 bits – 0.5 bpp รองรับ ios ทุกรุ่น และ PVR ชิปเป็นหลัก
  • RGBA ATC 8 bits – 0.5 bpp รองรับชิปตระกูล Qualcomm
  • RGBA ETC2 8 bits – 1 bpp ชิป Mali จาก ARM
  • RGB + 1-bit Alpha ETC2 4 bits – 0.5 bpp ชิป Mali จาก ARM
  • ASTC ทั้งหลาย – ไม่แนะนำให้ใช้เนื่องจาก เครื่องที่ไม่ support จะกิน memory มากกว่าปกติเสียอีก

กล่าวโดยสรุปแล้วหากเป็นรูปที่ไม่มี transparent ควรใช้ etc1 สำหรับ android และ pvrtc สำหรับ ios ซึ่งสามารถแยกได้จาก setting ใน inspector ของตัว unity เองอยู่แล้ว แต่หากมี transparent อาจเลือกรูปแบบ RGBA สักอันที่ไม่ใช่ ASTC ซึ่งถึงแม้ว่า hardware จะไม่ support แต่ขนาด memory และพื้นที่ apk ที่ใข้ก็จะยังคงเล็กลงอยู่ โดยยังมีข้อเสียอยู่คือ unity จะใช้ software ในการ decode แทน ส่งผลให้การแสดงรูปช้ากว่าปกติ ซึ่งถ้ารูปที่โหลดติดหน้า Loading อยู่พอดีอยู่แล้วก็อาจจะไม่เป็นไรนัก ทั้งนี้ขึ้นกับผู้พัฒนาจะตัดสินใจเองว่าจะยอมให้รูปโหลดช้าลงเล็กน้อยแลกกับพื้นที่เก็บเล็กลงหรือไม่ หากยอมไม่ได้จริงๆ คงจะเหลือแค่ RGBA 16 bit เท่านั้นที่พอจะทำได้ แล้วแต่ตัดสินใจครับ ขอให้โชคดี :)

แปะสกรีนใน photoshop by

29
Apr
0

ช่วงนี้รับมอบหมายงานวาดการ์ตูน เลยไปหาวิธีทำสกรีนใน photoshop มา พอสรุปเป็นขั้นตอนง่ายๆ ดังนี้จ้า

1 เริ่มจากการตั้งค่ารูปเป็นขาวดำ แล้ว ถมดำส่วนที่ต้องการถมไว้

 

01

2 ใช้สีเทาทาในบริเวณที่อยากจะติดสกรีน จากนั้นเราจะเปลี่ยนบริเวณสีเทานั้นให้เป็นเม็ดสกรีน

ขั้นตอนนี้จะแยกเลเยอร์ไว้หรือจะใช้ selection ก็ได้ไม่รังเกียจนะจ๊ะ แต่ ของเราแยกเลเยอร์ไว้คนละเลเยอร์กับ เส้น

02

3 เข้าไปที่ เมนู filter >> pixelate >> colorhalftone

03

5 จะมีหน้าต่างขึ้นมาให้กรอกค่า ช่องบนสุดเป็น ขนาดเม็ดสกรีนที่เราต้องการ เล็กสุดที่ 4

อันนี้เราตั้งเล็กสุด

04

6  ส่วนสีเทากลายเป็นเม็ดๆ แล้ว

05

7 ใช้ยางลบ ลบส่วนเกิน หรือตกแต่งบริเวณไฮไลท์ เล็กน้อย เป็นอันเสร็จจ้า

06

วิธีสร้างกราฟง่ายๆด้วย Illustrator by

26
Apr
0

 

 

 

 

ที่จริงแล้ว Illustrator สามารถทำอะไรได้มากมายและย่นเวลาเราได้มหาศาลบานตะไทแบบใครๆไม่ค่อยรู้เพราะใช้อิลลัสไม่เป็น การทำกราฟก็เป็นหนึ่งในนั้น เรามาดูวิธีทำกันครับ

sample13a

1. เลือกเครื่องมือ Column Graph Tool หน้าตาดังในรูป

 

sample13b sample13c

2. เมื่อคลิกบนพื้นที่งานหนึ่งครั้งจะขึ้นหน้าต่างให้กรอกขนาดของกราฟ หรือจะใช้วิธีคลิกเม้าส์ค้างลากสร้างขนาดก็ได้

 

sample13d

3. เมื่อได้ขนาดของกราฟแล้ว จะขึ้นหน้าต่างให้กรอกข้อมูล

 

sample13e

4. คำสั่งภายในมีจากซ้ายไปขวา ตามลำดับดังนี้
Import data ใช้นำเข้าข้อมูลจากโปรแกรมอื่น
Transpose row/Column ใช้สลับข้อมูลระหว่าง แถว และ คอลัมน์
Switch X/Y ใช้สลับข้อมูลแกน X ,Y
Cell style ใช้กำหนดขนาดของแต่ละช่อง
Revert ย้อนการกระทำทั้งหมดทิ้ง
Apply อนุมัติโป้ง เอาไปใส่กราฟได้

sample13f

5. เราสามารถเลือกรูปแบบของกราฟที่ต้องการได้ด้วยการ double click ที่ Column Graph Tool ดังภาพ

ลองเอาไปเล่นดูนะ ฮิ้ว~

 

กู้เงิน | เศรษฐกิจพอเพียง | สินเชื่อบุคคล | สมัครบัตรกดเงินสด | สินเชื่อ | เงินกู้ด่วน | ยืมเงินทรูมูฟ | เงินด่วนนอกระบบ