有時工作中總有「原始圖片太小」,放大使用卻又模糊失真,但又立即無法取得合適的向量素材時,就可以透過《Vectorizer》來幫你將 PNGJPGBMP 的圖檔轉為 SVG 向量圖,它是一款可以直接在線上轉圖的免費工具,並有「顏色多寡、相似度、模糊率、區域大小…等」設定來取得最佳向量化的圖檔。

Vectorizer 線上轉向量圖 (支援bmp、png、pdf、jpg...等)

●什麼是「SVG」圖檔格式?

「SVG」是可縮放向量圖形(英語:Scalable Vector Graphics,SVG)是一種基於可延伸標記式語言(XML),用於描述二維向量圖形的圖形格式。SVG提供的功能集涵蓋了巢狀轉換、裁剪路徑、Alpha通道、濾鏡效果、模板物件以及可延伸性。SVG嚴格遵從XML語法,並用文字格式的描述性語言來描述圖像內容,因此是一種和圖像解析度無關的向量圖形格式。 (※名詞解釋參考來源:Wiki – 可縮放向量圖形 )

intro_raster_to_vector

您可以發現轉為「向量化」的圖檔,即使「放大」後也不會有明顯的「鋸齒狀」

請支持《Kiwi LIFE》原創文章。原文標題:《Vectorizer》點陣圖轉向量圖,免費線上轉檔向量化的好幫手,原文網址:https://kiwislife.com/vectorizer-bmp-png-pdf-jpg-to-vector/

 

●《Vectorizer》向量化工具 – 簡介

簡單來說它就是一套「免費線上轉圖」工具,只不過是特別強調以「轉向量、向量化」的技術,Vectorizer 的強大可能不是只看下面這個簡單的圖像就能夠體會的!主要是它具備許多「自訂項目」,加上能夠「立即預覽」的功能,讓轉向量的工作,變得簡單又輕鬆。

vectorizer-bmp-png-pdf-to-vector_sample

這種簡單的色塊圖像轉向量的工具到處都有,也看不出技術性,所以後面的功能特色介紹,雙胞胎拔拔會用「實際照片」來向大家展示它的特別之處。

 

●《Vectorizer》向量化工具 – 兩大功能特色

01. 支援 PNG、BMP、JPEG 圖檔格式

vectorizer_support-images-format

雖然《Vectorizer》只有支援「PNG、BMP、JPG」三種格式,但已經涵蓋了大多數透過 Google 搜尋而來的圖檔格式,因此,可以說是具有非常高的應用價值。不過要特別注意的是「上傳檔案大小限制」,每次上傳的圖檔,只能在 1MB 以內唷!

您可能會想說… 可是我拿到的圖檔就是很大,那該怎麼辦?別擔心,這個工具的目的就是幫你轉為 SVG 向量圖,所以一旦向量化之後,無論您怎麼縮放圖片,都能夠保持清晰且不會有明顯的鋸齒邊緣。因此,您只需要將原圖的尺寸縮小,到「清晰可見」的合適尺寸,檔案就能夠小於 1MB 囉!

※支援效果最佳的圖片格式為「PNG」。

 

02. 即時預覽及自訂細節調整項目

vectorizer_setting

通常我們在轉換一般「色塊」為主的圖像時,不會有什麼太大的問題,不過一旦碰上「照片」等級的圖片時,複雜的色彩、曲線… 等,都可能讓轉換的過程,變成難以辨識及使用的向量圖,因此,《Vectorizer》在這個部分提供了「即時預覽」「自訂細節調整」的功能,讓整個向量化的轉換過程可以相當自由且富有彈性。

 

●《Vectorizer》只要五步驟 – 立即取得最佳化向量圖檔

vectorizer_5-step

  1. 逐步增色:在 Max Colors 選項中,慢慢增加顏色,直到所需要的顏色都出來即可。
  2. 相似分組:增加 Tolerance 的百分比,來自動將「相似顏色」分組,直到下方的 Layers 色塊分組,與期望的色相相同。
  3. 拖曳校色:從下方 Layers 將顏色拖曳到不同的色圈中,或是調整顏色的順序,來取得最佳色盤。
  4. 減少雜點:透過增加 Min Area 的數值,來讓相近的圖像、顏色區塊化,以獲得較少的向量物件輸出。
  5. 隱藏背景:透過點選 Layers 色圈的複選框(Check box),來隱藏圖像的背景顏色。

通常依照這5個步驟操作完成後,輸出後的 SVG 向量圖檔,還需要微調的比例會降低不少!

 

●《Vectorizer》圖像向量化 – 實測效果

拔拔在測試轉向量圖的過程中,PNGBMPJPG 三種格式都實驗過,雖然都能夠轉換為 SVG 向量圖,但確實支援度最高的還是官方指定的「PNG」圖檔格式,否則若採用其他格式的圖檔時,往往遇到稍微複雜一點的圖像時,區域性色塊很難被分離出來。

■測試用 PNG 原圖

redcar-original

為了實驗一下工具對於「漸層色、複雜曲線」的處理效果,拔拔選了一台「汽車」做為測試對象。

 

■ 黑白、彩色轉換向量的效果

redcar-color

在顏色方面的實測效果,由於彩色的轉換向量的過程中有「32色」,而黑白的只有「2色」,你就會發現「漸層」越多的原始圖像,在轉換為黑白之後,反而無法分開太過接近的漸層色,所以,比較好的做法是選用「4~8色」之間,來取得合適的「漸層色區塊」,待輸出為 SVG 向量圖後,再透過可編輯向量圖檔的繪圖軟體,為色塊重新上色。

 

■ 彩色原圖、灰階原圖 – 轉黑白向量的效果

redcar-color-1

透過上圖的結果,您會很明顯地看到「使用灰階」的原圖,能夠取得更好的向量結果,所以主要還是看實際需求是要應用在什麼地方?需要多少層次?需要多少顏色?再來決定取得向量圖的方式,才能夠得到最好的效果。

※特別提醒:

顏色越多,越容易因為色街上的判斷,產生雜色塊,雖然分層比較明確,但手動處理向量的幅度就會比較多,不過修飾過的圖,反而也會比較漂亮。

redcar-color-fix

透過「繪圖軟體」修飾過後的向量圖,是不是雜點變少了,線條也相對整齊漂亮呢?

《Vectorizer》介紹到這裡,是不是也解決了一些朋友工作上的困擾了呢?此工具沒有轉圖數量上的限制,不但可線上轉檔處理,最重要的是「完全免費」,算是設計師朋友們工作時的最佳幫手了!

(看到拔拔不太會畫圖的人,都能夠處理得如此漂亮,是不是自己也想要來試試看了呢?嘿嘿…)

 

●相關連結

○ Vectorizer – 線上轉圖向量化工具網址:
https://www.vectorizer.io/

○ FLATICON 超過37萬個彩色專業 icon 圖示:
https://kiwislife.com/flaticon-freeicon-download/

○ Freepik 逾43萬張專業圖片,製圖排版沒煩惱:
https://kiwislife.com/freepik-free-picture-download/

○ 其他實用的「工具軟體」:
https://kiwislife.com/category/tools/