
造型家族:變形‧扭曲‧潤飾
Transforming, Twisting & Decorating Visual Design
PhotoImpact實作
數位出版/網路文創:識別標幟系統篇-知識美學/數位美學之建構方法
當前數位美工的最常應用就是視覺識別標幟系統,通常包括:標誌 (Logo, 標準字+標準圖案)、橫幅 (Banner)、縱意橫幅 (Web Doodle)、導覽 (Navigation),各式用途之系統化圖案、甚至衍生物品,如:圖示、卡片、貼圖、票證、文具、飾物、服裝…等,在縱意識別觀念興起後,識別系統物品又納入了各種年節禮品設計、在地紀念品設計,甚至由日用品延申到食品,如月餅設計。目前最ㄏㄤ的就是貼圖設計,而以標誌 (Logo)為系統中心且能具備「識別占有性」。
風格元件、風格物件
既為「系統」,各物品上必然會包括具「統一向面」的風格元件、風格物件。風格元件與風格物件都是建構風格的材料,只是風格元件結構比較完整,譬如標誌 (Logo)或其變形;而風格物件只是一個、或幾個具備一致性、聯想性的零件。
在網路識別標幟系統中,就應用目的還可簡分為:布景主題、圖示、與特用類型,其在達成主題性、系列性的要求相同;但在組合方法、與創意技術上,會因專用目的而有不同,介紹幾項範例如下:
網站視覺識別:布景主題‧橫幅導覽‧風格元件設計
VIS: Web Theme, Banner, Doodle, Navigation and Style Elements Design
網站視覺識別:圖示‧專用圖示‧多元圖示‧風格物件設計
VIS: Icons, Personal Icons, Creative Symbolic Icons and Style Objects Design
多元視覺識別:個人化社交卡‧貼圖‧票證‧禮品設計
VIS: Social Cards/Stickers/Tickets with Personal Visual Identity Symbols Design
物件統一與變化的建構
依據知識美學的統一與變化論,一個設計物件反復使用,會產生統一感,但同時,也會發生單調感。所以在一致的思想上,應再發揮不同變化,以形成家族型的物件。
標誌設計的變形與反相設計
標誌設計經常使用變形與反相技術,而反相實為變形的進階應用。
發展變化時,會維持「意涵元素」:如標準字、標準圖案的核心幾何物件,如「統合同心金環」等。
而會變化「結構元素」,包括:
變形:結構的平面、立體、度量…的改變。
扭曲:將以上物件,再以視角的變化扭曲,甚至超現實的扭曲。
潤飾:加底座、陰影…改變光線、材質、色調…等等。
長寬比變形
長寬比變形有2途徑。
〉編輯〉調整大小
可以改變長寬比,適用於上下、左右邊,相同平衡調整的設計。
注意:套用〈選取的物件〉
取消維持寬高比。
〉變形工具
〉扭曲
可以改變長寬比、製作橢圓形等,也可設計不平衡對比。
Photoshop
與 PhotoImpact 比較
在 Photoshop 中使用調整大小:
〉影象
〉影象尺寸
變形則為 <ctrl>+t
不改變角度‧改變長寬比
以上2種途徑,都使用旋轉扭曲改變長寬比,而會改變角度,如下例。
但如果只希望減少高度,不改變角度,如何作?
這不是工具與技術問題,而是設計技巧。
將物件的上下部分剪開,中間剔除,再合併頭尾如下。
陰影潤飾
〉物件〉陰影
注意:在基底上的圖形,即使選取,也不能加陰影。
必須先複製成為物件,再作處理。
扭曲變形
〉特效
〉扭曲
〉創意扭曲
範本欄第一個,是「復原」,點選後,可將原先的扭曲返回。
按〈垂設〉可全部重來。
〈扭曲控制〉
〈範圍〉即〈筆刷大小〉之效果。
〈程度〉是色彩改變的程度,愈小才能保持立體感,一般宜 <5。
〈距離〉為筆刷移動、每一點的距離。
〉腳本
可觀察歷次變形的過程。
〈不變形區域〉
注意:改變筆刷大小,會自動出現「+」號,變成不擬變形區域塗色模式。如工作係變形,必須將「+」號取消。
〈筆刷大小〉與〈扭曲控制〉之〈範圍〉效果與相同。
紅色:不變形區域的顏色。亦即先將不擬變形的區域塗色,顏色可置換。
眼睛:是否可看見已塗色區域。
+:開始塗色,並可增加區域。
-:將已塗色區域減除。
沒有「+ 、-」:才可以對預覽區內之圖形進行扭曲。
其他扭曲變形方法
PhotoImpact 還有其他多種扭曲變形方法,都在「扭曲」命令列之下,值得推薦作創意發揮的包括:
〉特效
〉扭曲
〉以曲線變形
〉創意變形
〉自訂特效
〉以格線變形
Photoshop 與 PhotoImpact 比較
Photoshop 的扭曲變形稱為「液化」:
〉濾鏡
〉液化
Photoshop 的「以格線變形」稱為「彎曲」,可適用處很多:
〉編輯
〉變形
〉彎曲
Photoshop 的扭曲多一種方法,稱為「移置」,宜用於服飾改創。
綜合變形
組成3D Logo 標誌後,可再作非對稱扭曲。
相同綜合變形規律,4個象限的成果如下。
![]() ![]() ![]() ![]() |
其他變化範例
![]() ![]() ![]() ![]() ![]() |
||||
![]() ![]() ![]() ![]() ![]() |
||||
![]() ![]() ![]() ![]() ![]() |
||||
![]() ![]() ![]() ![]() ![]() |
Photoshop
與 PhotoImpact 比較
Photoshop 的綜合變形有 2 套:
〉編輯
〉任意變形
即 8 點之長寬高變形。
〉編輯
〉變形
〉彎曲
為 9 宮格式、16 點變形。
Photoshop 的透視變形與剪裁合併稱為「透視裁切」:
〉工具箱
〉裁切工具
〉透視裁切工具
Banner Practice 橫幅實作
造型元件網站
iconsDB: http://www.iconsdb.com/blue-icons/triangle-icon.HTML




