老虎機 Spine 動畫與特效製作
作者 Jim Tseng, 創辦人暨美術總監更新於
PlaySmith Studio 用 Spine 製作老虎機遊戲素材的動畫,並搭配粒子特效:符號的得獎、落定與待機狀態、角色、Logo、大獎與免費旋轉開場、UI 操作回饋。交付 Spine 專案檔連同 JSON 與 atlas 匯出,若你的引擎需要也可提供 sprite sheet,依 Spine runtime、Unity、Cocos、HTML5 分別打包。
- 動畫工具
- Spine 骨骼動畫+粒子特效
- 引擎打包
- Spine runtime、Unity、Cocos、HTML5
- 交付內容
- .spine、JSON/binary、atlas、sprite sheet
- 整款製作週期
- 30 個工作天(約 6 週)
- 團隊規模
- 20+ 位美術,每月最多 5 款同時進行
- 估價回覆
- 3–5 個工作天,不用開會
老虎機哪些素材可以用 Spine 做動畫?
老虎機畫面上會動的每個元素,都能做成 Spine 骨架、粒子特效,或兩者並用。下表是一整款遊戲的典型清單;單獨下單可以只挑其中一部分,小到只做一組符號也可以。
| 素材 | 常見動畫狀態 | 常用格式 |
|---|---|---|
| 符號(低分、高分、Wild、Scatter、Bonus) | 待機、落定、得獎、得獎循環、預告 | Spine 骨架+特效疊層 |
| 角色(主持人、吉祥物、反派) | 待機、得獎反應、Bonus 開場、免費旋轉待機 | Spine 骨架+網格變形 |
| Logo | 載入循環、標題登場、待機微光 | Spine 或序列影格 |
| Big win/Mega win/Epic win 大獎 | 開場、數字跳動循環、收尾 | Spine+粒子 sprite sheet |
| 免費旋轉與 Bonus 開場 | 轉場進入、舞台待機、轉場退出 | Spine+粒子 sprite sheet |
| UI 回饋 | 按下 Spin、調整押注、自動旋轉、滾輪停止、倍率彈出 | Spine 或 sprite sheet |
| 背景與氛圍 | 視差圖層、光束、天氣、火星餘燼 | Spine 循環+粒子 |
Spine 動畫外包給 PlaySmith,會拿到什麼?
你拿到的是可以直接進引擎的動畫包,不是一支預覽影片。每次交付都包含可編輯的原始檔,以及工程師可以直接放進 build 的匯出檔:
- 可編輯的 .spine 專案檔,骨架、骨骼、slot、skin 與動畫都已命名
- JSON 或 binary 骨架匯出,加上打包好的貼圖 atlas(.atlas 與 PNG 頁)
- 引擎無法以骨架播放的素材,另附序列影格或 sprite sheet
- 粒子特效以含 alpha 的 sprite sheet 翻頁動畫交付:光暈、火花、金幣、煙霧、魔法拖尾
- 一份命名對照表,列出每個骨架、動畫與時間軸事件,以及預期的觸發時機
- 依引擎整理的資料夾結構與簡短整合說明,並附每個狀態的 MP4/GIF 預覽供驗收
哪些引擎和 runtime 可以直接用這些匯出檔?
匯出檔會針對下列四種環境準備。開工時告訴我們引擎與 runtime 版本;我們內部的打包系統會產出對應的套件,自動切圖、統一命名,並檢查尺寸與格式。
| 引擎 | 交付內容 | 備註 |
|---|---|---|
| Spine runtime(官方) | JSON 或 binary 骨架+atlas | 匯出版本對齊你的 runtime |
| Unity | Spine-Unity 資料夾,非骨架特效另附 sprite sheet | atlas 頁尺寸依你的目標平台設定 |
| Cocos(Creator/2d-x) | Spine 匯出+atlas,需要時提供 sprite frame | 命名與你的 prefab 規則保持一致 |
| HTML5(PixiJS、Phaser、自製 WebGL) | Spine JSON+atlas,sprite sheet 以 JSON hash/array 格式提供 | PNG 頁經壓縮,顧到網頁載入時間 |
動畫狀態怎麼命名、怎麼打包?
一個素材一個骨架,一個狀態一個動畫,名稱在開工前先談定。我們採用扁平、全小寫、可預期的命名規則,讓你的程式不需要對照表就能直接引用狀態:
如果你的工作室已有自己的命名慣例,我們直接沿用。打包系統會在交付前檢查每個檔名、尺寸與格式,不會有命名錯誤或尺寸不對的檔案送到你手上。
- 骨架:sym_wild、char_host、ui_spin_btn、fx_bigwin
- 動畫:idle、land、win、win_loop、anticipation、intro、outro
- 時間軸事件供音效與邏輯掛勾,例如 hit、coin_burst、loop_start
- 共用同一骨架的符號變體用 skin 區分,例如金色版與標準版
- 資料夾結構:/spine/<asset>/、/sheets/<asset>/、/fx/<effect>/,各附一份 README
手機老虎機的 Spine 動畫怎麼控制效能?
效能預算在開工時與你的開發團隊一起訂,每個檔案都照著做。我們不公布固定上限,因為合適的數字取決於你的引擎、目標裝置,以及同時有多少符號在動。我們實際掌控的幾個關鍵:
- atlas 尺寸:貼圖頁不超過目標裝置支援的最大貼圖尺寸;一定會同時出現的符號共用同一張 atlas
- 骨骼與網格數量:骨骼只用動作必要的數量,網格變形只用在能取代多張獨立圖的地方
- 繪製順序與附件分組,盡量讓一個骨架留在同一張 atlas 頁;避免使用裁切與額外混合模式,必要時獨立處理
- 粒子特效烘焙成裁邊緊實、alpha 乾淨的 sprite sheet,讓引擎播放影格,而不是在執行時模擬大量粒子
- 待機循環短而無縫,長時間遊玩記憶體也能維持穩定
老虎機 Spine 動畫怎麼估價、怎麼報價?
動畫依素材、依狀態計價,所以一顆有待機、落定、得獎三個狀態的符號,報價項目會比只有得獎狀態的大。可以包在整款老虎機視覺製作裡,也可以針對你既有的美術單獨下單。
若包在整款製作裡,Spine 動畫與粒子特效已含在專案制報價中,每款自 US$8,000 起(起始參考價,非最終報價),在 30 個工作天的週期內完成。有穩定開發排程的工作室可選月產能方案,取得專屬團隊與優先排程。範圍只涵蓋視覺素材;程式整合仍由你的開發團隊負責。
- 1. 把素材清單、目標引擎與一款參考遊戲用 email 寄給我們,不用開會。
- 2. 我們在 3–5 個工作天內回覆逐狀態的範圍與估價。
- 3. 簽 NDA;與你的工程師談定命名規則與效能預算。
- 4. 每個狀態先出預覽渲染供確認;含一輪大幅修改。
- 5. 匯出、自動檢查加人工 QC,連同文件一起交付。
Spine 骨骼動畫 vs 序列影格:你的老虎機該用哪一種?
會循環、會隨遊戲狀態反應、必須跨裝置縮放的,用 Spine。短而畫面密集、烘焙比綁骨架更划算的特效,用序列影格或 sprite sheet。多數遊戲兩種都會用到,我們從同一份原始美術兩種都交。
| Spine 骨骼動畫 | 序列影格/sprite sheet | |
|---|---|---|
| 檔案大小 | 小:一套貼圖,動作以資料儲存 | 隨影格數與解析度增加 |
| 執行時控制 | 混合、改速、換 skin、觸發事件 | 播放、暫停、循環 |
| 適合 | 綁骨架的角色、符號、UI、Logo | 流體、煙霧、爆炸、烘焙 3D |
| 解析度 | 同一專案可針對各目標重新匯出 atlas | 每種目標尺寸要各出一套 |
| 引擎需求 | Spine runtime | 任何 2D 引擎 |
常見問題
可以。把分層原始檔(PSD 或同等格式)寄給我們,我們會在不更動已核准設計的前提下,用 Spine 綁骨架並製作動畫。如果只剩合併好的 PNG,我們會先重建圖層,並在估價中列為獨立項目。分享任何檔案前都會先簽 NDA。
兩者都有。每次交付都包含可編輯的 .spine 專案,連同 JSON 或 binary 骨架與 atlas 匯出,之後你的團隊要調整時間或新增狀態,不必再回來找我們。美術原始檔的完整 IP 在專案完成並付清尾款時移轉。
你的 runtime 用的那個版本。Spine 匯出檔和編譯進引擎的 runtime 版本綁在一起,所以我們會在開工時確認,並匯出相符的版本。若你的專案會上多個引擎 build、各自用不同 runtime,我們會從同一份原始專案提供多個匯出。
不會。PlaySmith 只交付視覺素材;軟體開發與整合由你的團隊負責。粒子特效以含 alpha 的 sprite sheet 翻頁動畫交付,若用 Spine 驅動的特效圖層更輕量,也會一併提供。我們會附上參考渲染,讓你的工程師若要在原生粒子系統重建特效時可以對上時間點。
取決於素材與狀態的數量,所以我們依狀態估算範圍。包在整款老虎機視覺製作裡時,動畫會在每款 30 個工作天(約 6 週)的週期內完成。單獨下單的話,我們會在 3–5 個工作天內把時程和估價一起回給你。
專案制報價含一輪大幅修改。審看預覽渲染時提出的時間與緩動微調,會當作正常製作流程在匯出前處理。若改動會更動已核准的設計或新增狀態,則另行報價,讓雙方的範圍都保持透明。
可以。因為打包系統會自動切圖與命名,從已核准的 Spine 動畫產出 sprite sheet 備用版是例行步驟。這對必須在舊裝置上跑的 HTML5 版本很有用,行銷團隊需要影格做影片與 banner 時也用得上。
寄來素材清單,取得逐狀態估價
Email hello@playsmith.studio,或透過聯絡頁面,附上素材清單、目標引擎與一款參考遊戲。歡迎非同步溝通,不用開會;我們會在 3–5 個工作天內回覆逐素材、逐狀態的估價。
聯絡 PlaySmith本頁數字與定價頁、llms.txt 使用同一份事實。
