PerfectVector
โดย Irene Kimอ่าน 3 นาที

เปลี่ยนไฟล์ ICO เป็น SVG ที่แก้ไขได้อย่างไร

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

ในหน้านี้

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

วิธีนี้กู้ favicon เครื่องหมายแอป หรือไอคอนส่วนติดต่อเก่าให้สะอาดได้เมื่อต้นฉบับออกแบบหาย แต่คืนเส้นโค้งหรือรายละเอียดที่ไม่เคยมีในบิตแมปใหญ่ที่สุดไม่ได้ หากทำได้ให้หา SVG, AI หรือไฟล์ต้นฉบับเดิมก่อน ลากเส้น ICO เมื่อการกู้เป็นทางเลือกเดียวที่ทำได้จริง

หากต้นฉบับที่หายเป็นไฟล์ Mac .icns แทน Windows .ico ใช้ เครื่องมือแปลง ICNS เป็น SVG เพื่อให้ตรวจภาชนะไอคอนถูกชนิดก่อนลากเส้น

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

ภายใน ICO มีอะไร?

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

จึงเกิดปัญหากู้สองอย่าง:

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

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

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

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

ดึงออก ห่อ ลากเส้น หรือวาดใหม่?

การทำงานเหล่านี้สับสนกันได้ง่าย:

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

ทดสอบเร็วหลังแปลงออนไลน์: เปิด SVG ซูมและเลือกงาน กรอบเลือกเดียวขนาดภาพหรือขอบเป็นบล็อกเมื่อซูมหมายถึงพิกเซลถูกห่อ รูปแยกและจุดควบคุมหมายถึงได้งานลากเส้น

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

PerfectVector เลือกต้นฉบับ ICO อย่างไร

PerfectVector ตรวจสารบบ ICO และข้อมูลที่อ้างอิงก่อนถอดรหัส รองรับตัวแทน PNG นิ่งและตัวแทนบิตแมป Windows ไม่บีบอัดที่พบบ่อย จากรายการถูกต้องที่รองรับ เลือกตามกฎตายตัว:

  1. พื้นที่พิกเซลใหญ่ที่สุด;
  2. ความลึกบิตสูงกว่าเมื่อพื้นที่เท่ากัน;
  3. PNG เมื่อพื้นที่และความลึกเท่ากัน;
  4. ลำดับในต้นฉบับที่มาก่อนเป็นเกณฑ์สุดท้าย

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

ข้อมูล PNG เคลื่อนไหวภายใน ICO ไม่ถือเป็นไอคอนนิ่ง และไฟล์เคอร์เซอร์ CUR เป็นรูปแบบแยกที่มีพิกัดจุดฮอตสปอตในรายการสารบบ ตาม เอกสารอ้างอิงรูปแบบไฟล์ทรัพยากรของ Microsoft สิ่งเหล่านี้ไม่อยู่ในขั้นตอนนี้

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

กู้ไอคอนทีละขั้น

1. หาต้นฉบับหลักที่ดีกว่า

ตรวจคลังโค้ดเว็บไซต์ ทรัพยากรแอป โฟลเดอร์แบรนด์ ไฟล์ออกแบบเก่าที่ส่งออก และผู้สร้างไอคอน SVG, AI, EPS, PDF ที่มีพาธจริง หรือแม้ PNG โปร่งใสขนาดใหญ่เป็นต้นฉบับดีกว่า ICO ที่ทำสำหรับหน้าจอเล็ก

2. ดู ICO หลายขนาด

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

3. ตัดสินว่า SVG ที่กู้จะใช้ทำอะไร

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

4. แปลงตัวแทนที่ดีที่สุดเป็นเวกเตอร์

อัปโหลดไฟล์เข้า เครื่องมือแปลง ICO เป็น SVG PerfectVector เลือกรายการใหญ่ที่สุดที่รองรับ ปรับให้อยู่ในรูปแบบมาตรฐาน และลากไอคอนเป็นพาธ

5. ตรวจ SVG เป็นงานภาพ

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

6. ทดสอบไอคอนทั้งขนาดใหญ่และเล็ก

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

สิ่งที่ไม่ควรลากตามตรงตัว

พิกเซลขั้นบันได

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

ขอบสีลบรอยหยัก

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

การปรับการมองเห็นขนาดเล็ก

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

ลายตารางหมากรุกที่ทาไว้

ลายตารางภายในภาพไม่ใช่ความโปร่งใส หากฝังอยู่ในพิกเซล ICO จะลากเป็นสี่เหลี่ยม คู่มือพื้นหลังโปร่งใส อธิบายการแยกอัลฟาจริงจากพิกเซลพื้นหลังที่ทา

เมื่อใดวาดใหม่ด้วยมือดีกว่า

วาดใหม่เมื่อ:

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

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

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

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

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

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

ทำไมผล ICO เป็น SVG ยังเป็นพิกเซล? เครื่องมืออาจฝังบิตแมปในเปลือก SVG แทนลากพาธ เปิดไฟล์ในโปรแกรมเวกเตอร์ หากทั้งไอคอนเลือกเป็นภาพเดียว ยังเป็นราสเตอร์

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

PerfectVector แปลง CUR ด้วยไหม? ไม่ CUR คล้าย ICO แต่เพิ่มความหมายจุดฮอตสปอตของเคอร์เซอร์ ขั้นตอนกู้ ICO ไม่รับ CUR เสมือนไอคอนทั่วไป

แหล่งอ้างอิง

  1. Microsoft Learn — เกี่ยวกับไอคอน — อธิบายทรัพยากรไอคอนหลายขนาดและความลึกสี
  2. Microsoft Learn — รูปแบบไฟล์ทรัพยากร — กำหนดรายการภาพ ICO ข้อมูล PNG/DIB และช่องฮอตสปอตเคอร์เซอร์
  3. Microsoft Learn — ทรัพยากรเคอร์เซอร์ — อธิบายทรัพยากรเคอร์เซอร์และพิกัดฮอตสปอต
  4. PerfectVector — เครื่องมือแปลง ICO เป็น SVG — ระบุขั้นตอนเลือกต้นฉบับและลากเส้นปัจจุบันของผลิตภัณฑ์

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

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

เปลี่ยนไฟล์รูปภาพเป็น
SVG ที่แก้ไขได้