
雖然網路上有非常多的免費插圖網站可以使用,但要找到一張完全符合需求的插圖並不容易,當你在尋找過程中可能會看到有點接近、但還差一點點的素材,這時候就會很希望有個編輯器能直接進行調整。之前曾介紹過「Vector Creator 線上自製創意插圖圖庫,匯出 PNG 和 SVG 格式」就是由 Icons8 推出的插圖產生器,可直接挑選樣式、加入素材元素並進行調整,快速製作出更符合期望的插圖圖案,而且也不容易和其他人重複。除此之外,Moose Photos 也是另一個可以自行製作圖庫相片的免費工具。
本文要介紹的「ITG.digital」是一個讓使用者自行設計插圖的線上服務,收錄超過 100 種不同的圖案(包括四種樣式風格),可以透過線上編輯器創造出各種插圖,像是調整每個人物、物件或背景圖片和顏色,也能移除插圖中的元件、替換或編輯角色,最後下載為 jpg、png 或 svg 格式。

ITG.digital 線上編輯器非常簡單易用,使用者無需額外下載或安裝軟體及應用程式,直接透過瀏覽器就能進行,超過 100,000 種組合隨意搭配,創造出來的素材圖片可以使用於任何地方,像是網站設計、應用程式開發、社群網站、投影片、貼紙或印刷品等等。要注意的是 ITG.digital 免費方案僅能下載 JPG 格式,使用時需要標示出處,而且有只能下載 100 個檔案的限制。
ITG.digital
https://itg.digital/
使用教學
STEP 1
ITG.digital 分為免費和付費方案,付費有月繳或一次支付一年,差別在於付費後可以下載的圖片格式為 PNG、JPG(免費只能下載 JPG),也具有可編輯的 SVG 向量圖檔,如果要無限制的圖片下載次數必須選擇年繳方案。

在開始使用 ITG.digital 前可以從首頁看到一些介紹,簡單來說,這個工具讓使用者自行製作和編輯插圖,可自訂性很高是它的特色,當然在使用前必須先註冊一個帳號,進入 Sign Up 註冊頁面依序填入姓名和 Email 並設定一組密碼就能開始使用。

STEP 2
這項服務的核心是一個名為 ITG.Builder 的插圖編輯器,剛開始時可以先輸入關鍵字,或從搜尋框底下找到你想使用的插圖或元件名稱,像是人物、動物、運動、辦公室、工作、旅行、美食或商業等等不同主題。

將頁面往下拖曳也能看到各種主題,每個主題下方會標示有多少個元件可以編輯調整,例如你不希望某個插圖中有這麼多的人、花草或道具,可以在編輯時將它刪除或替換成不同的物件,從右上角的「Style」可以切換不同的插圖風格,目前一共有四種可以使用。



STEP 3
點選後我們就會進入 ITG.Builder 編輯器,主要圖片在左側,右側是編輯調整的功能區。

操作方式很簡單,點選你要修改或調整的物件,右邊就會跳出可編輯的選項,例如在人物部分可以直接替換掉整個人物,或是編輯皮膚、衣物或頭髮顏色,選擇後會即時在左邊更新。

STEP 4
當然大範圍的背景也是插圖中非常重要的部分,一樣點選就會有其他類似的圖片可供選用,也能調整為不同的顏色。在 ITG.digital 裡很多元件都疊在一起顯示,多點選幾次會發現一些圖案可以拆成幾個部分,就有個別的修改調整選項。

比較特別的是在 ITG.digital 裡每個物件其實都是圖片,也可以單獨下載使用,舉例來說,我需要上面插圖裡的 404 Error 背景圖,點選後會以虛線圈選標示範圍,右上角會有下載及刪除功能,點選下載後就會看到對應的 JPG、PNG 或 SVG 格式下載按鈕。
不過免費方案一樣只能下載 JPG 格式,底下也會顯示出目前還剩餘多少可用的下載額度(雖然網站上沒有標示這個額度的重設時間,但我猜測應該是每月可用的數量而非永久額度)。

STEP 5
有些項目會有幾個可以替換的選項,下方也會配合出現建議顏色,但如果你需要其他顏色,依然可以點選最左側的調色盤功能來套用特定顏色。

當完成插圖的編輯設定後,點選「Download Illustration」即可下載,免費方案僅能下載 JPG 圖片格式,如果要取用 PNG 或 SVG 必須付費升級。

STEP 6
ITG.digital 當前有四種不同風格的插圖圖案,其中有一個以線條構成的插圖非常可愛,如果你想單獨取得元件的插圖,在 ITG.Builder 編輯器頁面往下拖曳就能看到。

元件也可以是一張非常可愛的插圖,但能調整的部分就比較少。

以上就是 ITG.digital 可自行設計插圖線上工具的簡單介紹,有興趣的朋友不妨親自去操作一下,要記得免費帳戶每月可下載的圖片限制為 100 張,僅限於 JPG 格式,如果要使用插圖必須要標示出處來源才算符合授權規範。
值得一試的三個理由:
- 提供四種風格、超過 100 個插圖圖案可自由組合調整
- 透過線上編輯器無需下載或安裝軟體,就能製作出獨特的插圖素材
- 每個元件都能單獨下載,支援 JPG、PNG 和可編輯的 SVG 格式