前言:
製作向量動畫或是所謂的2D Motion Graphic對於向量圖形的操作都非常吃緊。因此有些基本功與觀念要先釐清。 因為製作向量動畫排開其他套裝軟體,主流工具還是After Effect為主,因為Adobe 工具幾乎在設計界是寡占市場,因此從最源頭的2D向量圖形製作變成是做2D MG最基本的起手式。
本文找了一些對於向量控制的觀念與基本的技法,先讓有興趣的初學者了解一下,若有興趣可以在自己深造。但無論如何,技多不壓身,2D設計中的向量曲線控制技法,在設計師生涯中,會用到很多,是很直得投資時間的必備技能。
接著我們來看看本文幫大家收集的必備影片。
Paths vs Compound Path vs Shapes
本影片帶大家了解路徑、複合路徑與形狀之間的異同。
Simplify Path


優質的技巧Simplify可以幫助描圖降點或是幾何圖形的標準化,都能得到很好的效果,一個指令完成。
低解析度點陣Logo轉成Vector向量高清Logo
常見遇到的難題,低解析度的Logo,轉換成向量高清Logo,但這邊會特別收錄這個技巧,主要其實是要讓大家手繪的物件,例如你想做成2D MG的角色,可以用紙筆畫出後,直接拍照,然後用這技巧,只要筆畫夠黑,也能有機會直接將手稿轉成漂亮完整的向量線框,希望大家舉一反三。
這邊用的範例是Envato的低解析Logo。這邊有個重點就是要轉成灰階。

先做高斯模糊,讓最黑跟要黑不黑的地方,用高斯產生色階的融合。

簡單透過圖層上的曲線效果,將曲線左邊與右邊都濾掉,此時就會留下漂亮完整的輪廓。

接著再把向量轉回選取區域,直接填入顏色即。

雖然萃取了重點,但有興趣深入的人,可以花時間再看一下。
結論:
此次分享的三個小技能,其實只是為了動態向量動畫做準備,而動態向量動畫可做MG以外,還能幫UI製作Splash或是介面轉場(Transition)的效果。雖然是基本功,但看完就會知道,對未來我們要做的動態圖形是有幫助的。