不論是各種平台的 UI 設計,Icons 都是相當重要的元素,跟圖片一樣平常就要多收集素材,可以利用阿湯整理過的懶人包,或是 Material iconsFontello 這些工具,今天介紹「loading.io」這個網站底下的資料庫,是以 loading 動畫為主的各種圖示,可以收藏自己喜歡的檔案或修改樣式後下載成 GIF 或 SVG 檔,放在自己的網站,讓版面更活潑生動。

loading.io 使用分享:

首頁看起來跟其他素材網很像,都是可輸入關鍵字搜尋,往下滑也有不少漂亮的圖檔,不同的有兩點,第一是它會動,第二是可編輯。

loading.io - 動畫圖示資料庫,線上製作、下載 GIF 及 SVG 格式的動態圖檔 01 8

隨便選個眼睛被遮住的範例好了,光顏色部分就可分別自訂四種配色、更改背景色,還有能使用自製調色版或色彩主題。

loading.io - 動畫圖示資料庫,線上製作、下載 GIF 及 SVG 格式的動態圖檔 02 11

內建上百種包含基礎、各大品牌、網站、電影或遊戲等主題,像幾部日本的知名動畫也有標準配色表。

loading.io - 動畫圖示資料庫,線上製作、下載 GIF 及 SVG 格式的動態圖檔 03 12

動畫效果也相當豐富,想要像方形、時鐘擺動、心跳、淡入淡出都沒問題。

loading.io - 動畫圖示資料庫,線上製作、下載 GIF 及 SVG 格式的動態圖檔 04 11

阿湯就改成用「你的名字」色版、滑入動作,再調整速度、尺寸、比例等細節,完成後選擇要下載成 GIF、SVG、PNG 等格式,或先儲存個人配置。

loading.io - 動畫圖示資料庫,線上製作、下載 GIF 及 SVG 格式的動態圖檔 05 10

不過很可惜,除了靜態圖檔之外其他動態圖示都要付費,有單次和年/月方案,有需求的朋友再考慮看看,免費下載的話使用時也必須標示出處哦。

loading.io - 動畫圖示資料庫,線上製作、下載 GIF 及 SVG 格式的動態圖檔 06 10

資料庫中還有各種實用主題,就算是不會動的純圖標也是蠻好看的,可以加入收藏。

loading.io - 動畫圖示資料庫,線上製作、下載 GIF 及 SVG 格式的動態圖檔 07 8

有興趣的話可以回到網站首頁看其他類別,像一些動態背景和文字動畫都很精美,看到最底下才發現竟然是台灣的團隊,很值得支持啊,進來逛逛吧。

loading.io - 動畫圖示資料庫,線上製作、下載 GIF 及 SVG 格式的動態圖檔 08 8

loading.io 相關資訊:

Categorized in:

線上工具/服務,

Last Update: 2018 年 08 月 16 日