【專欄】別再揮空氣了!關於遊戲中的「打擊感」三兩事

(《我滿懷青春的有病測驗》製作人 哈利菠菜) 2015-12-16 12:28:54

為了讓玩家進一步了解包含動畫(Anime)、漫畫(Comic)與電玩(Game)等娛樂文創內容的 ACG 產業,巴哈姆特 GNN 特別邀請具備豐富經驗與資歷的 ACG 產業從業人員,撰寫一系列專欄報導,從各自的觀點出發、分析 ACG 產業的趨勢或是分享自身實作的經驗,供玩家參考
 
  叮咚!
 
  LINE 傳來了一封訊息,是許久不見的阿尼,阿尼畢業後去遊戲公司上班,從此埋頭在事業中,距離他上一次敲我,已經是入伍前的事了
 
  「菠菜安安~ 想問你一個專業的問題」
  「阿尼! 好久不見呀,是什麼事情呢?」
  「是這樣的... 遊戲的『打擊感』究竟是什麼東東呢?」
 
  這問題引起我很大的興趣,打擊感是個不太好探討的題材,這名詞裡有「感」這個字,就意味著打擊感牽涉到每個人的主觀想法,很難一言蔽之。
 
  同樣一款遊戲,有些人可能會覺得這款打擊感很好,但又可能會有一部分的人覺得打擊感很差,如何用相對科學的方法,做出讓人賞心悅目的打擊,一直是很多設計師,想探究的題目。
 
  基於好奇心我細問了阿尼,才知道原來他們公司的老闆,想做一款橫向的 2D 動作遊戲,結果他的 Demo 不斷被打槍,但他不知道該怎麼解決這件事。
 
  「你們老闆,希望你們做出一款有手感的遊戲?」
  「對阿對啊!但是我做出來的東西,他好像不太喜歡」
 
  「有遊戲畫面嗎?」
 
  「喔喔喔! 有阿有阿!!」
  • image
 
  這是什麼!!! 這是安石吧!
 
※ 註:安石梗來自批踢踢文章「[眼殘] 我妹好像是天才藝術家
 
  「這是我們遊戲的主角,叫做小龜,是一隻烏龜人。他的家鄉被邪惡香菇入侵,所以他為了救回他的火柴老母,決定支身一人前往魔龍帝國,但在那之前,他要先找到四個瓶蓋...(略一千字)」
 
  「好好好!! 我知道! 啊!!!! 這畫面看起來非常極簡呢,很符合現在平面化設計的趨勢!!」
  「對耶!! 我老闆也這樣說!!」
 
  好吧,我實在不忍對一個已經連續加班一個月的人說小龜很像安石這件事。
 
  「那阿尼,有關於打擊過程的畫面嗎? 我想大概了解一下,打擊感的狀況」
  「喔喔! 有喔! 在這裡」
  • image
 
  ........
 
  「你看,這明明就做得很屌,我不明白為什麼老闆會打我槍!!」
  「嗯嗯嗯,如果玩家可以玩到這樣的遊戲,一定會很開心! 完全與現在市場主流的遊戲區隔啊」
 
  我實在不忍對一個沒有女朋友的遊戲從業員說真話........
 
  「是齁,果然還是菠菜懂我」
  「不過以打擊感這邊來說,其實嘗試修改一些地方,表現會更好」
  「喔喔! 真的嗎? 說來聽聽!!」
 
  打擊感,簡而言之就是遊戲角色的任何一個肢體或持有物,進行動作後碰到敵方所觸發的連續狀態,好比拿大劍砍殺敵人,用拳頭打敵人,或是子彈打到敵人... 等等。
 
  「首先,你要不要先把出招的動作做得再精細一點」
  「因為有點像是揮手嗎?」
 
   一般來說,任何戰鬥的姿態都有預備狀態,就好比武打片中,都會有個蹲馬步的動作一樣,出拳的時候,手臂會向後,接著再往前送出,這部分也是「預備」,整個一連貫的動作形成「出招」。
 
  「阿尼,現在的小龜不像是出招,比較像是拍臉,而且還沒拍到」
  「好吧,那我把動作調整一下...」
 
  過了幾個小時...
 
  叮咚!
 
  「菠菜 --- 菠菜,我改好了!!」
  • image
 
  「喔喔! 挺好的!!」
  「當然,這是我參考剩騎士之顫的動作做出來的!」
  「小龜肢體的關鍵格之間,還缺少一個律動」
  「律動? 有啊! 小龜在動啊!」
  「我不是說這個律動啦! 我是說,動作太平順了」
 
  一段動作,很多時候會拆分成很多段落的細節,就好比動畫的分鏡,而分鏡之間會有所謂的補間,把整個動作串接起來,補間的過程會有些速度加減的效果,透過簡單的加減速度,可以增加動作的豐富程度。
 
  同樣一顆球的彈動,使用不同的速度效果,就會有很大的變化
  • image
  「當然球的動作,還包含了關於拉伸、壓縮之類的動畫原則」
  「動畫原則???! 菠菜你說這些我聽不懂啦!」
  「好吧,畢竟我們是在討論打擊感,不是在討論動畫」
 
  以小龜的這個例子來說,雖然阿尼有做出小龜往後的動作,這個預備姿態也的確有做了出來,但實際上我們人體在進行任何一個動作的時候,每個點的節奏之間,並不是固定的速率。以出拳這個動作來看,一開始一定會很快,接著在快完成這個出拳的動作的時候,因為肌肉完全伸展,而減緩速度,會好像有一個停頓的「點」,這樣的一個細節,才是符合我們所習慣的格鬥動作。
 

image圖片引用自 Knckt 拳擊影片網站

  這張引用自 KNCKT 拳擊網站的圖片,仔細看拳師最後一次出拳,事實上我們只看得到屈手跟手伸直這兩個動作,中間的過程很快,快得模糊成一堆直線了。倘若所有的動作之間都是固定的速率,出招就不會生動。
 
  「嗚... 菠菜... 我了解了!,再等我一下喔!」
 
  過了一段時間
 
  叮咚!!
 
  「菠菜,我按照你說的改好了!! 你看是不是這樣!!」
  • image
 
  「對,差不多了! 然後我們現在來調整一下那個綠色球怪...」
  「什麼綠色球怪!!! 那是 巴 哈 姆 特 !!!」
 
  「巴.... 巴哈... 巴哈姆特?」
  「對! 平面風格的大! 魔! 龍! 巴哈姆特,結合普普風和古典藝術,與後現代工業設計....(略一千字)」
 
  • image
 
  「喔喔喔 --- 好!! 啊!! 巴哈姆特!! 對! 巴哈姆特還需要一些回饋的變化」
  「有啊! 你拉上去看,我有做啊! 」
 
  敵人的回饋不是晃動而已,還必須加入更多的反應,以《刺客聯盟》這部電影舉例,下面是飾演主管的克里斯 · 普瑞特,被男主角詹姆斯 · 麥艾維用鍵盤打臉的經典畫面:
 
image

圖片引用自電影《刺客聯盟

  誇張的表現讓畫面前的觀眾印象深刻,即便沒有多餘的光影效果,但一看到克里斯嘴角吐血牽絲,搭配放空的眼神,這個畫面疼痛感十足!因此在遊戲中,被擊打的對象元件,越是能做到讓玩家感覺「哇,他這個樣子應該很痛吧!」,越可以感受到攻擊的震攝。
 
  「現在的綠... 喔,不是,是現在的巴哈姆特,感覺有點舒服」
  「那我馬上改,明天給你看~」
 
  隔天...
 
  「菠菜,你看這樣可以嗎?」
  「喔喔! 綠色球怪好了?」
 
  「是!! 巴!! 哈!!! 姆!! 特!!! ˋ-ˊ」
  「好... 巴哈姆特....」
  • image
 
  「改得還不錯! 感覺很痛」
  「哈哈,請叫我天才!」
 
  「只是... 巴哈姆特反應有點慢,是末梢神經失調嗎?」
  「你才末梢神經失調!! 你們全家都末梢神經失調! QQ 」
 
  物件被攻擊的當下,物件就會有所反應,不會等到整個進程結束才會回饋。物件的反應會順著角色攻擊的態勢變化,好比拳擊手被打臉的過程,整個頭部會是順著同樣的方向而進行。
 
image

圖片引用自網路

  但在一般的遊戲過程裡,受限於遊戲表現的關係,未必能做得完全,畢竟現今的遊戲技術,除了一些高階的格鬥遊戲之外,大部分尚未「普及」做到打臉、打肩膀、打小鳥,都能有相對應部位的受傷姿態。
 
  因此,盡量做到『全面』的受傷表現,讓角色不管從哪裡被攻擊,只要調整圖像的方向,就可以讓玩家感覺到合理,能做到這個樣子,就及格了。
 
  「原來如此!! 有道理!! 那我再調整一下好了」
 
  過了一段時間....
 
  「好了!! 菠菜你看這樣的巴哈姆特,OK 嗎?」
  • image
 
  「哇! 喔!! 好很多耶!! 我很喜歡你巴哈姆特被打之後,有個盪回來的細節」
 
  被攻擊的物件,大多會有順著攻擊軌跡的錯位,當然如果物件很龐大,好比對象是一隻巨大的大巨人,因為質量相差懸殊的關係,就不會有錯位的現象。
 
  這時候就要用其他方法,強化「小質量物件打到大質量物件」的表現,但以阿尼的這個例子來說,被攻擊者本身的位移會更符合實際情況。
 
  「哼哼!! 那我可以跟老闆交差了!!」
  「好喔! 等你的好消息!!」
 
  過了幾天...
 
  叮咚!!
 
  「菠菜!!! 我被老闆念了啦!! 嗚嗚....」
  「怎麼了呢?」
  「我幫戰鬥加入一點特效,結果被打槍了」
  「特效? 什麼特效啊?」
  「就,一般遊戲不是都有損血的數字效果嗎?」
  「那你做的效果是?」
  • image
 
  「你是不是用新細明體啊?」
  「欸?! 你怎麼知道?!」
 
  介面設計的兵家大忌,就是採用了不恰當的設計文字,以文字效果來說,粗一點的圓體或黑體,會更適合放在節奏較快的遊戲中,因為在快速的進程裡,圓體和黑體的辨別度,會比明體更好。
 
  例如《魔界戰記 5》的畫面:
 
image
 
  浮現出來的黑體字效果就很清晰,有質感的動態特效,可以讓整個攻擊的效果加分,尤其《魔界戰記》號稱可以打到上億數字,因此在戰鬥過程中,如何清晰表現大數字的效果,相信製作團隊一定下了很多心思。
 
  「我覺得你可以試著讓數字跳出來再帶感一點」
  「好歐,我試試看」
 
  過了一些時間....
 
  「菠菜我改好了! 這次把數字的效果做了修正!」
  • image
 
  「雖然精緻程度還可以加強,但整體看起來好了很多!」
  「欸... 那還可以加些什麼東西,讓戰鬥的效果更好啊? 我很怕又被打槍 QQ」
 
  「你現在做的東西,都算是基本的,就像創作料理,目前只是把菜做出來,還沒擺盤呢!!」
  「真的假的! 還可以讓打擊感做得更優?」
 
  擺盤的關鍵,就是環境了,打擊這個過程不只是物件與物件之間的碰撞,還包含了物件的情境氛圍,這些效果可以讓這個極度簡短的過程,得到更好的視覺體驗
 
  以《星之卡比》來舉例:
 
image
 
  光是這短短的五秒影片裏面,就出現了許多巧妙的細節,第一個是畫面的上下震動,這個震動雖然不起眼,甚至很容易被忽略,卻是影響最大的地方之一,儘管玩家這時候眼睛是盯著卡比,但整個畫面的震動,暗示了這小小的卡比,操縱整個環境的連結。
 
  第二個是卡比跳躍後,接觸地面時的光線特效,這特效頂多 0.3 秒,卻大大豐富了整個動作,包含卡比撞方塊的過程也是一樣,方塊爆炸的效果範圍甚至比卡比本身大上 2 倍
 
  最後是卡比吐出的火焰接觸到敵人身體時的效果,還有敵人從上面掉下來碰到地板死亡後的星星,都可以讓玩家感覺到畫面的層次,這些小地方或許微不足道,但放在一起時,就可以深刻了解任天堂在遊玩體驗上所耗費的苦心。
 
  • image
 
  「這些不是源自於角色主體的細節們,都是提升打擊感的另一個關鍵」
  「沒想到這個有長腳的山寨巴哈姆特這麼厲害,嘖嘖」
  「這是卡比!! 星之卡比!!」
  「好吧~ 那我再加上一些元素看看」
 
  過了幾天....
 
  叮咚!!!
 
  「菠菜!! 我終於完成了!! 最強的打擊感之作了」
  「喔喔! 真的嗎? 快給我看看!」
 
  其實阿尼也算是蠻有天賦的,一路修正下來,效果越來越好。
image
 
  .......
 
  「 喔喔! 不是,不好意思,傳錯張惹 XD」
  • image
 
  「多了很多細節呢! 打擊感比最早的樣子好上很多!」
  「耶!! 希望這次可以過老闆那關!」
  「一定可以的,期待小龜上市的那天,祝你好運」
 

 
  以上是我胡謅 (?) 的一段軼事,希望大家可以從菠菜和阿尼的對談中,掌握幾個營造打擊感的方法。
 
  這次文章提到一些重點,第一個是打擊感角色自身動作的關係。在玩動作遊戲的時候,我們常常眼睛盯著被攻擊的那方,很少專注在角色身上,進而以為打擊感要做到優越,就必須在被攻擊方的身上下重手。
 
  事實上,敵方身上表現出什麼樣的受傷反應,只是整個打擊感營造的一環而已,攻擊方本身的動作越是做到順暢,不拖泥帶水,越能表現優異的手感。
 
  第二個是敵方受傷的效果營造,好的受傷表現,要能讓玩家感覺到「痛痛 der」,倘若玩家在殺死敵人的過程中,沒有任何丁點為敵方「傷感」的情緒,那就是標準的「揮空氣」了。最好、最棒的動作遊戲,就是要讓玩家越打越覺得罪惡感,覺得今天應該要吃素或者打電話給媽媽。
 
  還記得克雷多斯嗎?
 
  • image

    《戰神》

  第三個是文字的效果,近來手機遊戲當道,鑒於手機遊戲本身屬性的關係,部分具體數值的資訊,會主動呈現在小小的螢幕上。這時如果可以精心安排文字的設計、位置與效果,在彈出數字的過程多加著墨,一定可以讓整個體驗更完善。
 
  你可以想像,當你在遊戲中使出「真 - 破龍滅風爆裂斬 S」,一陣超炫砲的特效之後,最後看到新細明體用一個弱不經風的節奏緩緩跳出來... 你能接受嗎?
 
  第四個是環境的效果,這是另一個最常被忽略的地方,一小陀灰塵揚起,幾個小小的線條,一些火花跟星星甚至是畫面的晃動,都能讓整個過招的層次更加豐富。
 
image
 
image

《先鋒公主》遊戲畫面

  上面四點是在本次打擊感的探討裡,最需要注意的幾個項目,但遊戲的創造充滿無限可能,相信內文還是有許多遺漏的地方,好比「音效」就是本文沒有深入的方向,轉述我朋友的話,「明明看上去是揮著重拳打在敵方身上,卻出現了匡噹的清脆碰撞聲,這是打到什麼鬼...」,像這類違背預判立場的效果,也非常容易降低打擊感。

  文章的最後,希望藉著這篇文章拋磚引玉,期待未來有更多對於「打擊感」的看法,以彌補本文缺失掉的地方,如果你有什麼點子,也不妨在底下留言~ 讓我們一起討論看看 :D
 
  • image

    兔兔表示:有一股龜味

    關於作者:哈利菠菜
    為《我滿懷青春的有病測驗》的有病製作人,擁有日魔羯上升水瓶的衝突個性。過去曾任《封之青焰:桃轅傳》程式以及《元宵國物語》美術與製作人、巴哈姆特勇者小屋達人,曾執筆過《為什麼我們輸很大?! 就認證角度淺談韓國遊戲人才培育》、《我們生活在一個被大陸遊戲包圍的世界》、《2014 新一代設計展遊戲組 精選特輯篇》... 等文章。

 

標籤:

#專欄

新聞評語

載入中...

延伸報導

2023 漫畫角色賞得獎名單公開《葬送的芙莉蓮》欣梅爾獲最佳男配角獎
人物 | 電玩相關動漫畫
53
「KING SUPER LIVE 2024」公開合作演出內容 水樹奈奈 × 水瀨祈等組合將於 Live 登場
活動 | 電玩相關動漫畫
3
投稿「自由與權益—2024 ACG 創作者議題論壇」討論內容概要整理節錄分享
產業 | 電玩相關動漫畫
14
「自由與權益—2024 ACG 創作者議題論壇」聚焦動漫畫創作自由
產業 | 電玩相關動漫畫
33
BOOK☆WALKER 推出白色情人節測驗 精選戀愛喜劇漫畫輕小說優惠同步展開
動漫 | 電玩相關動漫畫
0
【專欄】遊戲業關於「留存率」的那些事兒
手機 | 電玩相關動漫畫
74
【專欄】我覺得這個聲音不行!關於遊戲配音的三兩事
其他 | 電玩相關動漫畫
93
【專欄】面對過熱的市場 獨立遊戲在台灣的未來到底有沒有機會?
手機 | 電玩相關動漫畫
62
【專欄】從 Supercell 腰斬 14 款遊戲所得到的啟示
手機 | Clash Royale
100
【專欄】想進遊戲業?你那邊還來得及!給大學生的行前準備建議(中)
其他 | 電玩相關動漫畫
79
【專欄】想清楚再說你要成為遊戲企劃吧!
手機 | 海上萬事屋
93
【專欄】想做獨立遊戲不要等待同伴
多平台 | 電玩相關動漫畫
51
【專欄】先過這三關 再談獨立開發吧!
多平台 | 電玩相關動漫畫
68
【專欄】台灣真的適合進行「遊戲類」募資活動嗎?!
手機 | 手機遊戲與行動遊戲討論區
249
【專欄】美國開發商倒閉帶給玩家與開發者的省思
手機 | 手機遊戲與行動遊戲討論區
112
【專欄】想進遊戲業?你那邊還來得及!給大學生的行前準備建議(上)
其他 | 電玩相關動漫畫
91
【專欄】透過抽卡玄學真的可以成為「歐洲人」嗎?試從科學角度來分析抽卡兩三事
手機 | 手機與行動遊戲討論區
455
【專欄】賦予遊戲靈魂與生命 論劇情對遊戲的重要性
手機 | 手機與行動遊戲討論區
77
【專欄】想進遊戲業?你那邊還來得及!給大學生的行前準備建議(下)
其他 | 電玩相關動漫畫
74
【專欄】從小島秀夫的多重挫折看《潛龍諜影 5:幻痛》的超高評價、開箱和愛恨交織
多平台 | 潛龍諜影 5:幻痛
140

日式風格

看更多

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

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