遊戲 / 圖片
精靈圖(Sprite Sheet)製作、切割與動畫工具
將圖片排列成Sprite Sheet或紋理圖集、把圖集分割成獨立影格並製作動畫。不用上傳圖片,即可儲存PNG、JSON雜湊中繼資料、CSS類別、ZIP檔案或GIF動畫。
精靈圖(Sprite Sheet)製作、切割與動畫工具: 「製作」會將PNG、JPG、WebP圖片和解碼後的GIF影格排列成網格、列、欄或緊密排列的圖集。統一儲存格會配合最大圖片尺寸,並支援置中或底部置中對齊、內距、間距,以及選用2的次方尺寸。「切割」可依網格數量或像素尺寸分割,也能透過透明區域或背景色鍵偵測彼此分隔的區塊。儲存ZIP或將影格傳送至「動畫」前,你可以排除矩形區域、略過空白儲存格,以及裁切透明邊緣。「動畫」會以1–60 FPS播放選定的影格範圍,支援循環或乒乓順序、像素縮放和選用的洋蔥皮效果。你可以儲存GIF或水平PNG長條圖。如果需要先繪製影格,請從像素畫產生器開始。 全程在瀏覽器中於本機執行,檔案不會上傳至伺服器。
- 分類
- 遊戲與派對
- 使用次數
- 在瀏覽器中
- 費用
- 免費・免註冊
- 可用狀態
- 可立即使用
全程在瀏覽器中執行
將影格排列成遊戲可用的圖集。
統一儲存格會使用最大的影格,並在每側加上內距。間距會分隔儲存格。
新增影格以開始。您也可以在「切割」中切割圖集,再將影格傳送到這裡。
您的圖片和匯出檔案會留在此瀏覽器中。請在自己的遊戲專案中使用已儲存的檔案。
精靈圖表與紋理圖集
精靈圖表會將多個動畫影格或遊戲圖片儲存在同一張圖片中。規則網格會依每個影格所在的儲存格位置描述影格。紋理圖集可以使用大小不一的矩形,因此需要描述每張圖片的座標。Godot的AtlasTexture說明文件(https://docs.godotengine.org/en/stable/classes/class_atlastexture.html)解釋了如何將圖集中的區域作為紋理使用。
底部中央對齊可讓角色的腳在不同影格中維持相同基準線。排列好的圖格會保留每張圖片的原始尺寸,也不會旋轉圖片。使用二的次方尺寸會在右側或底部增加未使用的像素,不會縮放你的作品。PNG會保留完整的alpha透明度,而GIF的顏色較少,且只有單位元透明度。
JSON雜湊座標
JSON雜湊匯出會將影格名稱作為frames下的索引鍵。每個項目都有包含x、y、w和h的影格矩形、sourceSize、spriteSourceSize,以及rotated和trimmed旗標。座標從圖表左上角開始,以像素計算。meta物件會記錄圖片檔名和圖表總尺寸。Phaser的JSON雜湊圖集載入器(https://docs.phaser.io/api-documentation/class/loader-loaderplugin#atlasJSONHash)說明了這種具名影格格式。
匯出時應使用原始圖片邊界,而不是加上留白的儲存格邊界,並將trimmed和rotated設為false。裁切功能可以匯出所選矩形的個別清單。只有在需要緊密裁切時才裁去透明邊緣;若要保留規則動畫儲存格及其定位,請關閉此選項。在專案中使用圖集前,請先將儲存的矩形與遊戲引擎的匯入器進行比較。
使用方式
- 選擇「製作」、「切割」或「動畫」;每種模式都有可加入書籤的連結。
- 加入影格或圖集,接著調整版面配置、切割網格或動畫設定。
- 預覽結果,並下載遊戲專案所需的檔案。
隱私與限制
你的檔案會留在瀏覽器中,不會上傳。此工具在你的裝置上處理所有資料。
相關工具
常見問題
我應該使用網格還是緊密排列的紋理圖集?
網格會讓每個影格使用相同的儲存格尺寸,方便切割或匯入為規則動畫。緊密排列的圖集會將不同尺寸的影格分層放置,以節省空間。緊密排列的影格不會旋轉,因此你的遊戲引擎需要使用匯出的JSON矩形資料,或設定等效的區域參數。
為什麼要使用內距、間距或邊緣延伸?
經過篩選的紋理可能會取樣鄰近像素,產生稱為紋理溢色的色彩接縫。內距會在每個儲存格內留下空間,間距則會在儲存格之間留下空隙。此工具加入的是透明或背景色像素,而不是複製的邊緣像素。邊緣延伸會將精靈圖的邊緣色彩重複到邊框中;如果專案需要,請使用遊戲引擎的紋理設定,或使用支援邊緣延伸的圖集打包工具,尤其是在使用mipmap時。
如何將圖集匯入Godot、Unity或Phaser?
在Godot中,將圖集的區域用作圖集紋理或動畫影格。在Unity中,將圖片視為多個精靈圖,並切割規則網格或定義矩形區域。Phaser可以使用規則Sprite Sheet或JSON hash圖集。請將PNG和其JSON放在一起。匯入設定會因工具而異:若要保持像素藝術的清晰度,請選擇最近鄰篩選,確認透明度和儲存格尺寸,並確保影格名稱與JSON格式符合你的專案。
GIF的透明度和時間有哪些限制?
GIF最多支援256種調色盤色彩,以及一個透明調色盤項目,因此像素只能是完全透明或不透明。低於50%的Alpha會變成透明,其餘Alpha則會變成不透明。你也可以改選混合色,讓平滑邊緣以該色彩融合。影格延遲會四捨五入至10 ms,且最短為20 ms,因此無法精確表示60 FPS。匯出的GIF會持續循環播放;乒乓模式會加入返回影格,但不會重複端點。
我的檔案會離開瀏覽器嗎?
不會。讀取圖片、排列圖集、偵測區塊和製作匯出檔案,全部都在你的裝置上進行。大型圖集和較長的動畫需要更多記憶體。影格超過400個或單邊超過8,192像素時,畫面上方會出現警告。工作限制為最多匯入1,000個影格、每邊16,384像素,以及每個圖片或動畫匯出檔案最多64百萬像素。
免費工具・使用在瀏覽器中次・免註冊