illustrator繪圖演繹

【認識工作環境】

第一冊 001

封面說明： ●買好書如同外帶一杯好咖啡，值得品味珍藏。 ●圓的造形結合濾鏡特效表現遠近效果，與讀者分享向量繪圖經驗。

多年來一直有許多朋友問我 :「你寫的書是給 PC，還是給 MAC?」這問題 有點像手排車和自排車有什麼不一樣 ? 通常，除非這套軟體只寫給單一作業系統，否則電腦工具書也是不分系統、 不分族群、省籍、還有 別的哦。 本書從繪圖以至編寫期間，一路上使用不同電腦及作業系統，因此讀者會 發覺書中提及的工具箱和浮 視窗會有不同的介面，這也是要向初次接觸 電腦的朋友說明，本書適用 PC/MAC 作業系統，事實上現今的軟體都有這 種適用 ，書中所提供的通常是 know-how 與概念與各位讀者分享。 PC 的 Ctrl 等於 MAC 的 Command 鍵 PC 的 Alt 等於 MAC 的 Option 鍵 此外實在沒有什麼不一樣。

002

引用商標聲明 : Illustrator、Photoshop 為 Adobe 公司的註冊商標。 本書繪圖的商品均為其所屬廠商的註冊商標絕無侵權意圖。 繪圖題材純屬插畫創作、教學示範，不影射任何立場，特此聲明。

【認識工作環境】

開始寫第一本書的時候正好碰到股市開始從萬點一 路跌落三、四千點，人人縮緊荷包消費行為更加保守， 對於新進作者而言首次要面對讀者嚴格的審判，電 腦工具書又有別於一般書籍有不斷升級的問題，這 時我一直深思要如何擺脫這些外在因素，讓一本電 腦工具書名留青史不隨軟體升級而走進歷史？

序

Preface 王銘滄 2003.12

軟體的升級可以簡化指令、強化作品更美好的視覺 效果，最令人在意的可能是結合網頁功能，支援更 多檔案格式，電腦幫助使用者完成更多的工作，但 滑鼠不可能自己會 ，指令不會自 執行，尤其是 越基礎的事情可能越要靠自己思想和雙手。例如； 內建更多的筆刷圖案 ( 或圖檔 )，有一天大家的作品 可能都一樣，工具人人會用但要做出一張圖就不是 某些新增功能可以幫助您了，變成電腦玩您而不是 您玩電腦了。 雖然有這麼多的先進朋友不斷的努力投入電腦資訊 出版，但買過合法軟體的朋友都知道，盒裝內附帶 的軟體指南才是鉅細靡遺的操作手冊，本書提出實 戰應用的繪圖技巧，使用基本工具一步一步引導讀 者完成日常生活熟悉的事物，讓您覺得 Illustrator 就是生活中的一部分、親切、不陌生，自然的朋友， 一套可以學習的軟體；一本可以傳世典藏的書。

作者 : 現職聯合晚報美術編輯，Illustrator 的 fans。 文化、實踐推廣教育部講師 萬能科大專技講師 網站 :http://issuu.com/wowsite 歡迎來信交流討論，聯絡過的朋友都知道作者有問必答。 wang50059@hotmail.com

003

Index 目錄

004

002 003 004 008 009 010 011 012 013 014 015 016

商標引用聲明 序 目錄 為什麼要學 Illustrator? 光碟使用說明 認識作業環境 / 系統需求 認識作業環境 / 新增頁面 認識作業環境 / 顏色模式簡介 認識作業環境 / 開啟舊檔 / 另存新檔 認識作業環境 / 轉存 認識作業環境 / 使用浮 視窗 認識作業環境 / 透明層工具

【認識工作環境】

Index 目錄

018 工具箱一覽表 019 選取 / 直接選取 / 群組選取工具 020 魔術棒工具 021 022 024 025 026 027 028 029 030 031 032 033 034 035 036 037 038 039 040 041 042 044 046 047 048 049 050 051 052 053 054 055 056 057

直接選擇套索、套索工具 鋼筆、增加錨點、刪除錨點工具 轉換錨點工具 直線工具 矩形格點工具 弧形工具 螺旋工具 極座標格點工具 矩形工具 圓角矩形工具 圓形 圓角矩形工具 多邊形工具 反光工具 繪圖筆刷工具 鉛筆、平滑、擦除工具 旋轉工具、星角工具 鏡射工具 縮放工具 傾斜工具 任意變形工具 彎曲工具 符號噴灑器 漸層工具 漸層網格工具 測量工具 自 描圖工具 油漆桶填色工具 檢色滴管工具 漸變工具 美工刀工具 剪刀工具 掌形工具、頁面工具 放大鏡工具 圖形的定義

005

Index 目錄

058 059 060 062 063 064 066 068 069 069

下拉式清單 下拉式清單 下拉式清單 下拉式清單 下拉式清單 下拉式清單 下拉式清單 下拉式清單 下拉式清單 下拉式清單

/ / / / / / / / / /

檔案 編輯 物件 文字 選取 濾鏡 特效 檢視 視窗 說明

071 圖表篇 079 文字篇 098 網頁

006

112 114 117 123 128 134 142 150 156 168 178 186 198

進入圓形世界 圓柱體畫法 熱身操，鎖 / 進入 Illustrator 的圓形世界 放大鏡 軟片 礦泉水 外帶杯 藥 保鮮罐 開酒器 搖酒器 Shake 咖啡壺 奶嘴

【認識工作環境】

Index 目錄

203 204 210 218 226 234 243 246 255 263 268 273 276 283 290 292 300 307 310 314 317 319 321

鋼筆的自由曲線 捷運站 非常安全 車站，再會啦 ! 戲院 鮮奶 香菸 憲兵 罐子 喝茶 刮鬍刀 飛行 蓋子 2D 總體 /CD 唱片的古早味，Illustrator 的老撇步 3D 立體繪圖 3D 燈泡 Action 買好書，看好書 引爆 力 Spark Plug 2D+3D 插畫表現 Part1 2D+3D 插畫表現 Part2 咖啡杯組 版權頁

007

為什麼要學

Illustrator ？

對於初學者或專業設計人員，在使用排版、網頁、 畫、影像、3D 及向量軟體的同時，Adobe Illustrator CS 好比六效合一 ( 可能還不 止於此 ) 的綜合維他命，不僅是一套前所未有的全新設計工具，還 能提供綜合上述軟體專長，同時展現使用者所需的功能。如果您曾 經是向量軟體的使用者，同時展現設計、網頁、3D、繪圖 ... 是您 要玩 Illustrator CS 的最大理由。 民國 84 年小弟開始接觸 Illustrator5.0，之後 8.0 新增「漸層網格工具」 大大提升寫實能力，9.0 提供透明層功能及轉存 畫，到了 10.0 幾乎 包含網頁軟體該有的功能，直到最新發表 CS 的 3D，Illustrator 符合 一般使用者的期待，該有的都有了。 如果您是 Adobe 的忠實使用者對於旗下的 Dimensions 應該是不太 陌生 ( 可惜使用者不多 )，到了 7.0~9.0 又有 KPT Vector Effects 外掛 軟體可供支援 3D 圖形 ( 可惜不支援 10.0)，這次新版的 CS 內建 3D 可謂捲土重來、包含光影處理，將平面作品立體化更有搞頭。對於 擅長做圖像創作的使用者，您可不能放棄細細品味的機會。 和過去版本最大的不同，開啟軟體會先出現一個美麗的視窗，使用 者可以經由這個窗口到您指定的路徑。

008

開新檔案

開啟範本圖庫

開啟舊檔

【認識工作環境】

光碟內容圖示 :

009

您看到的插畫及步驟均收錄在附贈光碟中，為 Illustrator 原始檔案，方便讀者比對書中 內文學習，檔名即為該頁頁碼；例如第 100 頁的光碟圖檔名即為 (100.ai/eps/jpg)，可供 讀者填色、分解等練習。 若同時出現兩個磁片案即表示包含 畫檔，如 (10.ai/10.swf)。 畫部分則提供原始最完 整的圖層檔，讀者可以自行改變播放速度並至 IE 瀏覽 畫。

歡迎閱讀同時搭配光碟一起進入 Illustrator 的世界。

同樣是 Illustrator CS，不同的 作業系統下呈現不同的介面， 但是功能完全一樣不影響本書 的適用 。

系統需求 :

Microsoft Windows XP

Windows: Intel Pentium III 或 4 處理器 升 級 至 Service Pack3 的 Microsoft WindowsR 2000 或 Windows XP 192MB 的 記 憶 體， 建 議 使 用 256MB( 越多越好 ) 470MB 可用硬碟空間 ( 越大越好 ) CD-ROM 光碟機

MAC OS10

0010

Macintosh: PowerPC G3、G4 或 G5 Mac OS X 10.2.4 版至 10.2.7 版 192MB 的 記 憶 體 建 議 使 用 256MB( 越多越好 )

470MB 可用硬碟空間 ( 越大越好 ) CD-ROM 光碟機

【認識工作環境】

新增頁面 : 啟 Illustrator 的第一步就是開一張空白頁面進入嶄新 的一頁。 游標移至檔案清單下的「新增」桌面會立刻跳出一 個浮 視窗，首先為這張作品輸入檔名及您要的畫板 大小、色彩模式，假如是要做為四色印刷稿件請勾 選 CMYK( 藍紅黃黑 )，網頁設計請勾選 RGB。

開啟的頁面隨時可以改變色彩模式，只要是在圖件 保持選取狀態回到檔案清單下的「文件色彩模式」 即可。修改畫面尺寸則是在檔案清單下的「文件設 定」做調整。 最小化 / 往下還原 / 關閉

Windows XP 範例

0011 垂直捲軸

水平捲軸

浮 控制視窗

顏色模式簡介 : 灰階模式 : 以黑、白或灰階層次表現圖形，由黑 0%~100%。 RGB 模式 : ( 紅、綠、藍 ) 使用於網頁，或非四色印刷條件下的 稿件，色域由 0%~255%。 HSB 模式 : ( 色相、飽和度、亮度 ) 灰階模式 :

色相 : 一般情況下色相是以顏色的名識別，從 0 到 360 度之間的角度值表示。 飽和度 : 也稱為彩度，指顏色的濃度代表色相中的 灰階成分，從灰 0% 到 100%( 完全飽和 )。 亮度 : 顏色的亮度或暗度，從黑 0%~ 白 100% 分比 表示。

RGB 模式 :

CMYK 模式 : ( 藍、紅、黃、黑 ) 使用於印刷條件下的稿件，色域 由 0%~100%。

紅色 綠色

0012

CMYK 模式 :

藍色

HSB 模式 : 色相 飽和度

C100%

M100%

Y100%

K100%

明度 RGB 模式 :

CMYK 模式 : 藍色 紅色 黃色 黑色

R255%

G255%

B255%

【認識工作環境】

開啟舊檔 / 另存新檔 : Illustrator 對於許多檔 案格式有更多的相容 ，相對於存檔也有更 多的選擇，對於整合 其它軟體而言有更大 的發揮空間。 新 版 的 CS 更 有 效 率 的 整 合 Microsoft Office，將 Illustrator 圖 件 以 最 佳 化 格 式 輸 出， 可 以 在 Microsoft Office 進 行列印及顯示。

儲存檔案有勾選 「包含文件縮圖」 可以在這個視窗 預視。

0013

轉存各種格式後的檔案圖形。

轉存 : 檔 案 清 單 下 的「 轉 存 」 可 以 幫 助 使 用 者 在 Illustrator 完成的作品，利用更多的檔案格式 相容於其它軟體進行更多樣 的修改，以這張 「作品」為例，Illustrator 原始圖層有 12 層， 轉存 PSD 檔原來的圖層仍然保留，可以在 Photoshop 的環境下再加工處理。

0014

( 左 )Illustrator 原始圖層 ( 右 ) 轉存 PSD 檔到 Photoshop 的圖層

在網路發達的時代，您可以將完成的作品存 jpg 檔 mail 給好朋友分享，但別忘了必需是 RGB 的色彩模 式喔。至於其它這麼一長串的檔案格式不妨每一種 都親身體驗操作一次吧 !

「 轉 存 for Microsoft Office」圖形以最佳化格 式輸出，以便在 Microsoft Office 產品中進行列印與 顯示，是 CS 新增的另一 項儲存功能與 Microsoft Office 更密切的整合 。

【認識工具箱】

使用浮 視窗 : 當您安裝完畢 Illustrator 第一次啟 軟體時，螢 幕一定會出現左上角的工具箱及右邊直列一排 預設群組的浮 面板，您可以根據個人的需求增 加或隱藏某些浮視窗。

游標移至上方位置輕壓不放即可移 浮 面板位置。

按此處隱藏浮 面板 隱藏的面板只要回到視窗清單下即可找出重新出現在螢幕 上。

按「-」處可以縮小 ( 或全部 ) 出現浮 面板的面積。 按「X」處可以隱藏浮 面板。

通常會有 2~3 個項目群組成一 個浮 面板，例如「變形、對齊、 路徑管理員」在同一個浮 視窗， 您可以將游標輕壓索引標籤直 接拖移單獨使用。 當三個項目在群組狀態下，單 響一項索引標籤，該浮 面板 會移至最上層。

幾乎和所有的工具箱一樣，只要有三角形記號表示還有指令 及選項，只要滑鼠輕壓右上角的黑色三角形即可顯示隱藏浮 視窗的彈出式選單。

015

透明層工具 : 並不是什麼新增的功能了 ( 老朋友了 )， 確是本書經常提及的工具 ( 或者說是 作者個人偏好的工具之一 )，對於以繪 圖為導向的創作意圖，透明層絕對可 以提升作品的寫實度，不可不瞭解。

暗化 /100%

變亮 /100%

色彩增值 /100%

網屏 /100%

016

正常 /100%

色彩加深 /100%

色彩加亮 /100%

【認識工具箱】

覆蓋 /100%

差異化 /100%

飽和度 /100%

017

柔和 /100%

交集 /100%

色彩 /100%

實光 /100%

色相 /100%

明度 /100%

Illustrator 工具箱一覽表 Adobe 線上

(V) 選取 (Y) 魔術棒

弧線 / 螺旋 / 方格 / 極座標格

鏡射 / 旋轉

套索

(\) 直線

矩形 (M)

圓角矩形 / 橢圓 / 多邊形 / 星形 / 閃光

(B) 畫筆

鉛筆 (N)

(R) 扭轉

縮放 (S)

(Shift+S) 符號噴灑

油漆筒 / 測量

直接選取套索 (Q)

區域文字 / 自由路徑 / 垂直路徑 / 區域文字直行 / 垂直路徑

(Shift+R) 彎曲

018

群組選取

文字 (T)

(P) 鋼筆

增加錨點 / 刪除錨點 / 轉換錨點

直接選取 (V)

任意變形 (Shift+E)

平滑 / 擦除

傾斜工具 / 變外框工具

橫條圖 / 堆疊橫條圖

長條圖 (J) 長條圖 / 堆疊長條圖

(U) 漸層網格

漸層 (G)

(I) 檢色滴管

漸變 (W)

自 描邊

剪刀 (C)

美工刀

切割選取

(Shift+K) 切割

頁面

(H) 掌形

(X) 填色

放大鏡 (Z) (Shift+X)

筆畫 (X)

(>) 漸層 / 顏色 (<)

無 (/)

(F) 標準螢幕模式

全螢幕模式 (F)

(F) 全螢幕包令含選單模式

快速鍵使用 : ●按 ( ) 中的按鍵，PC BMAC 一體適用。 ●雙響工具或選取工具同時按 Enter(Return) 鍵產生選取工具的浮 視窗。 ●輕按工具箱有小三角形符號顯示隱藏工具。 ● Caps Lock 鍵亮時，選取工具箱將呈現十字游標。 ● Ctrl(Command)+Shift 鍵同時雙響任何工具，工具箱可以回復預設值。

散佈圖

拆線圖 / 區域圖

圓形圖 / 雷達圖

【認識工具箱】

選取工具

直接選取工具 群組選取工具

( 圖一 )

俗話說 :「差一點點差很多」這句 話用在電腦尤其適用，一個指令一 個 作產生不一樣的效果。本頁次 介紹的選取工具看起來都是箭頭造 型，看起來的確很像但是功能可就 不一樣了。

( 圖二 )

( 圖一 )「選取工具」: 物件在群組 狀態下使用「選取工具」接觸任何 一個位置，物件會是全選的情形， 若不是群組狀態下，只會單一物 件被選取 ( 圖二 )。

019 ( 圖三 )

( 圖四 )

( 圖五 )

( 圖 三、 圖 四 )「 直 接 選 取 工 具 」: 屬於局部選取功能，選取的部分若 不在錨點上僅會出現空心的情形， ( 圖五 ) 選取在錨點位置呈實心小方 格可以進行調整、編修的工作，不 受限群組或非群組的物件。 ( 圖五 )「群組選取工具」: 物件在 群組狀態下選取單一物件會是局部 全選狀態，連續雙響滑鼠左鍵圖件 會是選取群組狀況下的物件 ( 圖六 )。

( 圖六 )

( 圖七 )

魔術棒工具 :

雙響「魔術棒工具」出現浮 視窗設定容許度範圍， 這個工具和 Photoshop 的「魔術棒」類似的工具，只 是差別在選取狀況下的顯示方式。 圖件在群組或非群組的狀態下使用「魔術棒工具」 選取物件，在容許度設定的範圍內選取物件的錨點 都是完整的，但是不能移 必需回到「選取工具」 或使用其他的工具行編輯。 這項工具對於圖件複雜又需同時選取相近條件的物 件是方便、快速的工具。

020

【認識工具箱】

直接選擇套索 / 套索工具 :

這組選取工具和「選取工具」有些相似，都是以實 心箭頭或空心箭頭區分雙胞胎兄弟的差異 。 空心箭頭的「直接選擇套索工具」可以選取自由輪 廓圖件內的錨點及線條路徑。 而實心箭頭的「套索工具」和黑箭頭的選取工具十 分接近，只要在物件的範圍選取，所有的錨點都是 在被選取的狀態下。

021

鋼筆 / 增加錨點 / 刪除錨點 ( 工具 ):

使用「鋼筆工具」按左鍵在頁面單響一下產生第一 個錨點，放掉滑鼠鍵再單響一下產生第二個錨點， 兩個錨點連成的線段成一條線。

對於曾經有使用過 Photoshop 去背景經驗的朋友來說， 貝茲曲線該是不陌生的工具，沿著圖檔逐一描邊即 可完成複雜的輪廓，在數位繪圖的領域貝茲曲線如 同手繪的線條稿，「鋼筆工具」如同鉛筆素描中的 碳筆、繪圖中的鉛筆一樣重要了，當然成敗還是在 使用者的那一雙手 ( 一隻手按輔助鍵，一隻手按滑 鼠 )。

我們必需用「點、線、面」的觀點來看貝茲曲線， 因為有錨「點」才會有「線」條，有完整的線條才 會有 閉空間產生的「面」，增加或減少錨點都會 影響線條的結構。

022 假如第二個錨點按不放並移 滑鼠位置就能形成一 條弧線，並產生控制線，這條控制線兩端的錨點可 以移 改變線條彎曲程度。

加按「Shift 鍵」可以畫平行、垂直、45 度直線。

「刪除錨點工具」刪除線段上現有的錨點，反之「增 加錨點工具」增加線段上現有的錨點，都是做為改 變線條形狀的工具。配合移 控制點就能完成更優 美的線條。

【認識工具箱】

取材非幾何圖形的主題最方便的輔助方法就是拍攝 一張數位相片，儲存 150dpi 左右解析度的影像檔置 入 Illustrator 做為底圖描繪，可能是最理想的方式之 一。 從第一個錨點開 始，連續重複上 個 作產生一條 自由曲線，結束 點連接至起始點 成為一個 閉空 間。

023

( 圖一 )

轉換錨點工具 : ( 圖一 ) 按「Shift 鍵」拖拉一個矩形，使用「刪除錨 點工具」選取右下角錨點成三角形 ( 圖二 )。 ( 圖三 ) 選取石上角錨點使用「轉換錨點工具」向右 下方向移 調整。

( 圖二 )

( 圖三 )

024

( 圖四 )

( 圖五 )

( 圖六 )

( 圖四 ) 選取左上角錨點使用「轉換錨點工具」向右 上方向移 調整。 ( 圖五 ) 選取下面錨點使用「轉換錨 點工具」向左上方向移 調整。

( 圖六 ) 經調整錨點的三角形己 經變成沒有銳角的圓弧體， 「旋 轉工具」逆時針方向旋轉至水 平角度，再使用鏡射拷貝製另 一邊即成為一付眼鏡的造型了。

【認識工具箱】

按滑鼠左鍵不放直接拖拉線條長度，直到放掉滑鼠 完成線條路徑。

直線工具 :

( 圖一 )

( 圖二 )

雙響「直線工具」出現工具選項，設定線段長度、 角度、填色等選項。

使用「直線工具」和其他畫線工具不同的是「完全 直線」必需配合「填色工具 / 無」、「筆畫工具」 的顏色設定 ( 圖一 ) 以及筆畫浮 視窗的寬度，如同 「鋼筆工具」畫線一樣也可以做虛線表現 ( 圖二 )。

025

圖例 : 加按「Shift 鍵」畫出 45 度角直線，部分做虛線表現兩雨水效果。

矩形格點工具 :

單響「矩形格點工具」輸入長寬尺寸及欄數可以直 接製作表格省去畫線的麻煩工作，對於簡單的行事 曆或填表資料是很好的工作伙伴。 除了浮 視窗的設定外如同前一頁的「直線工具」 也需要「筆畫工具」的配合，因為這些周邊的工具 直接影響做出來表格底色、線條的 細及顏色。 對於浮 視窗設定所完成的作品，可以重新選取調 整框線的 細、顏色及大小比例。

白底，黑色筆畫 0.5pt

026

讀者可以根據實際需要重新設計輸入資料， Illustrator 將成為您生活上的得力助手。

【認識工具箱】

弧形工具 : 「弧形工具」和前面介紹的「直線工具」一樣的「完 全弧線」，同時配合「填色工具 / 無」、「筆畫工具」 的顏色設定以及筆畫浮 視窗的寬度 . . . 等。雙響 「弧形工具」出現工具選項，設定線段長度、角度、 填色等選項。 軸心位置

( 開弧 )

( 閉弧 )

027

螺旋工具 :

選取「螺旋工具」頁面單響滑鼠出現浮 視窗，設 定選項參數按「確定鈕」或以直接拖拉的方式產生 螺旋圖形，除了表現制式圖案您也可以表現在蝸牛， 以及漫畫人物兩眼冒金星的趣味表現上。

028

【認識工具箱】

雙響「極座標格點工具」設定選項參數按「確定鈕」 或以直接拖拉的方式產生圓形表格，設定徑向分格 線 12 欄用來表現 12 個星座的圖表，假如設定 7 欄 可以做為一周的行事曆或功課表之類的圖形。

當色彩 M30%+Y10%、筆畫黑 100% 的條件下，勾選「建立自橢圓形的 複合路徑」產生隔行填色的效果 ( 圖 一 )， 反 之 沒 有 勾 選 只 有 正 常 填 色 ( 圖二 )。

( 圖一 )

( 圖二 )

讀者可以根據實際需要輸入資料，例如一周七天的行事曆，或 ... 讓 Illustrator 成為生活上的得力助手。

029

矩形工具 :

矩形應用在插圖的實際情形。

030

矩形或圓形是電腦繪圖中使用幾 何圖形為基礎的入門工具，在電 腦還未普及的時代，製圖必需使 用到尺或圓規等工具。今天幾乎 每一種繪圖軟體都配備矩形、圓 形等工具，使用的概念也都差不 多，就看使用者如何應用了。 矩形可以只是「矩形」，也可以 不只是「矩形」。 加按「Shift 鍵」可以畫出正方形。

【認識工具箱】

圓角矩形工具 :

圓角矩形常見於我們日常生活用品，如時下流行的 折疊手機，從頭到腳、表裡一致的圓角矩形。 選取「圓角矩形工具」單響頁面設定圓角半徑，按 確定鍵出現的圓角矩形就是浮 視窗設定的大小尺 寸，但作者並不在意長寬的設定，通常是輸入圓角 半徑之後再以滑鼠直接拖拉大小會比較得心應手。

( 全部以圓角矩形構成的作品 )

031

圓形、星角工具 : 用過圓規的朋友都知道，圓規是以圓心向外轉一圈 完成一個正圓，在沒有電腦的時代畫橢圓是用橢圓 板或雲形板。 當電腦盛行的年代可能有很多朋友沒見過圓規了， 但是以滑鼠拖拉圓形的概念和圓規是一樣的；以游 標位置向外擴張，橢圓的寬扁比例隨手任意調整。

圓心

游標位置

以圓形為基礎造型可以畫出很多的作品，本書準備 許多精美圖例與讀者分享「圓形經驗」，在進入實 戰章節之前先請各位認識這位雪人，不就是以三個 圓形堆砌而成的圖像 !?

加按「Shift 鍵」可以畫出正圓形。

032

【認識工具箱】

多邊形工具 : ( 六邊形 )

幾何製圖不外矩形、圓形、三角形、星形 ... 等範圍， 多過四邊形的就叫多邊形，單響「多邊形工具」設 定邊數，可以同時輸入半徑尺或直接拖拉決定多邊 形大小，日常生活中的小五金可以做很好發揮。

( 八邊形 )

( 十邊形 )

033

反光工具 :

單響「反光工具」出現浮 視窗輸入各項設定之後，拖拉滑 鼠產生第一次反光，拖拉的範圍決定光暈直徑大小及位置但 不出現預視，必需在檢視清單下的「外框」才看得到。 再單響一次滑鼠 ( 或做出第一次反光之後按著滑鼠不放直接 移 產生第二次反光 )，在螢幕上可以清楚預視完整效果，由 於是手 移 滑鼠，光線的角度、大小、長短完全操之在 「手」，完成的反光仍是向量圖形為一個群組物件可以做 移 、縮放、旋轉等改變。 向量圖，影像軟體置入的點陣圖也可以使用相同的效果。

034

第一次拖拉的反光

沿著對角線拖拉 產生第二個反光

【認識工具箱】

繪圖筆刷工具 :

配合視窗清單下的「筆刷資料庫」叫出樣本浮 視 窗在桌面上，樣本圖形可以使用任何一種工具拖拉 到頁面上，但只有是在「繪圖筆刷工具」的搭配上， 隨著滑鼠 ( 筆刷 ) 的移 決定圖案的大小及連續 。

035

雙響「筆刷資料庫」產生筆 刷工具偏好設定，決定筆刷 特 。

鉛筆 / 平滑 / 擦除 ( 工具 ): 「鉛筆」和前面介紹的「鋼筆」都是屬於徒手繪圖 工具，不同的是鉛筆沒有控制點也沒有中途停頓轉 換錨點的機會，更富自由曲線的特色，必需熟練滑 鼠或感壓筆的使用才能表現的得心應手。

( 圖一 :「鉛筆工具」徒手畫一個正圓形，局部鈍角的部分 使用「平滑工具」在周圍畫一圓圈即可增加接合處的柔順 度。)

「平滑」可以修飾線條路徑上錨點的柔順度，而「擦 除工具」如同平常使用鉛筆上的橡皮擦一樣；清除 不要的線條。 本圖表現 SARS 的冠狀病毒，由蕭文勇先生友情提供。

( 圖二 : 繼續使用「鉛筆工具」增加主體明暗層次所需的物 件。)

036

( 圖三 : 增加表面零星的物件。)

( 圖四 : 完成填色後的作品。)

【認識工具箱】

旋轉工具 :

星角工具 :

以物件中心點為 軸 心， 做 逆 時 針 或順時針方向以 手 方式旋轉。

單響頁面「星角工具」輸入星角數按「確定鍵」產 生一個 16 星角的星形圖形，或任意拖拉一個多角數 的星形物件保持選取狀態。 使用「旋轉工具」時軸心自然定位在中心位置做順 時針方向旋轉，圖例應用在電鋸的表現上，真實的 電鋸齒輪是位於機器內部僅露出下半部，為便於說 明齒輪置於表面最上層。 相同的圖形也可以應用在氣象的雲層表現。

037

( 圖一 )

鏡射工具 :

「鏡射工具」顧名思義就是利用鏡子反射產生另一 半的物件，例如我們的手、腳只要完成一邊，另一 半只要利用「鏡射工具」的拷貝功能即可。

( 圖一、二 ) 雙響「鏡射工具」出現浮 視窗，手、 腳勾選「垂直 /90/ 拷貝」產生平行鏡射。

038

勾 選「 水 平 / 0/ 拷貝」產生垂直 鏡射，可以應用 在倒影的表現上。

( 圖二 )

( 圖三 )

( 圖三 ) 同例，心形圖案完成了一邊，也是利用「鏡 射工具」的拷貝功能才能做出完全對稱的另一半。

【認識工具箱】

原圖黑色畫筆寬度 0.5pt

縮放工具 :

使用「選取工具」縮放，必需確 定圖件是在「檢視 / 顯示邊框」 選取的狀態下。

縮放圖件可以直接使用「選取工具」按「Shift 鍵」 沿對角線直接縮放，或使用「縮放工具」輸入縮放 比例，但是要先留意「偏好設定 / 縮放筆畫和特效」 是否勾選，這一項設定和「縮放工具」是同步選取的， 決定物件與筆畫 ( 特效 ) 是否同時縮放。

畫筆寬度 0.28pt

畫筆寬度 1.75pt

勾 選「 縮 放 筆 畫 和 特 效 」， 放 大 或 縮 小時筆畫寬度與物 件成等比縮放。 不 勾 選「 縮 放 筆 畫 和 特 效 」， 放 大 或 縮小筆畫寬度不變。

039

傾斜工具 :

做為圖形傾斜變 形 工 具， 同 時 也 可以變更傾斜角 度之後拷貝使用 並保留原始圖形。

040 應用在具像圖形， 拷貝本身物件經 過傾變形應用陰 影的表現。

原始圖形保持選取狀態，傾斜軸心定位左下角 向右移 成斜角矩形或橢圓形。

【認識工具箱】

( 原圖 )

任意變形工具 : 這個單一工具可以同時做為「移 、縮放、旋轉 ...」 等工具使用，游標會因放置位置不同改變任務，游 標形狀也隨之改變。

041 ( 旋轉 )

( 對角縮放 )

( 移 )

( 水平縮放 )

( 垂直縮放 )

彎曲工具 : ( 原圖 : 以線條為範例 )

用來改變圖件變形的工具。 雙響「彎曲工具」叫出工具選項視窗設定 筆刷尺寸及彎曲程度。 按住 Alt(Option) 鍵不放單響「彎曲工具」 可以切換隱藏的工具。

( 彎曲工具 )

042

( 扭轉工具 )

( 縮攏工具 )

( 膨脹工具 )

( 荷葉邊工具 )

( 晶體化工具 )

( 皺摺工具 )

【認識工具箱】

( 原圖 : 以圖件為範例 )

( 彎曲工具 )

( 扭轉工具 )

( 縮攏工具 )

凸小腹、站三七步

043

( 荷葉邊工具 )

( 膨脹工具 )

凸小腹、發胖效果

顫慄效果

( 晶體化工具 )

( 皺摺工具 )

使用電腦內建資源或圖庫是最方便、省時就可以達 到得心應手的階段。 符號噴灑工具 符號壓縮工具 符號縮放工具 符號旋轉工具 符號著色工具 符號濾色工具 符號樣樣式設定器

044

工具箱內的「符號噴灑工具」必需配合視窗清單下 的「符號資料庫」叫出「圖表、地圖、物件、自然 ...」 等浮 視窗。選定其中任何一個圖案直接拖至頁面 即可產生圖形並可重新編輯調整。 雙響「符號噴灑工具」設定噴 槍壓力大小。

視窗清單下的所有圖案資料 庫幾乎都可以使用「噴灑工 具」經選取後單響頁面出現 圖形 ( 圖一 )，或輕壓滑鼠不 放在頁面直接拖拉產生圖形 串連效果 ( 圖二 )。

( 圖一 )

( 圖二 )

【認識工具箱】

「符號噴灑工具」內雖然還有七個孿生工具執行縮 放、移 、旋轉、修色等工作，但是在整個工具箱 內同質 很高的工具都是可以替代的。 直接「拖拉預設 CMYK」浮 視窗的任何圖案到頁 面上。 ( 圖例 ) 消防人員的插圖作品再添加內建符號圖案的 潤飾，有相輔相乘加分的效果。

045

( 圖一 )

漸層工具 : 雙響「漸層工具」或在視窗清單叫出漸層 浮 視窗。 漸層結束顏色

漸層開始顏色 漸層中間顏色

單響漸層滑桿可以在顏色 浮 視窗找出色彩成分。

046 ( 圖二 )

表現光影明暗一定要善用角度、漸層滑桿的變化，( 圖三 ) 的 黑色按鍵厚度部分做斜形角度 (-129) 明顯區隔上層物件，凸顯 黑色立體層次。 使 用「 漸 層 工 具 」 除 了 輸 入「 角 度 」 參 數， 也 可 以 以 手 移 漸層游標的方式控制漸層角度方向。

( 圖三 )

( 圖一 ) 游標單響「漸層滑桿」下緣部分即 可產生新的滑桿。 移 滑桿調整顏色 ( 層次 ) 位置或以手 拖 拉漸層游標的方式控制漸層起始及結束。

【認識工具箱】

漸層網格工具 :

「漸層網格工具」可以製作層次非常綿密的混色效 果，提升作品的寫實度，不同於「漸層工具」的是； 完成漸層網格的圖件不能再做剪裁、切割、路徑管 理的任何指令，因此作者習慣保留備分原稿製作。 「漸層網格」最大的特色是格點的顏色會隨著輪廓 造型做混色的分布。

( 圖一 ) 圖件底色為白色，保持選取狀態 ( 實際圖件沒有黑 框線 )。

047

( 圖二 )「漸層網格工具」選取的地方會出現十字形格點， 至顏色浮 視窗重新填色。

( 圖三 ) 底色與格點顏色重新混色的效果。

048

測量工具 :

要測量圖件大小可以在檢視清單下的「顯示尺標」 拉出參考線，也可以選取圖件直接從「資訊浮 視 窗」讀取資料。 自 10.0 之後的工具箱新增了「測量工具」功能如同 日常生活用的皮尺一樣，使用時在兩端之間拖拉或 單響一端按著滑鼠不放再拖拉至另一端，也可以單 響一端放掉滑鼠再到另一端單響，無論使用那種方 法螢幕上的「資訊浮 視窗」的資料都會同步顯示。

【認識工具箱】

自 描圖工具 : 「自 描圖」可以將點陣底圖轉換貝茲曲線，但條 件必需是反差強烈的圖件。 ( 圖一 ) 首先將手繪線條稿在影像軟體掃描灰階，儲 存 tif 檔格式。 ( 圖一 ) 手繪線條原稿

( 圖二 ) 打開底圖置於圖層最下層，使用「自 描圖 工具」點選白色部分產生黑色路徑曲線，( 圖三 ) 線 條和理想會有一些 ( 或很大 ) 的差距再利用控制點及 「直接選取工具」調整線條至最理想狀態。

( 圖二 ) 描圖工具產生的線條稿

( 圖三 ) 修飾後完成的線條稿

049

實際應用完成的作品。 ( 描圖產生的線條路徑仍需重新整 理成個別獨立的 閉空間，分別填 色才能製作完美作品。)

讀者不妨利用光碟附上的身體圖形，貼上自己的大頭貼或親愛的另一半。

油漆桶填色工具 : 雙響「油漆桶填色工具」同時叫出 「檢色滴管取樣」及「套用油漆桶」 兩項工具，其實是近似孿生兄弟的 組合互相搭配使用，套用的對象包 括物件、文字的填色及屬 。

使用「油漆桶填色工具」如同準備 好一桶油漆 ( 顏色 )，往圖件一倒 立即得到設定的色彩，而圖件不需 要在選取狀態下。 和「檢色滴管工具」不同的是，圖 件在選取選取狀態下取材樣本的顏 色及屬 ，好比 A 拷貝 B，而「油 漆桶工具」正好相反是 B 拷貝 A。

050

讀者可以利用本書附贈的光碟，實 際為這支畫筆筆下的色塊操作看看。

【認識工具箱】

檢色滴管工具 : ( 圖一 )

( 圖一 )

畫筆先刷出一條黑色顏料拷貝另外幾條顏料，使用 「檢色滴管工具」再為其他的圖件重新填色。

( 圖二 ) ( 圖二 )

您也可以使用「檢色滴管工具」吸取 ( 相當於拷貝 ) 顏色浮 視窗上的任何顏色或其他圖件上的顏色為 圖件填色或改色。 ( 圖一 ) 選取原本灰色的顏料圖形，「檢色滴管工 具」吸取紅色色塊時，灰色立即轉變成紅色及其他 色塊 ( 圖二 )。如果吸取的樣本有圖框也會一併被拷 貝，但不包含「網格漸層或漸變」等屬 的圖件。

( 原來字形 )

( 吸取樣本 )

( 吸取樣本後，原來字形改變與樣本相同字體、級數、顏 色等屬 。)

「檢色滴管工具」也可以字形在選取狀態下吸取其 他文字的字體及大小、顏色等。

051

漸變工具 :

雙響「漸變工具」設定指定階數，滑鼠選取內外圓 錨點，會在兩個物件之間做造型與色彩的漸變，指 定階數越大漸變之間的層次越細密，相對的也越占 記憶體。

指定階數 /2

052

6

20

80

【認識工具箱】

美工刀工具 : 「美工刀工具」與「剪刀工具」都是用來切割圖件 的工具，最大不同的地方在於「美工刀工具」用來 切割填色面積，「剪刀工具」用來剪斷線條路徑， 因此兩者若相反使用會產生不同的效果，圖例的起 司蛋糕描邊的框線建議先轉換路徑到「外框筆畫」 再與圖件同時切割。

黑框線為 0.5pt 線條狀態切割後的情形。

線條轉換「外框筆畫」後切割的情形， 兩者明顯不同。 加按「Shift+Alt(Option) 鍵」切割垂直、平行、45 度 斜角。只加「Alt(Option) 鍵」美工刀呈直線或斜線 路徑。

不加任何輔助鍵美工刀路徑會呈自由曲線，本書在 許多插畫的填色上會大量使用這種特質做為填色的 方式。

053

剪刀工具 :

延續上一頁的課題，若在線條的物件上使用「美工 刀工具」做切割，線條不會有任何反應而且是毫髮 未傷，這時候就要用「剪刀工具」來剪一剪了。

線條保持選取狀態，使用「剪刀工 具」選取路徑上的錨點，圖例選取 的兩個錨點使原本一條線分成上下 兩段。

054

【認識工具箱】

掌形工具 : 使用「掌形工具」或調整「水平 / 垂直捲軸」移 頁 面位置，雙響「掌形工具」回復符合視窗正常畫面。

頁面工具 : 頁面的大小取決於開檔時的文件設定，而「頁面工 具」是文件內虛線範圍，也就是印表機列印的範圍， 輕壓「頁面工具」可以任意移 列印範圍，虛線以外 的圖件無法列印。

055

雙 響「 頁 面 工 具 」 虛 線 ( 列 印 ) 範 圍 同「 掌 形 工 具」回復至文件中間位置。

放大鏡工具 :

改變畫面大小可以使用檢視清單下的「放大顯示」 等四項選單，或是工具箱的「放大鏡工具」。 使用「放大鏡工具」每單響一次滑鼠成等比放大， 加按「Alt(Option) 鍵」則是縮小比例。 「放大鏡工具」直接拖拉矩形範圍可以放大檢視局 部細節，雙響「掌形工具」畫面回復至符合視窗原 始畫面。

移 紅色框線相當於 手掌移 頁面

056

滑桿相當於放大鏡功能

使 用「 掌 形 工 具、 放 大 鏡 工 具 」 可 以 同 時 配 合「 導 覽器」浮 視窗移 頁面或 縮放頁面大小。

【認識工具箱】

圖形的定義 ... 刮鬍泡效果

不管是手繪的插畫或是數位藝術都是點、線、面的 組合，相同的造型，不同的色彩，甚至於是相同的 色彩也會因環境的不同、搭配物件的不同而改變圖 像本身所扮演的主題，也就是重新定義一張圖的角 色。 以左圖這一堆東西為例，填白色和刮鬍刀放在一起 就是刮鬍泡。填土黃色和垃圾放在一起就是「x x」， 可是相同是黃色和吐司麵包擺在一起可就是可口的 奶油，放在甜筒上面不就是冰淇淋了。

「xx」效果

再舉個例，由深漸變到淺的圓形圖件若不去定義可 能是一顆珠子或做其他的聯想，放在飲料旁邊可以 是水珠，放在燈泡的後面可以成為光暈了，放在圖 件的底層可以做為陰影，在我們認識工具箱的使用 之後即將著手畫一張圖之前，不妨思考您的圖件將 扮演什麼樣的角色。

水珠效果

057

陰影效果

奶油效果

光暈效果

【功能下拉式清單】

057

新增 開啟內建範本 開啟舊檔 打開最近使用過的檔案 關閉檔案 儲存檔案 另存新檔 另存備份為

(1)

儲存成範本

增加浮水印

儲存供網頁使用

執行樣式到文件區域

儲存成 Version

更改文字大小 區域

回復

轉存文件 態檔

置入

轉存文件為 PDF 檔

儲存供 Microsoft Office

瀏覽器

轉存 程式 (1) 文件設定 文件色彩模式 (2)

058

檔案資訊 譯本 列印 結束

(2) CMYK 色彩 RGB 色彩

【功能下拉式清單】

還原 重作 剪下 拷貝 貼上 貼至上層 貼至下層 清除 尋找及回復

(1)

尋找下一個

一般

確定

文字及自 描圖

編輯自定

單位及還原

定義圖件

參考線及格點 智慧參考線及格點

編輯原稿 轉換 執行樣式到文件區域

連字 增效模組與暫存磁碟 檔案管理與剪貼簿

PDF 色彩指令

059

指定色彩描述檔 鍵盤指令 偏好設定 (1)

偏好設定視窗

變形 (1)

(1)

再次變形 移 縮放 旋轉 傾斜 鏡射 個別變形

排列順序 (2) 組成群組 解散群組 鎖定 (3)

重設邊框

解除全部鎖定 隱藏 (4)

(2)

移至最前 置前 置後 移至最後 移至目前圖層

顯示全部 展開 擴充外觀 平面化透明物件 點陣化

(3)

建立層網格 切割 (5) 路徑 (6)

(4)

漸變 (7)

060

套變形 (8)

選取範圍 所有上方的圖稿 其他圖層

選取範圍 所有上方的圖稿 其他圖層

文字彎曲 (9) 剪裁遮色片 (10) 複合路徑 (11) 裁切線 (12) 圖表 (13)

(5)

製作 釋放 從考線製作 從選取建立 複製裁切 結合裁切 分割裁切 刪除全部 裁切選項 剪裁至畫板

【功能下拉式清單】

(6)

合併 平均 外框畫筆 位移複製

(10)

製作 釋放

(11)

製作 釋放

簡化 增加錨點 分割下方物件 切割到格子

(12)

製作 釋放

清除 (7)

(13) 製作 釋放 漸變選項

類型 資料 設計 長條

展開

記號

取代旋轉 反轉旋轉 由前至後反轉 (8)

(9)

061 使用彎曲變形 使用 套變形網格 使用物件 套變形 釋放 套選項 展開 編輯內容 製作文字變形 釋放文字變形 文字變形選項

字體

(1)

最新字體 字級 (1) 解除全部鎖定 文字選項範圍 文字在路徑上 (2) 螺旋狀文字 合成字體 Kinsoku Shori 設定 Mojikumi 設定 標題強對齊 建立外框 尋找文字 更換文件 (3) 智慧型標點 沿邊排列

(2)

顯示隱藏字元 文字方向 (4)

062

溢排文字

(3)

(4)

水平 垂直

【功能下拉式清單】

(1) 全部

混色模式 填色與筆畫

取消選取

填色顏色

重新選取 反選

不透明度

上方的下一個物件

筆畫顏色

下方的下一個物件

筆畫寬度

相同 (1)

樣式

物件 (2)

符號範例

儲存選取

連結黑色系列 ...

編輯選取

(2)

相同圖層上的所有物件 方向控制點 筆刷畫筆 剪裁遮色片 弧立控制點 文字物件

063

套用上一個濾鏡

(1)

調整顏色

上一個濾鏡

由前至後漸變

顏色 (1)

水平漸變 垂直漸變

建立 (2)

轉換為 CMYK

扭曲 (3)

轉換為 RGB

風格化 (4)

反轉顏色 黑色疊印

藝術風 (5)

飽和度

模糊 (6) 筆觸 (7) 扭曲 (8)

(2)

物件馬賽克

像素 (9) 銳利化 (10) 素描 (11)

製作裁切線

(3)

隨意扭曲 內凹與膨脹

風格 (12)

蜿蜒效果

紋理 (13)

扭曲

視訊效果 (14)

扭轉 鋸齒

064

(4)

增加箭頭 製作陰影 圓角

(5)

彩色鉛筆 挖剪圖案 乾 筆刷 粒狀影像 壁畫 霓虹光 塗抹沾污 版狀切割 塑膠覆膜 海報邊緣 粉蠟筆 塗抹繪圖 海綿效果 著底色 水彩畫

【功能下拉式清單】

(6)

高斯模糊

(11)

立體浮雕 粉筆與碳筆

放射狀模糊

碳筆效果

(7)

鉻黃 強調邊緣

蠟筆紋理

角度筆觸

筆畫效果

交叉底紋

網屏圖形

變暗筆觸

紙張效果

墨水外框

拓印

潑灑

石膏效果

噴灑

網狀效果

水墨畫

印效果 邊緣效果

(8)

溼紙效果

強調邊緣 角度筆觸

(12)

邊緣亮光化

(13)

嵌磚效果

交叉底紋

(9)

彩色網屏

粒狀紋理

結晶化

馬賽克紋理

網線銅版

拼貼

點狀化

鏡片著色

(10)

紋理代 遮色片銳利化調整

(14)

反交錯 NTSC 色彩

065

(1)

斜角

執行 ( 上一次指令 )

環繞

執行斜角變形

旋轉

文件特效重新設定

(2)

3D 特效 (1) 轉換為形狀 (2)

矩形 圓角矩形 橢圓形

扭曲與變形 (3) 路徑 (4)

(3)

路徑管理員 (5)

隨意扭曲 內凹與膨脹

點陣化

蜿蜒效果

風格化 (6) SVG 濾鏡 (7)

扭曲

彎曲 (8)

扭轉

藝術風 (9)

鋸齒

模糊 (10) 筆觸 (11) 扭曲 (12)

(4)

位移複製

像素 (13)

外框物件

銳利化 (14)

外框畫筆

素描 (15)

066

風格化 (16) 紋理 (17) 視訊效果 (18)

(5)

聯集 交集 差集 依前置物件剪裁 依後置物件剪裁 分割 剪裁覆蓋範圍 合併 裁切 外框 實色疊印 透明疊印混合 補漏白

【功能下拉式清單】

(6)

(8) 增加箭頭 製作陰影 羽化

(10) 弧形

高斯模糊

下弧形

放射狀模糊

上弧形

內光暈 外光暈

拱形

圓角

凸形

....

凹殼較低

(7) 執行 SVG 濾鏡

(11) 強調邊緣 角度筆觸 交叉底紋

凸殼較低

變暗筆觸

旗形

墨水外框 潑灑

波形

置入 SVG 濾鏡

噴灑

魚形

開端 _1 開端 _4

上升

斜形陰影

魚眼

清涼劑

膨脹

擴大 _3

水墨畫 (12) 擴散光暈

擠壓

擴大 _6

玻璃效果

螺旋

磨蝕 _3

海浪效果

磨蝕 _6 高斯模糊 _4 高斯模糊 _7 小精靈 _1 小精靈 _2 陰影 _1

(9)

(13) 彩色鉛筆

彩色網屏

挖剪圖案

結晶化

乾 筆刷

網線銅版

陰影 _2

粒狀影像

靜電

壁畫 霓虹光 塗抹沾污

木材

版狀切割 塑膠覆膜 海報邊緣 粉蠟筆 塗抹繪圖 海綿效果 著底色 水彩畫

點狀化 (14) 遮色片銳利化調整

067

(15)

外框 立體浮雕

疊印預視

粉筆與碳筆

畫素預視

碳筆效果 鉻黃

打樣設定

蠟筆紋理

打樣色彩

筆畫效果

放大

網屏圖形

縮小

紙張效果

符合視窗

拓印

實際尺寸

石膏效果 網狀效果

隱藏路徑線段

印效果

隱藏畫板

邊緣效果

顯示頁面拼貼

溼紙效果

顯示裁切 鎖定裁

(16)

隱藏範本

邊緣亮光化

顯示尺標 隱藏邊框

(17)

顯示透明格點

068

嵌磚效果

隱藏

粒狀效果

參考線 (1)

裂縫效果

智慧型參考線

拼貼

顯示格點

鏡片著色

靠齊格點

紋理化

靠齊控制點 新增檢視視窗 編輯檢視視窗

(18) 反交錯 NTSC 色彩

(1)

隱藏參考線 鎖定參考線 製作參考線 釋放參考線 清除參考線

【功能下拉式清單】

新增視窗 串聯 磚瓦 安排圖像 作 對齊 外觀 屬 筆刷

Illustrator 協助 有關 Illustrator 有關外掛程式 歡迎視窗 教學 系統資訊 線上支援

顏色

升級

文件資訊

註冊

圖形預視 漸層

Illustrator 線上

繪圖風格 資訊 圖層 連結 自 選取 導覽器 路徑管理員 畫筆 SVG 互 色票 符號 工具 變形 透明度 文字 ( 略 ) 變數 筆刷資料庫 ( 略 ) 筆刷樣式資料庫 ( 略 ) 色票資料庫 ( 略 ) 符號資料庫 ( 略 )

069

【圖表篇】

069

070

【圖表篇】

吸菸有害健康，請勿吸菸

071

圖表 統計圖常見於簡報、新聞資料及 研 究 資 料 ... 等， 圖 像 化 的 數 據 資 料有取代文字的效果，幫助讀者閱 讀。 對於學習 Illustrator 的朋友實在 沒有理由不使用圖表工具的同時再 結合圖像美化作品，否則這和非設 計人員有何不同？

統計圖表 : 選取「圖表工具」任 何一項工具拖拉您要 的尺寸大小，桌面會 立刻出現一個浮 視 窗，根據資料輸入數 據完成後按右上角 「勾」鍵。 或在選取單一「圖表工具」後單響桌面，出現設定 大小的浮 視窗，決定圖表尺寸。

072

完成的圖表在「解散群組」前可以在選取狀態下使 用物件清單下的「圖表」改變類型、資料、設計， 以第一張拆線圖為例，重新選取圖表類視窗的圖表 選項即可修改成長條圖及橫條圖形式，當然數 據也是可以隨時更新的。

【圖表篇】

( 圖一 )

使用「圖表類型」浮 視窗調整圖表局部位置。 ( 圖一 ) 圖形保持選取狀態再回到物件清單下的「圖 表 / 類型 / 樣式」勾選「增加陰影」。

( 圖二 )

( 圖二 )「數值座標軸」改變參考數值位置。

( 圖三 ) 橫欄 :70 群集 :80

橫欄 :90 群集 :100

( 圖三 )「選項」下的「橫欄寬 度 / 群集寬度」改變 BAR 的大 小比例。

073

身為美術人員尤其是 Illustrator 的使用者，是不可 以直接用陽春圖表的，前面的局部調整也是不夠的， 我們只是要利用軟體精算的比例再重新賦予作品生 命。 圖表保持選取狀態做「解散群組」會出現一個警告 視窗，解散後的圖表不可以再回到「圖表」改變類 型或資料，作者仍習慣拷貝保留備分之後再做「解 散群組」的指令。 「解散群組」後的圖表只取圖形的部分，其餘數據、 座標全部刪除，重新填色後置入符合題意內容的插 圖。

074

【圖表篇】

( 圖一 )

( 圖二 )

為走勢圖的線條做出較有質感的霓虹效果。 ( 圖一 ) 首先必需解散原始圖形並且拆除曲線以外的 物件 ( 前頁左圖一 )。 ( 圖 二 ) 調 整 線 條 的 筆 畫 寬 度 ( 4~6pt) 並 勾 選「 圓 端點」，拷貝這條 線「Ctrl(Command)+C 鍵」後， 再貼至上層「Ctrl(Command)+F 鍵」，貼上去的這條 線筆畫寬度再改成 1pt 調成白色。

( 圖三 )

( 圖三 ) 全選兩條線段做「外框筆畫」。

( 圖四 )

075

( 圖五 )

( 圖四 ) 使用「漸變工具」選取內外兩端錨點，即可 做出霓虹效果，最後在線條轉折處貼上圓點標示所 需數據資料 ( 圖五 )。

( 圖六 )

( 圖六 ) 筆者示範這項步驟的時候經常有學員問道 : 「為什麼要轉『外框筆畫』?」如 ( 左圖一 )；兩條 線重疊不管有多 或多細，預視的藍色路徑是一樣 的，更何況是完全重疊在一起，實在是無法選取。( 左 圖二 ) 經過「外框筆畫」之後錨點出現在圖形的周圍， 兩條線的位置明顯區隔便於選取。

圓 形 圖 一 般 叫 做「 派 」 (PAI) 總和必需是 100% 的 情 況 下 使 用。 直 行 輸 入 數據圓形圖呈一字排開的 「面積比」，按「換直欄 / 橫 欄 」 鍵 再 按「 勾 」 鍵 即可做成圓餅圖形。

076

( 圖像創作純屬虛構，不代表真實投資組合 )

【圖表篇】

再為圓形統計圖 (PAI) 做圓餅或甜甜圈效果。 ( 圖一 ) 使用「選取工具」全選圓 PAI 稍做壓扁成橢 圓形。

( 原圖 )

( 圖一 )

( 圖二 ) 按住圖層 1 拖拉至圖層浮 視窗右下方的「製 作新圖層」兩次，新增兩分橢圓 PAI( 合計有 3 個完 全相同的圖件 )。 ( 圖三 ) 關閉「圖層 1(2) 拷貝」眼睛至「圖層 1」作業， 全選橢圓 PAI 做「聯集」指令成單一物件，再按「選 取工具 +Shift+Alt(Option) 鍵」垂直向下移 拷貝，

( 圖二 )

有了這兩塊橢圓再沿圓周新增一個矩形即可做出一 塊圓餅 ( 圖四 )。 ( 圖五 ) 打開「圖層 1 拷貝」眼睛即可看出圓 PAI 出 的立體效果。

( 圖三 / 聯集後的物件 )

( 圖六 ) 若要再做出甜甜圈圓 PAI 請打開「圖層 1 拷 貝」眼睛，全選「聯集」成單一物件，再雙響「縮 放工具 / 縮放 70%/ 確定」產生的小橢圓會置入橢 圓 PAI 中心位置。 ( 圖 七 ) 選 取 縮 放 後 的 小 橢 圓 按「 選 取 工 具 +Shift+Alt(Option) 鍵」垂直向下移 拷貝，兩個橢 圓必需是重疊的狀態。 ( 圖八 ) 全選兩個小橢圓做「分割」指令，刪除下面 的物件。

( 圖四 / 兩個橢圓形成的圓餅 )

( 圖六 )

( 圖五 )

( 圖七 )

( 圖九 ) 分別處理分割後的橢圓物件顏色， 上面的填深色形成厚度效果，中心的部分 ( 或底色 ) 自然形成挖空效果。 (填白色 ( 圖九 ) 圖八 )

077

078

【圖表篇】

CIS 設計文字的應用 Illustrator CS 的「文字」新增不少 好玩實用的工具，要提醒讀者的是； 不少工具是另外放置在「編輯、物件」 清單下，在實戰的過程中一起帶您去 瞭解。

079

台北郵政信箱 666 號

拾參姨 女士收

( 圖像創作純屬虛構，如有雷同實屬緣份 )

( 圖一 / 裁切線方法一 )

( 圖二 / 裁切線方法二 )

( 圖一 ) 製作名片或任何稿件決定尺寸後若需要裁 切線，請在物件清單下的「裁切線 / 製作」，完 成裁切線之後本身的矩形會消失掉，假如是滿版 出血的底圖自然是要大過裁切的範圍，以這次名 片為例；在製作裁切線之前請先拷貝一次矩形 「Ctrl(Command)+C 鍵」，完成裁切線再將矩形 貼至上層「Ctrl(Command)+F 鍵」。這種方式做 的裁切線是不能被選取的，置入排版軟體裁切線 也不會產生預視。

080

( 圖二 ) 濾鏡清單下的「建立 / 物件裁切線」也 可以製作裁切線，可以保留原始矩形並接受選取 移 、縮放 ... 等指令，在排版軟體裁切線可以產 生預視。 ( 圖三 / 裁切線方法三 )

( 圖三 ) 矩形保持選取狀 態使用檢視清單下的「參 考線 / 製作參考線」製作 設定範圍參考線，這條線 在螢幕可以預視但不會列 印或分色出來。

【圖表篇】 文字篇

齊中 ( 圖一 )

選 取 文 字 塊 使 用「 文 字 對 齊 工 具」的齊中 ( 圖一 )、齊左 ( 圖二 )、 齊右 ( 圖三 )。 文字一旦建立外框字即於於圖 形狀態，必需先群組字塊再使用 一般「對齊工具」。 所有文字的編輯整理都必需在 未建立外框字的情況下。 ( 圖二 )

081

( 圖三 )

齊左

齊右

公司

有限

股份 2樓 3號 顧問 壽路 06 -16 10松 88 市1 -87 65 02 -54 25 話／ -27 2 信箱 電 0 7號 真／ 0-8 8 傳 政／ 郵 台北 科技

遠景

台北

082

遠景科技顧問股份有限公司 台北市110松壽路3號2樓 電

話／02-8788-1606

傳

真／02-2725-5465

台北郵政／80-87號信箱

製作信 的橫線不必一條一條逐 一的畫，只要先畫頭、尾兩條等 寬的平行線，雙響「漸變工具」 設定「指定階數、指定距離」， 線條保持選取狀態下點選兩端線 條即可完成等寬等距的平行線。 線條保持選取狀態雙響「漸變工 具」重新輸入指定參數即可改變 線條的距離及數量。

文字篇 【圖表篇】

字體的品牌及種類之多固然是設計者的褔音也是困 擾，尤其是英文字體假如沒有型錄的話往往要花一 些時間在瀏覽上，所幸在新的 Illustrator 字體的下拉 式清單提供了字體名稱及字型預覽，相較於文字浮 視窗僅提供字體名稱，在搭配使用上給設計者更大 的操作空間。

(Times New Roman)

(Arial Black/Italic)

( 黑)

083

(Arial Bold) ( 黑 ) (Arial Bold)

( 圖一 )

( 圖二 )

( 圖三 )

084

( 圖一 ) 文字游標打字或置入 .TXT 文字檔通常是呈 橫排型式，選取文字塊使用文字清單下的「文字方 向 / 垂直」可使文字轉直排，但文中的數字或英文 也會跟著直排，這時候單獨選取數字到文字浮 視窗 的「直排內橫排」即可讓局部文字改變方向 ( 圖二 ) 適用在中英文 ( 數字 ) 合用的稿件。某些字的字間太 開例如「11」使用「AV」調整字間密度。( 圖三 )

【文字篇】

5pt 中明字體 / 字高 100%/ 字寬 100%/ 行距自 。

5pt 中明字體 / 字高 100%/ 字寬 100%/ 行距 8pt。

正式進入打字工具建議「字元、段落」的浮 視窗一 定要在桌面上 ( 視窗清單下的「文字」)。 文字保持選取狀態還未建立外框字時，調整字形的 高寬比例。

085 12pt 明字體 / 字高 100%/ 字寬 100%。

5pt 中明字體 / 字高 100%/ 字寬 100%/ 行距 10pt。

12pt 明字體 / 字高 100%/ 字寬 125%( 字高不變，改變寬度 )。

12pt 明字體 / 字高 100%/ 字寬 150%( 字高不變，改變寬度 )。

12pt 明字體 / 字高 75%/ 字寬 100%( 字寬不變，改變高低 )。

12pt 明字體 / 字高 50%/ 字寬 100%( 字寬不變，改變高低 )。

級級 字寬

行距 字高

( 圖一 )

( 調整前 )

( 調整後 )

微調行距

086 ( 圖二 )

( 圖三 ) ( 調整前 )

當我們處理一般表格會因為受限左右寬度限制必需 折行，若全文使用正常行間會出現局部懸浮不能居 中的情形 ( 圖一 )，這時候請選取局部文字使用文字 浮 視窗的「局部行間微調」輕壓上下三角形符號 可以向上 ( 或向下 ) 調整行間距離，達到居中的目 的 ( 圖二 )。 ( 圖三 ) 某些條作下的文字左右列選項則需個別選取 逐一微調，才能達到平行居中對齊。

( 調整後 )

【文字篇】

087

練習的題材不妨來一點輕鬆的主題。 文字繞圖可以賦予文字活潑有趣，常見於設計人員 的喜愛的表現手法，只要先以鋼筆工具畫出路徑並 保持選取狀態，使用「路徑文字工具」壓在路徑上 打字即可。

「路徑文字」提供浮 視窗供設計者更精確 的設定。

(3D Ribbon 立體鍛帶 )

除了文字工具的「路徑文字」以外，在文字清單下 又新增了五種文字沿路徑走文時的一些變化，供設 計者使用。

(Rainbow 彩虹 )

(Stair Step 梯形 )

(Skew 斜形 )

(Gravity 重力 )

088

【文字篇】

使 用「 區 域 文 字 工 具」必需先畫好一個 閉 路 徑 範 圍， 置 入 文 字 檔 內 容 (.TXT) 或直接在路徑內打 字即可呈現一個有 造型的文字圖塊。

089

090

製作 面 : 使用檔案清單下的「文件設定」設定 面尺寸大小 ( 或在矩形工具設定長 寬尺寸 )，並在濾鏡清單下的「建立 / 物件裁切線」製作好文件裁切線， 折線需以「鋼筆工具」另外繪製。

【文字篇】

( 圖一 )

許多使用者習慣在 Illustrator 執行如排版軟 體相同的排版功能，對於少頁數的印刷品 如 面、型錄而言的確是不錯的選擇。 ( 圖一 )「文字工具」隨意拖拉一個文字塊， 置入 .TXT 文字格式檔案，文字保持選取 狀態使用文字清單下的「文字區域選項」， 此時會出現浮 視窗輸入「欄數及間距寬度、 文字流向」按確定鍵。

按確定鍵之後除了欄數及間距寬度、文字流向不變 以外，文字欄寬及長度是可以以手 拖拉文字塊的錨 點自由調整的。 若要改變欄數或文字流向等條件，只要選取文字塊 重輸入浮 視窗的設定即可。

091

( 圖二 ) 拖拉文字塊置入文字。

( 圖三 ) 直欄數量輸入「2」的走文形式。( 圖三 ) 直欄數量輸入「3」的走文形式。

文字溢排符號

092

編排簡單的一欄文字，直接使用「文字工具」拖拉 矩形範圍置入文字即可，不必設定「直欄及橫欄」 模式，若文字塊右下角有「+」符號表示還有文章沒 走完，直接拉開下面中間的錨點直到「+」符號消失 為止。 當我們完成的稿件要交接給另一位設計者或客戶要 進行修改時，面對使用多種以上字體。在文字清單 的「尋找字體」，視窗的清單會列出所用到的字體 名稱，按「文件中的字體」游標會逐一標示，和右 欄的「找下一個鍵」功能是相同的。 若要更正字體最方便的方式就是選取文字到「字元」 浮 視窗直接更改，但是假如是一篇很長的連續頁或 字體交叉重複使用的型錄、說明書之類的稿子這麼 做的話眼睛可能就要脫窗了，使用「尋找字體」先 選取「文件中的字體欄」( 上 ) 的字體名稱再到「取 代字體從欄」( 下 ) 尋找新字體，按「更改鍵」即能 完成更改字體。當然這種能功能不適用建立外框字 以後的文字。

【文字篇】

英文稿或中文含有英文字的稿件，選取文字部分使 用文字清單的「更改文件」可以改變大寫、小寫、 大小寫混合的功能。 ( 註 : SARS 正確為全部 大寫，左圖僅為示範說 明)

更改為小寫 大小寫混合

更改為大寫 更改為小寫 字首為大寫

093

文稿當中難免有錯別字輸入的情形發生，例如「意 大 利 」 更 正 為「 義 大 利 」，「 沖 擊 」 更 正 為「 衝 擊」... 諸如此類若要逐字校對絕對更正不是數位生 活下應該有的情形。 選取文字塊使用編輯清單的「尋找 / 取代」在「尋 找欄」輸入文字，再到「取代欄」輸入更正的文字， 並連續按「找下一個鍵」( 假如文章很長的話 ) 游 標會逐一選取標示。按「更正鍵」完成單字的更正， 若文中有兩個以上相同的錯別字按「全部更正鍵」 可以一次搞定。

文字繞圖是設計稿中常見的手法，在 Illustrator 可以 做到和排版軟體類似的效果，請注意這項功能竟然 不在文字選項內而是在物件清單下的「文字變形」。 圖片 ( 包括去背景不規則輪廓的 eps 檔 ) 置入文字上 層，同時選取圖、文兩個物件使用「文字變形 / 製 作」文字會繞過圖片路徑排文 ( 圖一 )，文章太長會 在原本的路徑內溢排 ( 圖二 )，也就是說被圖片佔去 原來文字的部分停留在字塊內，必需重新選取文字 塊把文字拉開。

094

首先會出現一個對話框按「確定」鈕之 後才會出現正式的浮 視窗。

( 圖一 )

輸入文字與圖形的距離，若不滿意還可 以到「文字變形選項」重新改變參數。 ( 圖二 )

【文字篇】

( 圖一 ) 原稿

取代連結

( 圖二 ) 取代連結後的稿件

完稿置入的圖檔難免經 過修改或是重新換圖， 假如是相同尺寸、相同 位置只要圖件在選取狀 態 下， 使 用「 連 結 浮 視窗」下方的「取代連 結鈕」會跳出置入圖像 的預覽視窗，選取重新 取代的檔名後後會立刻 進 入 檔 名 欄， 過 再 按 「置入」鈕後圖像立刻 更新，即便是這張圖做 過「剪裁切遮色片」也 不會有任何影響。

095

Illustrator 過去讓人熟悉的「文 字繞框、路徑文字 ...」現在又 新增了「文字 套」可以在指 指定的路徑置入文字。這項工 具不在文字列裡面，而是安排 在 物 件 清 單 下 的「 套 變 形 / 指定物件範圍」。

這一篇文章，可能是一整頁的文字要擷 取一小段放在放大鏡的圓框內，而且是 產生圓弧透視的效果。

096

同時選取文字塊及路徑，路徑框必需要在文字的上 層， 套內的文字在檢視清單下的「外框」只是虛擬 的因此不能建立外框字或填色。反之您可以先建立 外框字或填好色字再製作文字 套。

【文字篇】

( 圖一 )

( 圖一 ) 除了自定路徑之外，「 套變形 / 製作彎曲」 內建 15 種格式有可供選擇。

( 圖二 / 向量圖原稿 )

097

(Photoshop 8.0 開啟的圖層 )

( 圖三 /Photoshop 8.0 開啟的情形 )

( 圖二 )Illustrator CS 製作的文字 ( 未建立外框字 ) 轉 存 PSD 檔，進入 Photoshop 的環境下圖層保留，文 字仍然是「文字」的狀態包括文字繞圖的路徑，也 就是說可以在 Photoshop 使用「文字工具」 改變字 體及顏色，但僅限於 Photoshop CS(8.0)，以下的版 本在讀取時文字只是圖形而已 ( 圖三 )。

【網頁篇】

97

0 98

http://www.artister.idv.tw

【網頁篇】

網頁 這年頭看文藝片不能沒有床戲鏡頭， 作片不 能沒有槍戰場面，否則文藝片不叫文藝片， 作 片不叫 作片。 繪圖軟體也不能沒有網頁功能否則就不叫軟 體了，假如電腦書沒有介紹網頁，後果可能是 沒有人會買了。 當讀者學會 Illustrator 的繪圖技巧，別忘了做 個個人網站大家一起來飆稿 !

0 99

wowsite@mail.apol.com.tw

製作網頁必需先確定 : 取材影像圖檔請先在 Photoshop 更 改 RGB 模式。 或在 Illustrator 檔案清單下的「文件 色彩模式」修改色彩模式，同時顏 色浮 視窗的選項也必需是 RGB 模 式。 切割選取範圍

100

設計好一張首頁圖稿或直接畫一塊 矩 形， 使 用「 切 片 工 具 」 拖 拉 一 個超聯結範圍，再到物件清單下的 「切片 / 切片選項」在 URL 欄輸 入連結網址。

尚未切割選取範圍

【網頁篇】

切片類型 : 無影像：檔案輸出切割的表格但不含圖 像。 影像：檔案輸出包含表格及圖像。 HTML Text：根據文字切割的情況下，原 來的文字轉存 HTML 文字檔。

目標 : blank/ 空白視窗 : 在瀏覽器開一個新檔檢視連結網頁，原本視窗 還存在。 self/ 視窗本尊 : 原來的網頁視窗被連結的網頁所取代。 parent/ 上一頁框視窗 : 使用 Frame 時連結的網頁會回到上一層的 Frame 存在的位置。 top/ 全視窗 : 連結的網頁以全視窗呈現電腦銀幕。

( 圖一 ) ( 圖二 )

訊息 : 輸入文字，在瀏覽器觀賞時將滑鼠移至切割區域，瀏覽器的狀態 列 ( 最下欄 ) 會出現輸入的文字。( 圖一 )

其他文字 : 輸入文字，在瀏覽器觀賞時將滑鼠移至切割區域暫停時，「其他 文字」的內容會出現在切割區域。( 圖二 )

101

( 圖二 )

( 圖一 )

使用「切片工具」拖拉局部範圍，整個圖件出現大 小不等矩形分割畫面，但只有深紅色範圍可以接受 選取、編輯、做網路連結的，粉紅色是尚未切割的 範圍，在選取的狀態下是不接受「切片選項」的。

選取切割以外的矩形框 「切片選項」沒有作用。

102

「切片選取範圍工具」可以重新修正先前切片左右 寬度或高低範圍，再新新輸入連結網址。 回到檔案清單下做「儲存供網頁使用」。在網路連 線狀態雙響儲存的檔案夾，或直接拖拉檔案夾至網 頁瀏覽器可以立刻感受到成果。

【網頁篇】

使用「切片工具」切割圖件，除 了可以徒手拉矩形的方式，面對 有組織的區域也可以利用軟體特 處理整齊畫一的切割，不致於產 生重疊零亂的情形。

( 圖一 )

( 圖 一 ) 檢 視 清 單 下 的「 顯 示 尺 標」從左側或上方拉出參考線範 圍。( 圖二 )

( 圖二 )

( 圖三 )

( 圖四 )

( 圖 三 ) 選 取 參 考 線 範 圍 的 物 件， 使用物件清單下的「切片 / 從參 考線建立」，根據參考線完成切 片效果。

103

( 圖一 )「矩形工具」 拖 拉 一 個 範 圍， 使 用 物 件 清 單 下 的「 切 片 / 從 選 取 範 圍 建 立 」， 根據選取範圍完成影 像切割。

( 圖一 )

104

( 圖二 )

( 圖二 ) 製作超連結以手工方式可以使用「切片工具」 拖拉選取範圍直接產生，或是回到物件清單下的「切 片 / 釋放」重新選取或放棄。

( 圖三 ) 也可以使用「矩形工具」選取範圍再到物件 清單下的「切片 / 製作」同樣可以切割圖件輸入超 連結網址。

( 圖三 )

【網頁篇】

輸入連結網址

影像地圖 : 叫出視窗清單下的「屬 」浮 視窗。 經過選取範圍將圖件的部分連結到某 個網站的功能。 任意選取圖件某一物件使用「屬 」 浮 視窗的「影像地圖 / 矩形」輸入 連結網址，此時的電腦必需是連線狀 態，按「瀏覽器」扭即可立即連線至 輸入的網站。 「影像地圖」分別有「無、矩形、多 邊形」可依選取圖形實際情形選擇。

105

( 圖一 )

106

( 圖二 )

( 圖一 ) 原本切割的範圍保持選取狀 態 下， 使 用 物 件 清 單 下 的「 切 片 / 分割切片」產生浮 視窗，原來一個 切片再根據輸入的參數分割更多的 區域，再選取個別切片設定切選項， 連結需要的網站。( 圖二 )

【網頁篇】

對於切片選取範圍是可以使用物件清 單下的「切片」再做調整編輯的。 ( 圖一 ) 切片 / 複製切片。 ( 圖二 ) 切片 / 結合切片。 ( 圖三 ) 切片 / 刪除全部，回復原始 狀態重新編輯。

( 圖一 )

107 ( 圖二 )

複製切片 結合切片 刪除全部

( 圖三 )

製作 畫 : 基 本 上 使 用 Illustrator 製 作 畫 和 Photoshop 的 Imageready 一樣，都是利用圖層一層一層的播放方式。 ( 圖一 ) 取材前面完成的作品做為題材，故事從捷運 站開始也就是從圖層 1 開始向上複製。 滑鼠游標按住圖層 1 拖拉至頁面圖案「製作新圖層」， 原圖產生相同位置等比例的拷貝替身。 ( 圖一 ): 圖層 1/ 播放第一格

108 ( 圖二 ): 圖層 1 拷貝 / 播放第二格

( 圖三 ): 圖層 1 拷貝 2/ 播放第三格

( 圖二 ) 故事從空無一人的車站開始，第了第二格當 然要有列車經過，我們用相同「製作新圖層」的方 式再拷貝一層圖層，分層表現車頭、完整列車、車 尾經過的效果 ( 圖三 ~ 四 )。

【網頁篇】

每製作一次新圖層 ( 拷貝圖層 ) 必需檢視一次場景， 相同的背景是否保留或刪除，( 圖五 ) 在列車駛過之 後自然又回到空無一人的車站，到了下一格 ( 圖六 ) 再新增兩個人重新等車。 因此重複拷貝五個圖層完全相同的圖件就是車站， 其餘根據故事內容增減物件。本章節圖例一共使用 了六個圖層，預覽時就是利用這六個圖層播放。 檔案清單下轉存 畫檔 (SWF) 產生兩個檔案夾都可以 雙響或拖拉至瀏覽器預覽播放效果。 ( 圖四 ): 圖層 1 拷貝 3/ 播放第四格

109 ( 圖五 ): 圖層 1 拷貝 4/ 播放第五格 勾選「迴圈」 可以自 重複 播放。

( 圖六 ): 圖層 1 拷貝 5/ 播放第六格

( 完成作品 )

使用「儲存供網頁使用」進 入設定視窗簡單介紹常用工 具。 ( 圖一 )「原始」出現單一視 窗，預視的圖件為原始檔案 的情形左下角標示檔案大小。 ( 圖二 )「最佳化」也是出現 單一視窗，預視的圖件為最 佳化以後的情形，左下角標 示的檔案大小自然和原始圖 明顯不同。 ( 圖一 )

( 圖二 )

( 圖三 ) 使用左上角工具箱 的「手形工具」可以移 圖 件預視位置。 「二欄式」出現兩個視窗， 顯示原始檔及最佳化的比較， 左下角的標示資料明顯不同。

110

( 圖三 ) ( 圖四 ) ( 圖五 )

單響瀏覽器圖形立即進入網頁狀態。

( 圖 四 )「 四 欄 式 」 出 現 四 個視窗，除了上述兩個檔案 形式再多出更低階品質檔案， 多出來的視窗可以供使用者 做最理想的設定，單響決定 的檔案視窗即可。 ( 圖五 ) 使用左上角工具箱 的「放大鏡工具」可以局部 放大觀察圖件細部。

【網頁篇】

111

做好的網頁作品相信已是迫不急待的想驗收成果了 吧! 檔案清單下的「儲存供網頁使用」畫面會產生設定 視窗，可以將作品儲存成 GIF、JPEG、PNG 三種格 式確定後按「儲存」，再選擇存檔類型再按一次「儲 存」，電腦保持連線狀況雙響檔案夾即可進入瀏覽 器觀賞。