ETH官方钱包

創作內容

24 GP

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

作者:Yuar│2023-05-26 18:25:12│巴幣:2,738│人氣:1211
修正死圖問題
2024/03/04

===


開場白我就省了,直接進入重點


今天的目標是完成這個動作,以上段的持刀姿勢向前進行突刺
這邊令人感到困擾的點,主要是兩個姿勢的身體朝向是相反的,沒辦法直接用旋轉等方式進行過度,中間一定會需要卡一幀讓她瞬間切換過來。
於是為了讓他能夠順暢的切換過去,我首先做的第一個步驟是


  1. 預備動作

預備動作──英文叫做Anticipation,是動畫12原則的要素之一。
預備動作具體來說是什麼,舉例來說就是你跳躍前必須先蹲下的這個下蹲動作。
雖然人還沒有離地,但你看他往下蹲的姿勢就可以意識到「喔~他正要往上跳了」

實際上不僅是跳躍,跑步甚至是伸手拿東西都可以有所謂的預備動作。
詳情可以參考下面這個影片,雖然是英文但光看動畫應該也能感受到差異


講了那麼多,總之我們這邊就先幫他加上刺擊前的預備動作



腳色的重心放低並集中在後腳上,武器也同時持平以便對接到刺擊動作
其餘部分還沒有進行處理,依舊是在某個時間點就瞬間切換到下個姿勢

沒問題之後,就進行第二個步驟

 . 緩衝

該叫他漸慢,緩衝還是慣性......?煩惱了一陣子還是先稱呼他為緩衝吧
移動中的物體是不可能瞬間靜止下來的,擺出刺擊動作的時候也不可能瞬間定在原地
因此這邊我們加入一點緩衝動作讓攻擊時的動作從高速回歸到靜止。


這個時候看起來已經順暢許多了。
即使切換的過程沒有表現出來,透過預備與緩衝動作的暗示也足以讓人理解中間發生了甚麼事情。

講到這邊應該可以理解到,想讓動作看起來想要流暢,就必須不斷堆疊各種暗示來增添動作的說服力

知道之後,我們就繼續往下處理

 3. 身體重心位置銜接

做完上面兩項處理之後,角色的身體看起來還是從左至右順移了一大段距離
因此這邊就來調整它的位置與速率讓他看起來接近一些


在身體切換轉向之前,我們幫身體的重心新增往右側移動的動作
除了讓人知道他之後運動的方向外,同時縮短與下一幀的間距,看起來像是流暢滑動過去的樣子。
原本可能在切換的瞬間身體順移到5、6格外的地方,現在變成一幀跳動2、3格降低了順移造成的卡鈍感

 . 腳步調整

身體位置調整完後,現在看起來最突兀的地方就是腳部了,一動也不動的看起來有夠奇怪。
這邊幫攻擊動作增加一點向前踏的動作,暗示剛剛腳步是從後方快速向前蹬上來的




?。? 剩餘各種追隨、緩衝動作的調整

最後就是完善剩下的內容,補齊頭髮的飄動之類的。依靠各種暗示調整其他看起來卡鈍的地方


跟一開始比起來,簡直就是天與地的差別。
文章中間省略了一些細節,如果你照著做還是感覺卡卡的話,我想八成是圖表曲線沒有處理好
請一定要先理解速度是如何變化與圖表曲線怎麼使用,不然動作永遠不可能順暢


圖表曲線就是這玩意,想進步的話就不要再逃避它了


有什麼問題的話可以私信或直接加我Discord: yuar0708 問
沒東西問的也可以加拉,好想要有一起成長的同伴喔...



特效好難......
應該多找一點參考照著弄的,幹嘛自己在那邊亂搞

引用網址:http://www.jamesdambrosio.com/TrackBack.php?sn=5724257
All rights reserved. 版權所有,保留一切權利

相關創作

同標籤作品搜尋:Spine|教學

留言共 5 篇留言

巨大超獸兩千
好讚ㄛ[e5]

05-26 19:24

拉米OxO
太讚了!!
感謝分享~[e32]

05-26 22:56

花生省魔術
太酷了!!

05-27 01:12

有月月
您好最近想了解SPINE2D搜尋到您的教學文章, 覺得都很實用, 想請問目前真要學的話L2D和SPINE該學哪一個? 想用在美少女插畫方面~

12-01 10:23

Yuar
單純自己做著開心的話我可能會選Live2D,除了可以做到比較細節之外,教學資源也豐富。對有在畫圖的人來說應該也比較直觀一點,而且有免費版可以用[e19]12-01 11:06
有月月
好的 萬分感謝!

12-01 11:17

我要留言提醒:您尚未登入,請先登入再留言

24喜歡★a860705d 可決定是否刪除您的留言,請勿發表違反站規文字。

前一篇:【Spine2D】如何判...


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

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