小屋創作

插畫2021-12-07 17:07

【Spine】眨眼的幾種實現方式與差別

作者:Yuar

Spine 2D Animation
眨眼的幾種實現方式

雖然這次是講Spine上製作時的東西,
不過表現上的差異跟優缺點就算不是Spine使用者應該還是能加減看……吧?

這次跟大家介紹Spine上製作眨眼的方法。
我把平常會考慮使用的方式大致上分成三類,
這邊會分別會講一下他們的構成跟好壞處這樣。
如果有其他看法的也歡迎補充('ω')ノ



一、圖片切換


顧名思義就是直接切圖。
事先準備好開眼、閉眼的圖像不額外做處理,
要眨眼的時候就直接「砰啪!」的快速進行開關。
如果覺得只有兩張看起來太卡,額外再多一張變成「開眼→半開→閉眼」這樣也可以。


「這麼做看起來很醜欸……」
是這樣沒錯,但它還是有它的好處。
最顯而易見的是工時很低,你不需要為了眼睛怎麼弄在那邊搞老半天還搞不定。
在來就是表情就會很穩定,不會因為動畫師沒調整好而失去了原本腳色的韻味。
也就是不會因為製作者的技術差距導致品質不一,監修成本也較低。
之後新增表情也方便快速,請繪師畫完我貼上去就是了。
總之很適合用在大型專案或是多人協作的狀況

但壞處也很明顯,細節的表現相對不足。
實機畫面上看起來的樣子有時候感覺不出有什麼影響,像是一般戰鬥中的SD人物。
如果是立繪、卡面等等的狀況可能就會感覺眼睛的張數不太夠了。

簡單來說
優點:快速、穩定、擴充方便
缺點:細節較差、看起來卡卡的


二、骨架控制


不想做單純的切換,就自然要靠骨架囉
上圖那樣是簡易版的示例,靠骨架分別控制上眼皮、下眼皮、虹彩的位置
以這個為基底作成的眨眼就會是這個樣子。


喔喔?好像很理想喔!
那麼我們再給他加一點細節看看!


看起來很棒啊,那我以後都這樣做了!

可以是可以,不過有時候就是沒那麼多時間處理阿……


這邊光是上眼皮就綁了4根骨頭,之後要配合頭部轉向這大概又得再多綁一兩根骨頭上去。
權重刷一次就滿麻煩的了,如果有需要調整真的會很懶得處理。
而且使用的骨頭越多=之後動畫製作的成本就越高,
只用一根骨頭就動一根就好,用了兩根就得處理兩根的動畫,很簡單的道理。
要是作業量很大的話,累積下來可是會吃掉不少的工時。

不過好看是真的好看,也能一定程度上直接調整表情。
由於細節要處理到什麼程度全看製作者的決定,相對來說就很考驗製作者的技巧。
還有一點就是,實機上的效能會很微~~~妙的比較差。
會這樣說是因為效能有明顯落差絕對不只是這邊的問題而已啦。
但程式那邊有給規格上的要求的話,那還是得列入考量才行。

補充一點,我這邊其實是有使用遮罩擋住多出來的虹彩。
不然它肯定會超出你的上下眼皮裸露在外面。


Spine沒有像Live2D那樣的圖層遮罩,只有這個難用得要死的鬼東西。
一般製作時我是不建議使用遮罩來處理,這邊只是展示方便而已。
通常要處理這個問題,是會直接在臉部上面挖一個眼睛的洞


把眼白、虹彩等的部分墊在下面就不會穿模囉。
當然這樣就代表臉部也需要綁定眼皮的骨架來調整權重。
夠麻煩吧!

優點:好看、表現力強
缺點:耗時過長、權重關係複雜、資源使用量較大


三、整體縮放


第三種就是兩者的折衷案了
我們直接把整個眼睛進行縮放


骨架的重點是以下眼皮為中心進行縮放,以及上眼皮的骨頭不要繼承縮放情報。
以下眼皮為中心進行縮放的話,因為它與上眼皮中間的空間縮小,看以來就是上眼皮的位置往下移了。
至於為什麼不繼承縮放,是因為繼承的話就會讓上眼皮也跟著變扁。
這個做法的目的是讓上眼皮「往下移動」而不是「縮小」它。

這樣的話我只需要控制縮放一個骨頭就能有不錯的眨眼效果,
連網格,權重都不用管,超快!

好處:方便、快速
壞處:普通



大概就是這樣,
不知道對大家有沒有幫助?


最近下定決心開始學畫畫,希望年前能進步到一定程度

Live2D的技巧一直在往前衝都看不到車尾燈了,追得好累喔...
還是先練好基本功就好吧QQ

40

9

LINE 分享

相關創作

【Spine2D】如何判斷作品好壞?怎麼進行觀察?──個人主觀理解

【Spine2D】流暢的銜接姿勢、切換圖片的基本要領

【Spine】SD動作練習

留言

開啟 APP

face基於日前微軟官方表示 Internet Explorer 不再支援新的網路標準,可能無法使用新的應用程式來呈現網站內容,在瀏覽器支援度及網站安全性的雙重考量下,為了讓巴友們有更好的使用體驗,巴哈姆特即將於 2019年9月2日 停止支援 Internet Explorer 瀏覽器的頁面呈現和功能。
屆時建議您使用下述瀏覽器來瀏覽巴哈姆特:
。Google Chrome(推薦)
。Mozilla Firefox
。Microsoft Edge(Windows10以上的作業系統版本才可使用)

face我們了解您不想看到廣告的心情⋯ 若您願意支持巴哈姆特永續經營,請將 gamer.com.tw 加入廣告阻擋工具的白名單中,謝謝 !【教學】