[ Expression Blend 4 ] Expression Blend的初心筆記Ch.4 –無中生有一隻喵 - 繪圖工具的應用(下)

  • 4775
  • 0
  • 2011-03-29

[ Expression Blend 4 ] Expression Blend的初心筆記Ch.4 –無中生有一隻喵 - 繪圖工具的應用(下)


畫完輪廓接著就是上色了!!!  #沒有輪廓檔案的可以到這下載

先點選貓咪身體的部分,可以看到右邊填色用的筆刷視窗,顯示如下,

2011-02-26_030651 brush

著色樣式分成五種,如下圖,
2011-02-27_001429

No brush / 無填色:無填充效果,等同於設定部分不顯示。當填色設定No brush的時候,元件會變成如下圖只有筆畫的呈現。在元件透明度為100%的時候,OpacityMask的數值都是No brush。
no_brush

Solid color brush / 單色:單色填充。
 2011-02-27_031806
顏色設定的部分,下面的色塊左邊會顯示目前的填色,右邊會顯示新選的顏色,也可用滴管在調色盤上直接點選色彩。
右方的16進位顏色碼設定可直接填入色碼,16進位碼以#字號開頭代表,後方數值兩兩一組分別代表ARGB四個值,如下圖。
最下方的小三角展開,可以看到透明度設定,我們可以針對填色或筆畫單一選項設定顏色透明度。
16color

Gradient brush / 漸層:漸層填充,利用顏色節點設定顏色漸層效果。
color_gradient_a
漸層分兩種呈現方式,分別為Linear Gradinet(線性)與Radial Gradinet(放射),可用下方的小圖示做切換。
漸層翻轉按鈕可將目前看見的漸層控制做翻轉。
節點位置控制,先點選要調整的節點,會有黑色三角的顯示,再填入或拖拉百分比的數值。
點選顏色控制條如圖上紫色部分,可以增加顏色節點。

Tile brush / 圖片填充:以來源圖片延展至元件填充範圍的填充方式,需要設定圖片的來源。
tile
填充模式有四個值如同外觀視窗中的Stretch,預設值是Fill #填充模式詳細說明可參考 Expression Blend的初心筆記Ch.3中的說明
填充模式設定後,可利用左邊的預覽窗格看到圖片在元件中的填充效果,
要設定圖片的來源,點選ImageSource選項的"..."按鈕可以瀏覽連結到圖檔,點選向下的箭頭符號則會列出專案中有的圖檔以供選擇。

Brush Resources / 筆刷資源:可填充專案設定的資源項目,此項目在之後的章節再細說。

要設定貓咪身體的顏色,首先要點選到Fill的選項,接著選擇漸層著色的樣式, 
cat_gradient

接著切換到左方工具列的漸層工具(G),可以看到淺藍色的工作框如下圖,
 cat_g_tool
A.箭頭尖端手型游標:拖拉可以控制整個填充橢圓外框的範圍。
B.斜線上圓型節點:代表漸層控制上的左邊節點,等同於設定百分比的數值。
2011-02-27_101105
C.帶有漸層圖示游標,此時點左鍵拖曳可以重新拉出漸層的範圍。
D.有加號的游標,增加漸層上的漸層控制節點。
E.移動游標,可移動整個漸層範圍。

將放設填充的中心點移到貓臉的中間,調整出細長橢圓形的效果如上圖,
接著點選兩手的元件,設定一個線性的漸層。
cat_hand

外耳朵的部分利用放射狀的漸層來填色,同時選取兩個元件時,調整其中一個,另一個元件也會跟著調整變動
2011-02-27_103340

內耳朵的部分利用單色填充,直接選取色盤上的顏色。
2011-02-27_103808

鼻頭的部分也同樣利用單色填充,
cat_nose

嘴巴的部分我希望給他點立體感,所以用灰色的放射漸層做出光影,
cat_mouth

尾巴的部分,為了有中間彎曲部分比較亮的感覺,我選擇放射漸層填色,
 cat_tail

最後一個區塊是肚皮的部分,我同樣利用放射狀漸層,讓亮點接近肚皮的上方,
cat_belly

同時我想讓肚皮的線條顏色不那麼深,所以用線性的灰色漸層來填充,
cat_bellyline

填色到目前的階段,大致如下圖的感覺,可以說填色已經完成,但我覺得有點單調,所以我再加點東西做了點小調整。

color_cat

完成的結果如下圖!!稍微增加點特徵或是特色,就可以創造出不同的角色了。

cat_final

這章我們研究關於填色的工具,包括單色與漸層與圖片填充等等,
下拉的箭頭中都會藏有一些進階設定,有些會依不同元件出現不同的屬性,
可以藉由細微的設定繪製出更細緻的效果!!!!大家一起來研究吧。
Blend 4的繪製工具就到此一段落了。