B.02 Vector vs. Bitmap
Martian Copyright Vector vs. Bitmap Taiwan vs. China Vector Fonts Cloud Fonts Solution Vision
Calligraphy
《目錄》
‧Computer Graphic ( 電腦繪圖 )
‧Bitmap Editing
‧Vector Editing
‧Bitmap Authoring
‧Vector Authoring
‧Mars Talks
▲
電腦繪圖，可以分為三大類：2D 點陣、2D 向量、3D ( 視訊軟體 可謂 連續的 2D 點陣圖，3D 建模 在本質上則是 立體的向量圖 )
……………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………
首先來看 點陣圖（2D 點陣）：
Bitmap 意指每一個位元 ( bit ) 都對映到一個畫素 ( 一個畫素當然只有一個顏色 )，而這些畫素依長寬排成一個 矩陣，就構成了一個圖檔 ( map )
放大到 3200%，就可以看到一堆位元畫素
在電腦上看到的是一堆方塊，但在 印刷 與 列印 則是一堆點，故名 點 陣圖
上圖摘自：
這張圖是網路上的圖檔，因為下例的研究 ( 身材 )，筆者合理使用本圖，特此聲名
點陣圖軟體 ( 如 Photoshop ) 已經從單純的 影像 ( 照片 ) 處理 演變成多功能的軟體了：
內容感知比率
Photoshop 3D
別忘了比較一下 Flash CS4 的 3D 功能：
Photoshop OpenGL
Photoshop 現在數位筆繪的功能也不差
Corel Painter 也有這種畫布旋轉的功能 ( Painter 也屬於點陣軟體，只不過 Painter 主要是以 數位筆 + 繪圖板 來替代 滑鼠 罷了 )
■ Photoshop：點陣軟體的唯一天王
■ Corel Painter：數位筆繪的唯一天王
■ Corel Photo-Paint：與 Photoshop 同等級，只不過永遠就是輸 Photoshop 一步之遙
■ Corel Paintshop Pro：窮人版的 Photoshop
■ Corel Photoimpact：初學點陣軟體者的最愛
連續的點陣圖就是視訊檔，所以專精點陣的 Adobe 很早以前就推出 Premiere 也就不意外了
Photoshop vs. Plug-Ins，所以 Premiere vs. After Effects 也就不意外了
Photoshop 是 Adobe 併購來的
Adobe 成立時是以 PostScript ( 後來 PostScript 變成印刷界唯一的標準語言 ) 起家，故 Illustrator 是 Adobe 的強項也就不意外了
有了 Illustrator 與 PostScript，Adobe 會推出 Acrobat 也就不意外了
有了 Illustrator，Adobe 會先併 Pagemaker、Framemaker、再推出 InDesign 當然也不意外
唯一的意外就是 Macromedia 推出了 Dreamweaver 與 Flash ( Flash 是 Macromedia 併購來的 )
Adobe 先併 GoLive、再推出 LiveMotion 來與 Macromedia 抗衡，結果都落敗了
打不贏就買下來，故 Adobe 最後併了 Macromedia 也就不太意外了
……………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………
再來看看 向量圖（2D 向量）：
在藍點上拖曳看看，這就是向量圖的最基本：貝茲曲線 ( Bézier Curve 
)
( 三次貝茲曲線 ) ( 四次貝茲曲線 )
向量軟體就是先繪製貝茲曲線 → 封閉曲線填色或是外框填色 → 一堆貝茲曲線構成一個圖檔
不像點陣軟體有很多可以選擇，向量軟體就只能 Illustrator, CorelDRAW 二選一
當然還有 Canvas, Corel Designer, Xara, Microsoft Expression Design 等等，但都無法與 Illustrator, CorelDRAW 相提並論
貝茲曲線最具體的表現，就是 電腦字型 ( 電腦字型就是以貝茲曲線所編製的 )
首先來看看筆者以 CorelDRAW 畫出的 王羲之《 蘭亭序 》的向量版，請按框框切換之：( 下圖是 Flash )
■：黑色
□：外框
向量圖的特性就是縮放不失真
您可以在上圖的 筆劃處 按右鍵 > 放大顯示：( Flash 載入向量檔，放大到一定的程度後，就會看到很多瑕庛 )
向量圖一定會有很多節點：
( 在電腦字型的情況下，節點再多都很有限；但若是書法復刻，節點再多都不夠，此筆者最後以點陣圖復刻《 神龍本 》之由也 )
放大來看，雖然節點不少，但細節處實在是力有未逮：
下圖的毛筆字是 CorelDRAW 繪製的，其餘的都是以 Photoshop 滑鼠繪製的
再以 Photoshop 的套索繪製鈐印、以 Photoshop 處理成仿舊的效果
當然啦，如果以 Photoshop 來編製毛筆字，效果會更好
以 Photoshop 編製毛筆字所付出的代價就是 縮放會失真
但就是為了顧及品質，所以筆者在復刻《 神龍本 》時，選擇點陣圖的方法
不管以向量還是點陣來編製毛筆字，最後都能轉成點陣圖
轉成點陣圖的好處就是可以有比較多的變化：( 下圖是 Flash，可以在其左上角的四個按鍵切換 )
向量書法除了縮放不失真的優點之外，還有一個點陣圖所欠缺的優點：
那就是向量書法可以輕易地轉成 3D
簡單來說：
‧毛筆字要質感，請用點陣圖
‧毛筆字要 3D，就用向量圖
‧毛筆字要縮放不失真，就用向量圖
▲
這是網路上找得到最大又最清楚的《 神龍本‧蘭亭序 》：( 4180 × 1480 pixels )
下載唄：
下載好了以後，就可以開始 去背 了：
Photoshop 大半的去背，都可以採 套索 行之 ( 如果您很熟套索，一定贊同筆者的說法 )
上例若是 路徑 去背的話：
‧路徑 去背的過程會非常費工，而且去背的效果也不一定比 套索 好
‧路徑 去背一定會把毛筆字的筆劃去掉一些些，這樣子毛筆字的味道就不對了 ! ( 別人的毛筆字就算了，但是 王羲之 的字緣若是被去掉一些些，懂書法的人一眼就看得出來 )
……………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………
這是去背後的圖檔：( 25% )
看起來非常漂亮
同理，如果是一個書法商品，只要圖檔不大，看起來都馬很好看
這是去背後的圖檔：( 50% )
看起來還是很漂亮
同理，如果是一個書法商品，只要圖檔不太大，看起來都馬很好看
這是去背後的圖檔：( 75% )
看起來依舊是蘭亭序的原貌
同理，如果是一個書法商品，只要圖檔不是大到會現出原形，看起來都馬很好看
這是去背後的圖檔：( 100% )
看起來一樣很漂亮，但字緣的缺失已看得出來 ( 不然筆者為何要復刻 )
所以，如果是一個書法商品，只要不是原寸的圖檔，看起來都馬很好看，但也很騙人
……………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………
上例的去背方法雖然還可以強化到字緣可以比較平順圓潤
但是 筆者光是完成上圖，就花了一個工作天 ! ( 所以復刻神龍本才會花了半年 )
喜歡上例嗎 ?! 把拔 送給您：
套用前述 色階 ( Ctrl + L ) 的 白滴管 來去背、以 套索 來去背：圖檔一定會有一些些損失
如下圖，本來已經不明顯的鈐印外框，仔細比對看看，去背後又少了一些畫素
上圖的鈐印是明朝大收藏家 項元汴 
( 項子京 ) 的鈐印之一：項子京家珍藏
……………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………
如同考據古代書法是否為真跡時，鈐印是很重要的參照
重製 ( 去背 ) 重得好不好、改作 改得好不好、復刻 復得好不好、…，鈐印也是很重要的參照
《 神龍本 》只要比對 項子京家珍藏 這個鈐印，便知用家是否用心：因為這是最細微處，只有用心者才會去留意
首先在大陸的 nipic 昵圖網 輸入 蘭亭 ( 兰亭 ) 二字來搜尋 ( 這裡有一狗票 重製、改作、復刻 的圖檔 )
筆者挑幾個重製的東東來比對看看
Case 01
圖上 是 nipic 的圖檔，圖中 是筆者前述的去背圖 ( 已縮小到與 nipic 圖檔相同的大小 )，圖下 是筆者的復刻本 ( 已縮小到與 nipic 圖檔相同的大小 )
這傢伙已經算是用心了，去背後，還花了很多時間修字緣 ( 與鈐印 )，所以筆劃看起來比較粗
但是一看鈐印，就處處是敗筆：如 項子京家珍藏 的鈐印邊框，就完全不見蛋 !!
《 神龍本 》 ■■■■■■■■■■
火摹本 ( 火星復刻 ) ■■■■■■■■■□
火星去背 ■■■■■□□□□□
Case 01 ■■■□□□□□□□
Case 02
《 神龍本 》 ■■■■■■■■■■
火摹本 ( 火星復刻 ) ■■■■■■■■■□
火星去背 ■■■■■□□□□□
Case 02 ■□□□□□□□□□
去背的技巧太差，所以去到筆劃變得有點細
鈐印不是缺了一大堆，就是到處亂蓋 ( 印與字重疊處都被修掉，實在是醜到爆 !! )
Case 03
《 神龍本 》 ■■■■■■■■■■
火摹本 ( 火星復刻 ) ■■■■■■■■■□
火星去背 ■■■■■□□□□□
Case 03 ■□□□□□□□□□
雖然有想到要讓底色泛黃，但鈐印卻缺了一大堆
Case 04
《 神龍本 》 ■■■■■■■■■■
火摹本 ( 火星復刻 ) ■■■■■■■■■□
火星去背 ■■■■■□□□□□
Case 04 ■□□□□□□□□□
大哥，您去背的功力差就算了，怎整個右半邊連一個鈐印都沒有 !!
Case 05
《 神龍本 》 ■■■■■■■■■■
火摹本 ( 火星復刻 ) ■■■■■■■■■□
火星去背 ■■■■■□□□□□
Case 05 □□□□□□□□□□
無言 …… ( 不是有底色便是娘 )
Case 06
《 神龍本 》 ■■■■■■■■■■
火摹本 ( 火星復刻 ) ■■■■■■■■■□
火星去背 ■■■■■□□□□□
Case 06 □□□□□□□□□□
無言 …… ( 鈐印勒 ?! )
如果老共知道筆者這邊有 4176 × 1480 pixels 的《 火星去背神龍本 》可以下載，那麼保證 老共那邊的工藝品 全都會長得一模一樣 ( 也就是說老共會把筆者的檔案拿去商用，而沒有取得筆者的授權 )
所以筆者打死也不會釋出《 火摹本 》，不然辛苦半年的成品就泡湯了
▲
首先，以 Illustrator 來點陣轉向量：( 因為點陣大圖轉向量會很耗 CPU 的運算，故以小圖行之 )
以下就以 《 火星去背神龍本 》 來比較看看 書法 與 照片 在 Illustrator 點陣轉向量 ( 即時描圖 ) 的效果
Corel 公司因為擴充太快爆發財務危機而被併購下市，反之 Adobe 併購 Macromedia 而更加壯盛
這一來一返，本來 CorelDRAW 比 Illustrator 好用多了，現在已落得打平
不過在 點陣轉向量 這個功能，CorelDRAW 還是比 Illustrator 順手且好用多了：
……………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………
不管是 Illustrator 還是 CorelDRAW，來源的 《 火星去背神龍本 》 筆劃與鈐印不夠細緻，所以怎麼點陣轉向量，效果都很有限
來，以下以 《 火摹本 》 來點陣轉向量，一切就大大不同了
這是 前述 怎麼點陣轉向量都不好看的《 火星去背神龍本 》：
這是 原寸 的《 火摹本 》
( 原寸 筆者都不願意釋出了，所以更精緻的 二倍大，筆者當然更不可能釋出 )
只要點陣圖夠清楚，直接用 Illustrator 即時描圖的 6 色，即可轉出漂亮的向量圖：
老共那邊連去背都去不好，就更遑論有能力以復刻的版本去點陣轉向量了
以下就來看看老共《 蘭亭序 》的向量版
……………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………
Case 01
火摹本 轉向量 ■■■■■■■■■□ ( 火摹本 轉向量後，如果再手工編修，才能達到 ■■■■■■■■■■ )
火星去背 轉向量 ■■■■■□□□□□
Case 01 ■■□□□□□□□□
去背的功力不佳、鈐印也看不清楚
Case 02
火摹本 轉向量 ■■■■■■■■■□ ( 火摹本 轉向量後，如果再手工編修，才能達到 ■■■■■■■■■■ )
火星去背 轉向量 ■■■■■□□□□□
Case 02 ■■■□□□□□□□
去背還算是認真，但雜訊卻沒去乾淨 ( 如右下角 )，有點「為德不卒」、「行百里半九十」的味道
Case 03
火摹本 轉向量 ■■■■■■■■■□ ( 火摹本 轉向量後，如果再手工編修，才能達到 ■■■■■■■■■■ )
火星去背 轉向量 ■■■■■□□□□□
Case 03 ■■□□□□□□□□
去背還算是認真，但鈐印也少了太多了吧 …
Case 04
火摹本 轉向量 ■■■■■■■■■□ ( 火摹本 轉向量後，如果再手工編修，才能達到 ■■■■■■■■■■ )
火星去背 轉向量 ■■■■■□□□□□
Case 04 ■□□□□□□□□□
去背還算是認真，但鈐印勒 ?!
Case 05
火摹本 轉向量 ■■■■■■■■■□ ( 火摹本 轉向量後，如果再手工編修，才能達到 ■■■■■■■■■■ )
火星去背 轉向量 ■■■■■□□□□□
Case 05 □□□□□□□□□□
只有 4 個字，也不修一修邊 !
Case 06
火摹本 轉向量 ■■■■■■■■■□ ( 火摹本 轉向量後，如果再手工編修，才能達到 ■■■■■■■■■■ )
火星去背 轉向量 ■■■■■□□□□□
Case 06 ■□□□□□□□□□
不是加了 一張圖，就可以掩飾編製偷懶的事實 !
簡單來說：
13 億的老共，沒有一個人願意花時間把《 神龍本 》好好去背一下
沒有好的去背，自然就沒有好的點陣轉向量
▲
在 Martian Calligraphy 中有這張圖，以下就來看看如何是編製出來的：
某個角度言，老共是「先求 有、再求 好」
好：目前還 好 不過台灣 ( 但要追上也不會太久 )
有：很多台灣就 沒有 了 !! ( 這一點台灣人就要檢討了 )
老共 有 這個網站：
在 Word 中，把繁體字轉成簡體字 → Copy → 在 國墨書法網 中貼上，就可以搜尋歷代的書法了：
找出字體相近的字，就可以開始 〝復刻 〞了
上例隨便以 Photoshop 套索工具 撇一撇的書法字，不錯看吧：
筆者當然不會釋出《 火摹本 》的方法，所以上面 Photoshop 套索工具 的方法，您就加減用唄
老共那邊目前並沒有 Bitmap Authoring 的《 蘭亭序 》
簡言之就是：火星既出、誰與爭鋒 ^+++++++++++^
……………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………
只要復刻出書法字，在 Photoshop 就可以輕易加工之
請先下載 Adobe Layer Styl e ( *.asl ) 圖層樣式 檔：
★ Rapidshare 使用說明 ★
這是 背景透明的 PNG 檔，IE > 在圖上按右鍵 > 另存圖片 > 即可使用
▲
不管是 Illustrator CS4 or CorelDRAW X4，現在都既肥又操作費工，所以筆者以 CorelDRAW 9 來示範如何以向量軟體來繪製書法：( 點陣轉向量只算是 Vector Editing，不算是 Vector Authoring )
Vector Authoring 很費工是一回事
重點是：不管兩個節點有多靠近，兩個節點中間的曲線就只能是 曲線 or 直線，很難有更多的細節 ( 更多的細節就要更多的節點 )
總不能讓兩個節點間的距離只有幾個 pixels 吧，就算可以，那就會到處是節點，節點會多到擋住筆劃，那將更難編修
對照一下筆者前面說過的：
向量圖一定會有很多節點
( 在電腦字型的情況下，節點再多都很有限；但若是書法復刻，節點再多都不夠，此筆者最後以點陣圖復刻《 神龍本 》之由也 )
大概再塞入三倍以上的節點，就可以兼顧筆劃的細節：只不過筆劃都被節點蓋滿了，故也很難編修
▲
這是 MIDI 檔，20 KB：
檔案小、音質差、但易於編輯
這是筆者以 ACID 匯入 MIDI 檔、再加上 Wave ( MP3, WMA, ... ) 檔的配樂，2.4 MB：
檔案大、音質佳、但不易編輯
這是 Wave ( MP3, WMA, ... ) 檔：( 指聲音的部份 )
檔案大、音質佳、但不易編輯
向量 vs. 點陣，就好像 MIDI vs. Wave
向量圖的檔案小、縮放不失真、適合搞插畫、可以搞 3D、…
但是向量圖不夠真實、無法有太多的細節、…
MIDI 檔的檔案小、易於編輯、可以與樂譜軟體整合、…
但是 MIDI 檔的音質實在是不怎麼樣
向量有一個特點：100% 的物件化
所以點陣圖可以是一個物件、聲音檔也可以是一個物件、…、所有的多媒體都可以是一個物件
故 Flash 就出現了 ( 把向量的位階訂到最高，如此就可以控制所有的多媒體 )
點陣圖的檔案大、縮放會失真、不易於編輯、…
但是點陣圖很真實、有各種的特效、可以筆繪、可以銜接到視訊軟體、…
Wave 檔的檔案大、不易於編輯、…
但是 Wave 檔很真實、有各種的特效、…
……………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………
至若書法的重製、改作、復刻等事誼：
■ 一定不能以點陣圖的 快速去背 ( 如色階 ) 先行
因為快速去背時，有的筆畫字緣會被多去掉一點，有的筆畫字緣又會少去掉一點
這一多一少，接下來不管怎麼編修，細節處都只會越修越失真
■ 不以點陣圖去背行之，也不可能以向量圖行之，因為向量繪製會受限於節點
想要有越多的細節，就得有越多的節點；越多的節點，就越會干擾到細節
■ 所以只有一種方法：
先以 Bitmap Authoring 的方式繪製點陣圖
如果有縮放的必要，再以 點陣轉向量 的方法行之，最後再手工編修向量圖的細節
老共只想到快速去背，最多就是去背後點陣轉向量，所以永遠不會有夠好的品質出現
即老共對於書法 重製、改作、復刻 的觀念，只有 Bitmap Editing 與 Vector Editing，而沒有 Bitmap Authoring 與 Vector Authoring !!
2010‧0126
