PerfectVector
โดย Jay Leeอ่าน 2 นาที

แปลงภาพเป็นเวกเตอร์ใน Boxy SVG: ลอกเส้นหรือนำเข้าพาธ?

Boxy SVG มีตัวสร้าง Vectorize เลือกลอกเส้น ปรับสไตล์เรขาคณิต หรือนำเข้า SVG แล้วตรวจพื้นที่ที่แก้ไขได้และช่องเปิดก่อนใช้งาน

ในหน้านี้

Boxy SVG ลอกเส้นภาพด้วยตัวสร้าง Vectorize ได้ ผู้พัฒนา ยืนยันว่าการลอกเส้นภาพเพิ่มเข้ามาในเวอร์ชัน 3.35.0 พร้อม Pixelate, Triangulate และ Primitivize คำแนะนำเก่าที่บอกว่าการลอกเส้นด้วยมือเป็นวิธีเดียวจึงตกหล่นสิ่งที่เพิ่มเข้ามานี้

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

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

เลือกเรขาคณิตที่คุณต้องการทำงานด้วย

Vectorize กับตัวสร้างอื่นมีจุดประสงค์กว้าง ๆ ร่วมกัน คือแปลงข้อมูลแรสเตอร์เป็นงานเวกเตอร์ แต่ตอบเป้าหมายภาพต่างกัน การอภิปรายเรื่อง Triangulate และ Primitivize ของผู้พัฒนา อธิบายการประมาณภาพด้วยเรขาคณิต รวมถึงการเลือกสามเหลี่ยมหรือสี่เหลี่ยมใน Primitivize

ใช้ความแตกต่างนี้เลือกจุดเริ่มต้น:

เป้าหมายของคุณวิธีเริ่มต้นการตรวจยอมรับผลลัพธ์
รักษาตราที่จำได้เป็นเส้นขอบแก้ไขได้Vectorizeเงารูปร่างและช่องว่างสำคัญยังอยู่
สร้างการตีความใหม่แบบเรขาคณิตสำรวจ Pixelate, Triangulate หรือ Primitivizeสไตล์เกิดอย่างตั้งใจและเรขาคณิตเหมาะกับการแก้ไขต่อ
เก็บงานผลลอกเส้นที่ทำจากที่อื่นแล้วเปิด SVG ใน Boxy SVGงานที่มองเห็นมีวัตถุเวกเตอร์ที่ใช้ได้
สร้างสัญลักษณ์เรียบง่ายใหม่ด้วยเส้นโค้งที่ควบคุมได้วาดด้วยมือโครงสร้างเป็นไปตามแบบที่ต้องการ

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

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

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

ลองลอกเส้นในโปรแกรมโดยไม่เสียต้นฉบับ

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

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

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

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

ตรวจช่องหูจับก่อนลดความซับซ้อนของพาธ

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

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

สำหรับตัวอย่างแก้ว ใช้การตรวจตามลำดับนี้:

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

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

นำเข้าผลลอกเส้นจากเครื่องมือเฉพาะเมื่อเหมาะกับงาน

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

คำอธิบายบน Google Play ที่ผู้พัฒนา Boxy SVG ให้ไว้ ระบุการแก้เรขาคณิต การดำเนินการกับพาธ การบันทึก SVG/SVGZ และตัวตรวจโค้ด SVG/CSS ซึ่งเป็นเครื่องมือเก็บงานที่มีประโยชน์ ไม่ว่าพาธจะมาจากการลอกเส้นในโปรแกรม การแปลงภายนอก หรือการวาดด้วยมือ

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

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

เมื่อใดการวาดด้วยมือหรือภาพแรสเตอร์เหมาะกว่า

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

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

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

Boxy SVG มีการลอกเส้นภาพอัตโนมัติไหม? มี ผู้พัฒนาระบุว่าตัวสร้าง Vectorize เป็นฟีเจอร์ลอกเส้นภาพที่เพิ่มในเวอร์ชัน 3.35.0 ตรวจรุ่นและเวอร์ชันหากหาไม่พบ แทนการพึ่งคำแนะนำเก่าที่บอกให้ทำด้วยมือเท่านั้น

Vectorize กับ Triangulate เหมือนกันไหม? ตอบเป้าหมายต่างกัน เริ่มจาก Vectorize เมื่อต้องการเส้นขอบที่ลอกมา สำรวจตัวสร้างเรขาคณิตเมื่อผลงานที่ต้องการเป็นการตีความแบบเหลี่ยมหรือสไตล์อื่น และตรวจว่าชิ้นส่วนที่ได้รองรับการแก้ไขที่ตั้งใจหรือไม่

แก้ SVG จากตัวแปลงเวกเตอร์อื่นใน Boxy SVG ได้ไหม? ใช้ Boxy SVG ทำงานกับเวกเตอร์ที่นำเข้าได้ ตรวจไฟล์ก่อน: SVG ที่มีเพียงบิตแมปฝังไม่ได้ให้เส้นขอบที่แก้ไขได้สำหรับภาพนั้น

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

แหล่งข้อมูล

  1. คำตอบของผู้พัฒนา Boxy SVG บน Mac App Store — ผู้พัฒนายืนยัน Vectorize และตัวสร้างอื่นในเวอร์ชัน 3.35.0
  2. การอภิปรายตัวสร้างเรขาคณิตโดยผู้พัฒนา Boxy SVG — คำอธิบาย Triangulate และ Primitivize จากผู้สร้าง ซึ่งแยกจากความเห็นผู้ใช้อื่น
  3. Boxy SVG บน Google Play — คำอธิบายผู้พัฒนาเรื่องการแก้ไข การดำเนินการกับพาธ การบันทึก และตรวจโค้ด
  4. W3C — กฎการเติมสี SVG 2 — วิธีกำหนดด้านในของพาธ
  5. W3C — เนื้อหาฝังใน SVG 2 — อ้างอิงภาพแรสเตอร์ภายใน SVG ได้

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

เพิ่มเติมจากบล็อก

เปลี่ยนรูปภาพเป็น
เส้นพาธเวกเตอร์ที่เรียบร้อยและแก้ไขได้