วาดสติกเกอร์ไลน์ใช้เอง และเพื่อขาย

ปรับปรุง : 2565-03-30 (แบบที่สาม)

ความเป็นมาที่เริ่มวาดสติ๊กเกอร์ไลน์ 3 ชั่วโมง

หลายปีมานี้ มอบหมายงานใน วิชาสื่อและเทคโนโลยีสารสนเทศ ให้นิสิตใช้ Powerpoint วาดภาพแบบ Vector ได้ผลงาน คือ ภาพตนเอง กับภาพการ์ตูน ส่วนวิชาโค้ดดิ้งหลายวิชาก็จะเขียนคำสั่งวาดภาพเรือ ภาพรถ หรือโดราเอมอน ทำให้นึกถึงภาพแบบ .svg ที่ save as ออกมาจาก .ppt ได้ ส่วนงานมอบหมาย infographic ในวิชาคอมพิวเตอร์เบื้องต้น ก็มักต้องใช้การวาดภาพแบบ Vector ซึ่งเครื่องมือที่เป็นที่นิยมในกลุ่มมืออาชีพ คือ Adobe illustrator แต่การใช้ Powerpoint ซึ่งเป็นเครื่องมือประจำเครื่อง ก็เป็นทางเลือกที่น่าสนใจ ประกอบกับพบภาพ Sticker มากมายที่เป็นแบบ Vector ที่นิสิตน่าจะต่อยอดบทเรียนไปวาดภาพตนเองเป็น Line Sticker ไว้ใช้งานใน Line ได้
เมื่อต้นมกราคม 2565 ได้คุยกับนิสิต M.Ed. มีงานมอบหมายเป็น Poster และ Brochure พบว่า มีนิสิตเลือกใช้ Adobe Illustrator และบางท่านก็มี Avatar เป็นภาพประจำตัว ทำให้กลับมามองภาพ Avatar ที่เคยทำไว้เมื่อหลายปีก่อน และคิดว่าน่าจะถึงเวลาอัพเกรดภาพ Avatar เข้าไปอยู่ใน Line Sticker จากการศึกษาการวาดภาพ Sticker พบว่า มีเครื่องมือมากมาย แต่สุดท้ายระบบของ Line ต้องการภาพแบบ Transparency ขนาดไม่ใหญ่นัก จำนวนภาพเริ่มต้นที่ 8 ภาพ จึงลองวาดภาพตัวอย่างง่าย ๆ ด้วย Powerpoint แล้วจัดการแปลงเป็น Transparency ด้วย Irfanview
ลงมือวาด ตั้งใจให้เสร็จใน 3 ชั่วโมง นับตั้งแต่เริ่มต้นเข้าระบบ ไปจบที่ส่งผลงานให้ Line จนถึงขั้นตอน "รอการพิจารณา" 1) เข้า creator.line.me เพื่อจะส่ง sticker ไปขาย โดยใช้ line account ที่ผูกกับอีเมลแล้ว ซึ่งขั้นตอนนี้ไม่ยาก กรอกข้อมูล และยืนยันไปตามปกติ 2) ต้องเลือกบัญชีที่จะรับเงินว่าจะใช้ Paypal หรือ Rabbit line pay ซึ่งผมเลือก Line pay ในขั้นตอนนี้จะตรวจสอบบัตรประชาชน ถ่ายรูปบัตรประชาชน และสแกนใบหน้าจนกว่าจะตรงกัน คล้ายกับแอปเป๋าตัง หรือ Bitkub 3) ใช้ Powerpoint สร้างภาพจำนวน 8 รูปสติกเกอร์ + main คือ รูปภาพหลัก และ tab คือ รูปภาพแท็บห้องแชท รวมเป็น 10 ภาพ แล้วส่งออกเป็น .png แล้วไปปรับขนาดใน Irfanview รวมถึงลบพื้นหลังในขั้นตอนนี้ 4) อัพโหลดทีละภาพ หรือรวมภาพทั้งหมดเป็น .zip แล้วอัพโหลดครั้งเดียว
#ห้องเรียนแห่งอนาคต
คุณครูและโรงเรียน จะมีเอกลักษณ์หลายรูปแบบที่สะท้อนตัวตนของสถาบันที่เด่น
สิ่งหนึ่งที่ใช้เป็นสัญลักษณ์ได้ คือ Line sticker

การแก้ไข Title ของ Sticker ที่ On Sale แล้ว

พบว่า Sticker ที่จำหน่ายไปแล้ว มี Title ผิดตามหลักไวยากรณ์ภาษาอังกฤษ ตรวจสอบด้วย grammarly.com จะได้มั่นใจว่าผิด หรือถูก จึงต้องการแก้ไข แต่ส่งผลให้ต้องหยุดขาย และส่งไปตรวจสอบใหม่ ก่อนจะเปิดขายใหม่อีกครั้ง มีขั้นตอนดังนี้ เริ่มต้นจากเข้า MY PAGE, Manage Items พบ Version 1, พบ Title หรือ Sticker Description ที่ต้องการแก้ไข, คลิ๊ก Stop Sale, คลิ๊ก Edit, เปลี่ยนจาก a man talk with his friends เป็น A man talks with his friends แล้ว Save, แล้วส่ง Request เพื่อ Review ใหม่, ส่งผลให้สถานะเปลี่ยนจาก On Sale เป็น Waiting for Review และ Sales Stopped, ต่อจากนี้ก็รออีกไม่นาน คาดว่าประมาณ 1 - 2 วัน และผลการแก้ไขจะพบว่าเป็น Version 2 โดยติดตามความคืบหน้าจาก LINE Creators Market และ e-mail ที่จะส่งข้อความให้ผู้สร้างผลงานได้ทราบความก้าวหน้า
Your sticker .. (ระยะเวลาดำเนินการพิจารณา)
review request has been submitted : Feb 18,2022 - 18:51
has been review and approved : Feb 19,2022 - 9:31
are now on sale : Feb 19,2022 - 11:45

ข้อเสนอแนะ และข้อควรแก้ไข

คุณครู

รับวาด

รุ่น 1

รูปแท็บ

ต้นฉบับ

เพื่อนมีข้อเสนอแนะเพื่อการพัฒนา

1. บอกว่า "ไปต่อได้อีก"
2. บอกว่า 8 รูป 35 บาท แพงไปนะ
3. บอกว่า "น่าจะมีแบบอีกเยอะ ๆ"

ข้อบกพร่องของ v1 และ v2

1. ลืมกำหนด transparency เพราะเร่งรีบในการปรับ size ให้ระบบยอมรับ ต่อมาจึงใช้ขั้นต่ำ 240px
2. จำนวน 8 รูปน้อย เพราะเป็น minimum แต่อัพได้ถึง 40 รูป
3. ตัวอักษรเล็กเกินไป ต้องออกแบบใหม่
4. กำหนด 240px*240px ซึ่งขยายได้ถึง 370px*320px
5. พบไวยากรณ์ภาษาอักกฤษผิด
6. คำในภาพไม่สวย เช่น ขอบคุณ ควรเป็น ขอบคุณครับ
7. transparency ติดขาวมา

วาดสติ๊กเกอร์ แบบ hello world ส่งขาย 35 บาท

ช่วงสายของวันที่ 9 ก.พ.65 ได้สมัคร Line Creators Market เพื่อวาดไลน์สติ๊กเกอร์ส่งขาย โดยค้นข้อมูล แล้วศึกษาขั้นตอนต่าง ๆ ดังนี้ 1) การสมัครและขาย Line Sticker 2) การสมัคร Line pay 3) การสร้าง Line sticker แบบ PNG 4) การอัพโหลด Line sticker 5) การซื้อ Sticker ของตนเองมาใช้
แล้วเมื่อวันที่ 15 ก.พ.65 ก็ได้รับแจ้งผ่านอีเมลว่า Your stickers are now on sale โดยขั้นตอนดำเนินการดังนี้ 1. ใช้ Powerpoint วาดภาพ (ผมไม่เลือกใช้ภาพถ่ายครับ) 2. กำหนดขนาดกว้างยาวมากกว่า 240px 3. บันทึกเป็น png (อันที่จริงผมสนใจ .svg ซึ่งเป็น code) 4. สร้างภาพขึ้นมา 8 ภาพที่เป็น sticker (มีเพื่อนทักว่าจำนวนน้อยไป) 5. อัพโหลดแล้วรอขาย (กรณีของผมรอ 6 วัน)
สำหรับการทดสอบบันทึกภาพ .png แบบไร้พื้นหลัง (Save Transparency as Alpha channel + etc.) เปรียบเทียบกัน ที่ burin_2565.htm โดยผลงานที่อัพโหลดเป็นภาพเซต burin1 นี้ นับได้ว่าเป็นชุดแรกที่ต้องการเรียนรู้ระบบของ Line Creators Market แต่ผมไปพะวงเรื่องขนาดกว้างยาวที่ระบบยอมรับ เมื่อแก้ไขจนพบขนาดที่ accepted แล้ว ในขณะอัพโหลดนั้น พบว่า ลืมลบพื้นหลังทำให้ภาพมีพื้นสีขาวอย่างที่เห็น หลังอัพโหลดได้กลับมาทดสอบเปรียบเทียบระหว่าง iview alpha และ remove.bg พบว่า iview ลดขนาดได้มากกว่า และคุณภาพดีกว่า มีตัวอย่างใน burin_2565.htm
ค้นสติ๊กเกอร์ด้วย burin rujjanapan

ต้นแบบ Sticker line แบบที่ 3 มาแล้ว

เริ่มต้นด้วยความรู้สึกอยากวาด Sticker line ไว้ใช้งาน จึงลงมือวาดการ์ตูนอย่างง่าย จำนวน 8 ตัว แล้วส่งขึ้นไปขาย ตั้งชื่อว่า burin1 พบว่าไม่ค่อยสวย ตัวหนังสือเล็กมาก อ่านยาก ตัวการ์ตูนอยู่ในพื้นสี่เหลี่ยมสีขาวที่ไม่เป็น transparent ได้เก็บข้อเสนอแนะของเพื่อน ๆ ไว้ในใจ เพื่อนำมาปรับปรุงรุ่นใหม่
เมื่อรวบรวมปัญหาได้ระยะหนึ่ง จึงได้พัฒนาเป็น Sticker แบบที่สอง ในชื่อ A man talks with his friends ในเซตนี้มี 40 ตัว จำหน่ายราคาเท่าเดิมคือ 35 บาท ปัญหาที่มองเห็นในแบบที่สอง คือ รายละเอียดที่ขอบของตัวการ์ตูนและตัวหนังสือ ไม่เป็นแบบ anti-aliased จะเห็นรอยขอบยึกยักไม่สวย เนื่องจาก sticker มีขนาดเล็กบนโปรแกรม line จึงแสดงปัญหาให้เห็นได้ไม่ชัดเจน
งานวาดเริ่มต้นด้วย MS Powerpoint แล้วใช้เครื่องมือวาด คือ Shape, Curve เป็นส่วนใหญ่ในการวาดตัวการ์ตูน โดยกำหนด Page setup เป็น 9.79*8.47cm จากนั้นบันทึกเป็นแบบ .emf ซึ่งมีรายละเอียดของเส้นที่ชัดเจนมาก บน resolution ขนาด 2313*2001px [emf]
วิธีแรก เมื่อได้แฟ้ม .emf แล้ว ใช้ Ms office 2010 (Win8) สำหรับเปิดภาพ แล้ว export เป็นแฟ้ม .png พร้อมกับลดขนาดเหลือ 370*320px [png] จากนั้นใช้ Irfanview เปิดแฟ้ม .png แล้วสั่งบันทึกเป็น .png โดยเลือก Check : Save Transparent Color จากนั้นโปรแกรมจะถามให้คลิ๊กสีที่ต้องการทำ Transparent ก็จะได้ภาพ .png ที่เป็นแบบ Transparent ตามที่ต้องการ [png]
วิธีที่สอง เปิด .emf ด้วย irfanview เลือก Image, Resize/Resample เปลี่ยนขนาดเป็น 370*320px แล้วกำหนด Size method เป็น Resample เป็น Lanczos (slowest) แล้วสั่งบันทึกเป็น .png แบบ transparent แบบขั้นตอนแรก พบว่า มีผลลัพธ์ไม่ได้คุณภาพที่ต้องการ รอยของภาพเป็นฟันปลา [png]
วิธีที่สาม ทำแบบวิธีที่สอง แต่เปลี่ยนการกำหนด Size method เป็น Resample เป็น B-Spline พบว่า คุณภาพของภาพตามรอยขอบ ให้ผลดีไม่ต่างจากวิธีแรก ซึ่งต่อไปก็คาดว่าจะทำ sticker ด้วยการเตรียมตัวการ์ตูนด้วยวิธีนี้ [png]
line.me
instagram.com
twitter.com
tiktok.com
fanpage
blog

"ไม่เริ่มต้นในวันนี้ จะไม่มีทางสำเร็จในวันพรุ่ง" โดย โยฮัน ว็อล์ฟกัง ฟ็อน เกอเทอ

Thaiall.com

Truehits.net