ShoeBox:スプライトとゲーム素材のための無料「万能ナイフ」

renderhjs 製の ShoeBox は、スプライトシート・ビットマップフォント・テクスチャアトラスなどを扱える無料のドラッグ&ドロップ ツールキット。エンジンを問わずゲーム・UI 開発者に愛用されています。

  • Windows
  • macOS

ゲームや UI を作っていると、地味な作業がつきまといます。スプライトをアトラスに詰める、 シートをフレームに切り戻す、ビットマップフォントを生成する、スクショからスプライトを切り出す——。 renderhjs 製の ShoeBox は、それらを一つの無料ドラッグ&ドロップ アプリにまとめました。 長年、ゲーム開発のツールチェーンで静かに定番となっている一本です。

どんなソフト?

ShoeBox toolbox grid with all utilities
Every tool is one drag-and-drop away.

ShoeBox は Windows と macOS 向けの無料 Adobe AIR アプリで、ゲーム・UI 関連ツールが満載。 どのツールも ドラッグ&ドロップ、またはクリップボードで操作します。ファイルをツールに ドロップするか、画像やテキストをコピーしてクリックするだけ。プロジェクト設定も不要で、 とにかく速く、手になじむワークフローです。

すでに使っているエンジンやフレームワークとも好相性です。Unity、Starling、Sparrow、 Cocos2D、NGUI、pixi.js、HTML5、Corona、andEngine など。

特に役立つツール

Pack Sprites tool with input images ready to atlas
Drop sprites in — get an atlas out.
Packed sprite sheet and metadata output from ShoeBox
Atlas image plus metadata for your engine.
Bitmap Font generator preview in ShoeBox
Bitmap fonts compatible with AngelCode .fnt.
Extract Sprites tool cutting frames from a transparent sheet
Auto-detect frames on transparent sheets.
  • Pack Sprites — 複数の画像、アニメーション SWF、GIF を一枚のテクスチャアトラスに詰め込む。
  • Read Sprites — シートやビットマップフォントから個々のスプライトを書き出す(画像+ ルックアップテキストが必要)。
  • Bitmap Font — Photoshop でデザインし、AngelCode .fnt 形式に対応したビットマップフォントを生成。
  • Extract Sprites — 透過画像内のスプライトを検出し、自動で切り出す。
  • Extract Tiles — ゲームのスクショからタイルマップとタイルバンクを抽出。
  • Split PSD — Photoshop のレイヤーを個別の PNG に分割。
  • Texture Ripper — 写真やスクショから矩形のテクスチャを抽出。
  • Ani Frames / Frame Sheet — GIF・SWF・PNG 連番を、フレーム単位のアニメーションや 一枚のアニメーションシートに変換。
  • Sprite Pivots — 複数スプライトの基準点(ピボット)を一括編集。
  • Slice 9 — 拡大縮小可能な UI 用に 9 パッチ(slice-9)セットを作成・読み込み。
  • Mask Image — クリップボードの画像をマスク・ぼかしして複雑な合成に。

各ツールは設定可能です。ツールを右クリックしてテンプレートを選べば、使うエンジンの出力形式に合わせられます。

インストール

ShoeBox は Adobe AIR 上で動作します。

  1. Adobe AIR ランタイムをインストール。
  2. 3.6.3 より前のバージョンは先にアンインストール(新しいビルドで証明書が更新されました)。
  3. ShoeBox.air ファイルをインストール。

こんな人に

インディー開発者、テクニカルアーティスト、2D コンテンツを作るすべての人に効きます。 ShoeBox はアート制作ツールを置き換えるものではなく、午後をまるごと奪いがちな 「その間」の面倒な工程を消してくれます。

優れたツールは、創作そのものを代行しません。その周りの雑務を消し去るのです。 ShoeBox はまさにその好例です。

入手は renderhjs の ShoeBox ページ から。