in Technology

SVG Workflow in Windows 10

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

ผลคือ workflow ของเราเริ่มมีการใช้งาน SVG มากขึ้นตามมา ทั้งในแง่การมองหา (browse), ดูภาพ (view) และแก้ไข (edit)

จึงมาจดวิธีการจัดการ SVG workflow ที่ใช้อยู่ในปัจจุบัน (บน Windows 10)

  • Browse: ตัว Windows 10 เองยังไม่รองรับการแสดงผล SVG ในตัว ทำให้เห็นแต่ไอคอนไฟล์ว่างๆ ไม่มี thumbnail ประกอบ ทางออกที่ง่ายที่สุดแนะนำให้ใช้ PowerToys ของไมโครซอฟท์เอง แล้วเปิดฟีเจอร์ File Explorer add-ons เพื่อแสดงผล SVG
  • View: ตอนนี้เบราว์เซอร์ทุกตัวเปิด SVG ได้หมด ถ้าดูภาพอย่างเดียวก็ไม่ลำบากอะไรนัก ส่วนตัวแล้วใช้ Edge เป็น default viewer ของ SVG
  • Edit: แล้วแต่รูปแบบงานว่าต้องทำอะไรมากน้อยแค่ไหน ถ้าเป็นการแปลงภาพ SVG -> PNG ตอนนี้ใช้ GIMP รองรับในตัวแล้ว แต่ถ้าต้องการแก้ไขอะไรเยอะๆ หน่อย Inkscape ก็ติดตั้งได้จาก Microsoft Store โดยตรง ไม่ต้องลำบากติดตั้ง-ตามอัพเดตเอง

ตัวอย่างหน้าตาของไอคอน SVG ที่แสดงผลด้วย PowerToys ใน File Explorer