Convert to Vector ใน Scratch: ทำไมยังเห็นเป็นพิกเซล

ปุ่ม Convert to Vector ของ Scratch ไม่ได้ลากเส้นขอบคอสตูมบิตแมป แต่ย้ายกราฟิกแรสเตอร์เข้าสู่โหมดแก้ไขเวกเตอร์ ซึ่งยังอาจเป็นวัตถุภาพเดียว นี่คือเหตุผลที่คอสตูม PNG ยังดูเป็นพิกเซลได้หลังคลิก โค้ดตัวแก้ไขภาพ Scratch ปัจจุบัน คงวัตถุแรสเตอร์ไว้ระหว่างการดำเนินการนี้ ไม่ได้สร้างพื้นที่สีใหม่เป็นพาธ

สำหรับคอสตูมที่ต้องการปรับรูปทรงหรือเปลี่ยนสีเป็นส่วน ๆ คุณต้องมีรูปทรงเวกเตอร์ที่วาดหรือลากเส้นขึ้นใหม่ สำหรับพิกเซลอาร์ตที่ตั้งใจไว้ การคงบิตแมปอาจเหมาะสม เริ่มด้วยการตรวจคอสตูมที่เลือก แล้วเลือกระดับการสร้างใหม่ที่โครงการต้องการ

ปุ่มนี้เปลี่ยนอะไร

เปิดแท็บ Costumes ของสไปรต์และเลือกคอสตูมที่ต้องการตรวจ ปุ่มแปลงระบุโหมดที่สลับ ไปได้: Convert to Vector ปรากฏในโหมดบิตแมป ส่วน Convert to Bitmap ปรากฏในโหมดเวกเตอร์

การเปลี่ยนโหมดให้ชุดเครื่องมือแก้ไขที่ต่างกัน ไม่ได้หมายความว่าทุกวัตถุบนผืนงานมีเส้นขอบแก้ไขได้แล้ว คอสตูมเวกเตอร์อาจมีภาพแรสเตอร์อยู่ร่วมกับรูปทรงที่วาดเอง ความต่างพื้นฐานเหมือนที่อธิบายในคู่มือ SVG ที่มีภาพแรสเตอร์

เก็บสำเนาคอสตูมต้นฉบับก่อนทดลอง โดยเฉพาะการแปลงกราฟิกเวกเตอร์ที่วาดไว้เป็นบิตแมปจะทำให้เรขาคณิตแบนเป็นพิกเซล การสลับกลับภายหลังไม่ได้สร้างจุดเดิมขึ้นใหม่ ใช้ Undo หรือต้นฉบับที่เก็บไว้หากต้องการรูปทรงเหล่านั้นคืน

ตรวจคอสตูมสามวิธี

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

1. ตรวจเส้นขอบ ในคอสตูมสำเนา เลือก Reshape แล้วคลิกขอบครีบจรวด มองหาจุดที่ตามขอบนั้น แทนจุดจับรอบสี่เหลี่ยม หากกราฟิกจัดกลุ่มอยู่ ให้เลือกแล้วใช้ Ungroup เมื่อมี ก่อนตรวจส่วนหนึ่ง หากไม่แน่ใจว่าใช้ Reshape ถูกหรือไม่ ให้วาดวงกลมชั่วคราวข้างกราฟิกและเปรียบเทียบการเลือกของเครื่องมือ
2. ตรวจหนึ่งสี เลือกหัวจรวดแล้วลองเปลี่ยน Fill เปลี่ยนสีพื้นที่นั้นโดยไม่เปลี่ยนลำตัวหรือส่วนอื่นได้หรือไม่? เลิกทำการทดลอง การเลือกทั้งภาพไม่ได้ให้หัวจรวดที่แก้แยกได้ แม้รูปภาพจะแสดงหลายสี
3. ตรวจตรงที่จะปรากฏจริง เปรียบเทียบคอสตูมในตัวแก้ไขกับรูปลักษณ์บนเวทีที่ขนาดโครงการใช้ ความแก้ไขได้ของเส้นขอบกับความคมบนจอเป็นคนละการตรวจ ภาพตัวอย่างบนเวทีที่หยาบอย่างเดียวไม่ใช่เหตุผลเพียงพอให้ลากเส้นกราฟิกที่มีพาธใช้ได้อยู่แล้ว

สำหรับกรณีสุดท้าย วิธีวินิจฉัย SVG ที่ดูเป็นพิกเซล โดยรวมช่วยแยกเนื้อหาไฟล์ออกจากวิธีที่โปรแกรมแสดง

เลือกวิธีแก้ให้ตรงกราฟิก

เก็บบิตแมปเมื่อพิกเซลเป็นส่วนของแบบ

ตัวละครพิกเซลเล็กไม่ได้เป็นคอสตูมที่ดีขึ้นเพียงเพราะไฟล์เป็นเวกเตอร์ หากขอบขั้นบันได ตาเล็ก และชุดสีจำกัดเป็นสิ่งที่ตั้งใจ ให้ตัดสินที่ขนาดใช้งาน เก็บภาพต้นฉบับและเลี่ยงการปรับขนาดซ้ำขณะทดลอง

เช่นเดียวกับภาพถ่ายหรือฉากหลังลงสีที่พื้นผิวสำคัญกว่าการแก้เส้นขอบแต่ละส่วน การลากรายละเอียดเหล่านั้นเป็นรูปทรงเปลี่ยนกราฟิก หากต้องการรักษาพิกเซลสี่เหลี่ยมใน SVG นั่นเป็นคนละงานกับทำรูปร่างให้เรียบ คู่มือแปลงพิกเซลอาร์ต ของเราอธิบายทางเลือก

วาดคอสตูมง่ายใหม่ด้วยเครื่องมือเวกเตอร์ของ Scratch

สำหรับจรวดที่มีลำตัว หัว หน้าต่าง และครีบ การวาดแยกให้การควบคุมโครงสร้างโดยตรง เริ่มคอสตูมวาดใหม่ในโหมดเวกเตอร์ ใช้เครื่องมือวงกลม สี่เหลี่ยม เส้น และแปรงสร้างส่วนหลัก แล้วปรับเส้นขอบด้วย Reshape

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

ใช้ตัวแก้ไขเวกเตอร์ภายนอกสร้างรูปทรงได้ด้วย บทสอนเวกเตอร์อาร์ตสำหรับ Scratch ฉบับต้นทางของ Pinnguaq สาธิตการนำเข้ากราฟิก SVG เลือกองค์ประกอบ เปลี่ยนสีเติม และจัดองค์ประกอบ นี่คือโครงสร้างแก้ไขได้ที่ควรตั้งเป้า

ลากเส้นคลิปอาร์ตที่เหมาะเมื่อมีเพียงแรสเตอร์

การลากเส้นมีประโยชน์เมื่อมีภาพประกอบแบนที่ต้องการรักษา แต่การวาดทุกเส้นขอบใหม่เป็นงานไม่จำเป็น ใช้ PNG หรือ JPG ต้นฉบับที่ชัดที่สุด สำหรับวิธีนี้ PerfectVector สร้างคลิปอาร์ตที่เหมาะเป็นพาธ SVG ให้ตรวจก่อนนำเข้า Scratch ได้ เป้าหมายคือกู้คืนรูปทรงแก้ไขได้จากภาพต้นฉบับ คอสตูมยังต้องตรวจการแก้ไขภายหลัง

การลากเส้นตามพื้นที่ที่เห็น อาจแยกครีบเป็นหลายชิ้นหรือรวมพื้นที่สัมผัสกันที่คุณอยากย้ายแยก ตาเล็ก ช่องแคบ และตัวอักษรควรใส่ใจเป็นพิเศษ หากต้องการเข้าใจการสร้างใหม่นี้ เริ่มจาก คำอธิบายการแปลงภาพเป็นเวกเตอร์

นำเข้า SVG และตรวจศูนย์กลางคอสตูม

ตัวอัปโหลดคอสตูมของ Scratch รับ SVG เป็นกราฟิกเวกเตอร์ นำเข้า SVG ที่ดาวน์โหลดจริง แทนภาพหน้าจอหรือภาพตัวอย่าง PNG

1. เลือกสไปรต์เดิมแล้วเปิด Costumes ใช้ Upload Costume จากตัวเลือกคอสตูมเพิ่ม SVG ข้างต้นฉบับ ใช้ Upload Sprite แทนเมื่อต้องการสไปรต์แยก
2. เปรียบเทียบกราฟิกที่นำเข้ากับต้นฉบับ ตรวจเส้นขอบ ช่องระหว่างส่วน ตา และพื้นหลัง หากต้นฉบับมีรูปทรงเวกเตอร์อยู่แล้ว ให้ซ่อมหรือส่งออก SVG ใหม่ แทนลากเส้นภาพตัวอย่างแรสเตอร์
3. ตรวจเส้นขอบและสีเดียวซ้ำ ยืนยันว่าส่วนที่ต้องการแก้ได้ แล้วเลิกทำการทดลอง ลบรูปทรงเปรียบเทียบชั่วคราวจากสำเนาสำหรับทำงาน
4. ตรวจตำแหน่งเทียบกากบาทศูนย์กลางในตัวแก้ไขคอสตูม ใช้จุดอ้างอิงภาพเดียวกันสำหรับคอสตูมที่เกี่ยวข้อง สำหรับจรวดอาจใช้กลางลำตัว ปรับกราฟิกตามจำเป็นและเปรียบเทียบกับคอสตูมต้นฉบับบนเวที
5. สลับต้นฉบับกับตัวแทนโดยไม่ย้ายสไปรต์ มองหาการกระโดดที่ไม่ต้องการ ขนาดที่ดูเปลี่ยน หรือสี่เหลี่ยมพื้นหลัง เก็บต้นฉบับจนพอใจกับตัวแทน

Scratch เก็บศูนย์กลางหมุนของแต่ละคอสตูม โค้ดโหลดคอสตูม รับค่าจากตัวเรนเดอร์เมื่อไม่ได้ให้มา นี่คือเหตุผลที่ภาพวาดตรงกันเป็นเพียงส่วนหนึ่งของการตรวจนำเข้า ตำแหน่งเทียบศูนย์กลางคอสตูมต้องเหมาะกับโครงการด้วย

คำถามที่พบบ่อย

Convert to Vector ทำให้คอสตูม Scratch เป็นพิกเซลน้อยลงหรือไม่? ไม่ได้ลากเส้นหรือทำขอบบิตแมปให้เรียบ คอสตูมเปลี่ยนโหมดแก้ไข ขณะที่กราฟิกแรสเตอร์ยังอาจเป็นวัตถุภาพ หากต้องการเส้นขอบแก้ไขได้ ให้วาดใหม่หรือนำเข้า SVG ที่มีพาธลากเส้นแล้ว

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

การลากเส้นสไปรต์สร้างแขน ขา หรือส่วนเคลื่อนไหวแยกหรือไม่? อย่าสมมติว่าจะทำได้ การลากเส้นสร้างพื้นที่ที่มองเห็นขึ้นใหม่ ซึ่งอาจต่างจากส่วนที่ต้องการเคลื่อน ตรวจรูปทรงที่นำเข้าแล้วแยกหรือวาดองค์ประกอบใหม่ตามจำเป็น

แหล่งข้อมูล

1. Scratch Foundation: การทำงานของการแปลงบิตแมป — แสดงการแปลงสู่โหมดแก้ไขเวกเตอร์โดยคงแรสเตอร์ไว้
2. Scratch Foundation: ตัวอัปโหลดไฟล์คอสตูม — ยืนยันว่าการอัปโหลดคอสตูม SVG ใช้รูปแบบทรัพยากรเวกเตอร์
3. Scratch Foundation: การโหลดคอสตูมเวกเตอร์ — แสดงการกำหนดศูนย์กลางหมุนให้คอสตูมที่นำเข้า
4. Pinnguaq: ทำงานกับเวกเตอร์กราฟิกอาร์ตใน Scratch — สาธิตการนำเข้า SVG และแก้รูปทรง สีเติม และการจัดวางแต่ละส่วน

---

หากคอสตูมเริ่มจากคลิปอาร์ตแรสเตอร์แบนและต้องมีเส้นขอบแก้ไขได้ ให้ แปลงภาพต้นฉบับเป็น SVG ด้วย PerfectVector นำเข้าผลเป็นคอสตูมใหม่ แล้วตรวจหนึ่งเส้นขอบ หนึ่งสี และศูนย์กลางคอสตูมก่อนแทนต้นฉบับ