滾輪引擎設計:動畫曲線與停輪控制

解析老虎機最核心的視覺體驗,如何在 60fps 下做出自然流暢的滾輪動態

滾輪是玩家最直覺的體驗核心。本文深入解析滾輪引擎的動態狀態切換、緩動曲線的數學設計、停輪時序與彈跳回彈、預期感營造機制,以及維持穩定幀率的效能最佳化手法。

滾輪引擎:老虎機手感的來源

滾輪動畫是老虎機最具標誌性的視覺元素,也是玩家唯一會用「手感」來評價的部分。 兩款規則相同的遊戲,可能因為停輪節奏差了幾十毫秒,觀感就從「乾脆俐落」變成「拖泥帶水」。 好的滾輪引擎要提供絲滑流暢、物理真實的旋轉體驗,而且這份手感必須可調校、可重現,不是反覆試錯碰出來的。

滾輪動畫的六個階段 從預彈跳到定位共六段,其中只有等待結果的長度由外部決定。 預彈跳 加速滾動 等待結果 減速 過衝彈跳 定位 長度由外部決定 其餘五段都由引擎自行控制,因此手感是可調校、可重現的
這六個階段中只有「等待結果」的長度由外部決定,其餘五段都由引擎自行控制。

這六個階段中只有「等待結果」的長度由外部決定,其餘五段都由引擎自行控制。

逐幀位移與符號循環

核心原理是每一幀計算滾輪的位移量,當位移超過一個格子的高度時,觸發符號循環:

位移計算必須以經過時間而非幀數為基準, 否則在 120Hz 螢幕上的轉速會是 60Hz 的兩倍,停輪時機也會整體提前。

但應用程式從背景切回前景時,單幀經過時間可能高達數秒,直接套用會讓滾輪在一幀內跳過大量符號, 因此還必須對單幀時間設上限。

緩動曲線的數學

緩動函數(Easing Function)把「進度比例」映射到「位移比例」:輸入從 0 走到 1,輸出也從 0 走到 1, 但中間的走法決定了觀感是勻速、加速、減速還是彈跳。

三次貝茲曲線

我們最常使用三次貝茲曲線:起點與終點固定在 0 與 1, 實際可調的只有兩個控制點共四個參數,足以表現豐富節奏,又少到可以直接交給美術微調。

實作上要注意貝茲曲線是參數式定義的,給定時間求位移需要求解而非直接代入; 引擎在初始化時對曲線均勻取樣建立對照表,執行時以查表加內插取代逐幀求解。

彈性回彈的參數

真實的老虎機停止時會有微妙的「過衝」:滾輪略微越過目標位置,然後彈回定位。 這段可以用阻尼振盪模型描述,彈簧把滾輪拉向目標,阻尼消耗能量,只有兩個直觀參數:

整段停輪則拆成三個可獨立調整的區間:

停輪的三個區間 滾輪先減速逼近目標,越過目標一小段後再由阻尼彈簧拉回定位。 目標位置 減速 過衝 回彈 橫軸為時間,縱軸為滾輪位移;三段可獨立調整
過衝幅度通常控制在半個符號高度以內,超過這個幅度玩家會開始懷疑結果變了。

節奏明快的遊戲用較小的過衝與快速回彈,經典風格則用較誇張的彈跳營造機械感。

另一個常被忽略的參數是預彈跳:啟動前先微微反向位移再向下加速, 只有幾十毫秒,卻能明顯提升力量感。

停輪時序設計

單欄調得好看,不代表整組滾輪舒服。多欄一起動作時,真正決定觀感的是時序

多欄的啟動與停輪時序 各欄依序啟動,間隔較小;依序停止時間隔明顯放大,節奏感由此而來。 第 1 欄 旋轉中 第 2 欄 旋轉中 第 3 欄 旋轉中 第 4 欄 旋轉中 第 5 欄 旋轉中 啟動間隔(較小) 停輪間隔(明顯較大) 啟動間隔製造整體感,停輪間隔則是玩家判斷「還剩幾欄」的線索
這四個數值必須被視為一組來調整,因此我們把它們封裝成可整體切換的節奏設定。

這四個數值必須被視為一組來調整,因此我們把它們封裝成可整體切換的節奏設定。

快速停止的處理

玩家在旋轉中再次點擊時,所有滾輪需要立即急停。 難點在於:若把動畫時間壓縮成十分之一,過衝與回彈也等比縮短,看起來像被「快轉」而不是「煞停」。

較好的做法是重新規劃減速曲線而非縮放原曲線:保留完整的回彈段長度,只壓縮前面的減速段, 並依當下的實際速度重算剩餘距離。

預期感與特殊停輪效果

除了基本的旋轉與停止,滾輪引擎還需支援多種特殊效果, 其中最重要的是預期感(Anticipation)的營造:

預期感有條必須守住的界線:所有懸念機制都是結果導向的表現層行為。 引擎只是根據已確定的結果選擇演出方式,演出本身不會改變任何一個符號的落點。 把這條界線寫進介面設計裡,引擎在收到結果之前就根本沒有能力決定要不要聽牌。

幀率穩定與視覺殘影

滾輪引擎的效能問題大多不是出在計算量,而是出在每幀的物件變動。 每幀建立與釋放顯示物件,會讓記憶體回收在不可預期的時機被觸發,表現出來就是每隔幾秒卡一下。

物件池的意義不只是省下建立成本,更是讓記憶體佔用保持平坦。另外兩項也值得一併處理:

高速下的殘影處理

滾輪高速旋轉時,符號每幀移動的距離可能超過符號本身的高度, 此時人眼看到的是一連串離散位置而非連續運動,會產生明顯的頻閃感。處理方式有三種:

這三種手段通常一起使用,切換門檻還需要在低刷新率裝置上另外驗證。 在 120Hz 螢幕上看不出問題的轉速,在 60Hz 上可能已經明顯頻閃。

滾輪引擎談的是手感,但它並不孤立運作:它依賴分層架構提供的復用基礎與狀態機給出的啟停指令, 而素材何時載入、停輪音效如何與畫面對齊則屬於支撐系統的範疇。 這兩個主題我們在同系列的另外兩篇文章中分別討論。