視覺識別標幟系統 橫幅與透明檔
gif, png 實作
Visual Identity Systems Practice Banner
and Transparent gif, png
數位出版/網路文創:識別標幟系統篇-知識美學/數位美學之建構方法
當前數位美工的最常應用就是視覺識別標幟系統，通常包括：標誌 (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
橫幅在網站中幾乎必用，或是使用頂圖以包括橫幅的應用。雜誌使用橫幅比較有代表性的如：National Geography,讀者文摘等。
橫幅設計的實作，包括軟體內建範本修改法、網路或線上分享範本法，與完全自創個人化法。
PhotoImpact實作
以下先介述範本修改法，以 PhotoImpact 的橫幅元件設計師為設計製作工具。
Banner Design
橫幅設計：元件設計師法
>Web
>Objects Designer
>Banner and others
Note: Size of the standard web banner is : 600*80
The following size is for DTP A4 output.
配合「多元」學習理念，選擇彩虹造型。
應有預留嵌入標誌的區域。
框底簡單，色彩使用網站識別主色：理性的藍、黃互補色。
Modify the title.
如果是頁內橫幅，可以使用範本字；如果是封面、或強調各種自由使用，則另外加字。
Modify the colors.
Export it to a file for further uses.
匯出為物件。
Personalization 個人化改造
The original output looks like the following.
最好不要完全使用範本，而作個人化改造，如加上標誌。
物件組合
Chang the width to fit the page.
Use a blank file as the background.
Add a logo on it.
>Button
You have to use <arrow> to merge objects.
使用jpg檔，以避免產生透明重疊。
〉魔術棒
〉右鍵
在空白處點選、再〈改選未選取部分〉，則可選到物件、進行組合。
加上圖片字，完成組合。
gif, png File Processing/ 透明檔案 gif, png 處理技巧
數位美工最常用的就是 gif, png 檔案格式，其特殊技巧介述如下。
gif 可分作一般有背景檔案、和透明背景檔案。
gif 透明背景檔案最適合作「組合」，並因其可具備透明特性，可以縮小檔案容量，因此適合製作「gif 動畫」。
gif File Characteristics/ gif 檔與影象類型
影象類型包括：黑白、灰階、16色、256色、和全彩。
擅長美工線條，不是自然色，為了節省檔案空間，所以許多檔不一定是「全彩」類型。
但當前各種影象處理軟體編輯，預設對象都是全彩類型，遇到非全彩類型，便無法從事大部分編修，無法在檔案上應用各種工具。
所以必須先作影象類型轉換：
〉格式
〉影象類型
〉RGB 全彩
進一步解說可參考 PhotoImpact進階篇的「檔案轉換」。
gif Transparent File Output/ gif 透明檔案輸出
Since we are going to practice the use of gif files, we will export it to gif program.
However, it is also a good idea to export it into ufo files (the 2nd choice) or jpg files that are more flexible for advanced post production.
See Advanced Skills of PhotoImpact for more info.
Export it to gif file and make the background transparent.
Converting gif Transparent File/ gif 透明檔案處理
有背景的檔案不能直接以另存方式轉為，必須先開一個透明檔的「基底影象」，再將有背景檔案中的圖片，以物件的方式轉貼過去。
透明檔與寫字
不要在透明檔上直接寫字，效果可能不佳。
將組合完成之圖案透明檔轉為 jpg檔，再寫字。
Color palette 色盤缺色
When you are going to merge GIF files you want to use a empty file for the base image. If you paste one GIF file to another GIF file, it likely causes color loss since the conflict of the number of color index. An example is as follows.
用2個以上gif 組合，要先開一個全彩空白基底，分別加上去。否則互相組合，可能色盤數合計不足，發生缺色現象。
Reduce Size with gif/ 避免縮小
gif 檔
非「全彩」影象類型之gif 檔，縮小會變形。
先轉換為「全彩」再縮小，不過，最好重新以設計程式輸出所需尺寸。
橫幅設計：完全自創個人化法
先個別設計標誌、背景底框、加選擇性物件，然後進行組合。
範例：主題意涵：多元學習，嚮往智者樂水，故以「水」為識別標誌的背景風格，以水之藍色為主色。
由標誌、背景底框、加魚組成，標誌是第二主色：黃色；故魚採用第二主色之鄰近色：金黃色；而珊瑚為次鄰近色：紅系列之粉紅色。
大型橫幅，魚與珊瑚之比例可加大。
亦可再進一步作為動畫展示。
數位繪圖/數位美工範本分享資源
介紹數位繪圖/數位美工範本，分享資源如下。
透明檔元件網站
free png images: http://freepngimages.com/christmas-bell-gold-transparent-background/
pngimg: http://pngimg.com/
png all: http://www.pngall.com/
imagesbuddy: http://www.imagesbuddy.com/
造型元件網站
free icons png: http://www.freeiconspng.com/
find icons: http://findicons.com/
icon finder: https://www.iconfinder.com/
iconsDB: http://www.iconsdb.com/blue-icons/triangle-icon.HTML
視覺識別標幟系統與標準字設計
橫幅視覺識別系統化設計範例
其他視覺識別系統物件範例
