next »

[renderhjs]

website / detailed info
http://renderhjs.net/shoebox/

Its a drag and drop tool to process game related data such as sprites, sprite sheets, tiles and textures. This is a early on preview, in the future I plan more tools that I use myself in conjunction with frameworks such as Unity3d or Molehill Flash.
The application is written in AS3/ AIR so it will run on OSx and Windows, but you need adobe AIR installed before you can use it.

YouTube video





Some of the current tools that are included

Sprite Packer
Your typical sprite packer with some unique flavours and quick usage.


Sprite Extractor
Tool that lets you parse sprite islands from a opaque PNG image in a fixed "read" order. All detected image sprites can be saved with names read from a variable array.


SWF/ GIF frames export
Renders either GIF or SWF (including actionscript) frames and puts them either into a sprite sheet or saves them as a image sequence.


Tile Extractor
Early preview of a upcomming Tile extractor tool


Share Folder
Tool to push and pull typical working data from and into. It supports any files you drag on it or clipboard bitmaps or clipboard text data.






Upcoming tools I am working on

• SWF animation converter
  Detects motion in AVM1 or AVM2 (as1,as2,as3) swf movies even if the animation is scripted and converts to a sprite sheet and tween instruction data.
  
  This is a analysed animation, because it analyses the tweens I can blend smoothly through the key frames:
  
  
  
  
  
  And this is what several converted SWF animations look like in Unity3d:
  
  
   
  
• Sprite Hull Packer
  Similar to the sprite packer this tool will generate a texture atlas but with polygonal objects (not plain rectangles aka bounding boxes of the bitmaps). That way I hope that I can save 30-40% of the texture space and put even more content on limited tetxure memory.
  
  
• Mac and PC path converter
  Almost done, converts and opens clipboard paths of network location between mac and path, or copies and path of a dropped file.
  We use it at our company Soap to transfer paths across artists, designers and developers.
• Texture transform extractor
  Already available as a seperate AIR app, but I want to include it into this tool set
  
  
  
  

The next updates will also cover a better documentation and instructions or tutorials on how to use these items effective.

[moi]

nice, I'm more particularly interested in the tile extractor and the swf animation extractor will no doubt be interesting to those who can use flash.

[baconman]

This is some righteously impressive stuff!

For the longest time, I'd wondered about what people can do with those commonly-found opaque spriterips that seem to have no concept of gridspacing, and now I know there's hope.

[Dr.Electro]

this is amazing!

i developed a png exporter for scripted and nested movieclip-animations too, to export to cocos2d for an iPad-App .. i planned to develop it further but you covered already everything i had in mind. impressive job!

[JMickle]

this looks incredible! definitely checking it out.

[renderhjs]

this is amazing!

i developed a png exporter for scripted and nested movieclip-animations too, to export to cocos2d for an iPad-App .. i planned to develop it further but you covered already everything i had in mind. impressive job!

Yes even at my company a friend wrote pretty much the same, we shared at some point some code snippets to grab movieClip frames, or detecting flipped / mirrored movieclips (which is rather hard). It seems to be a common thing these days for mobile and iOs developers to convert existing flash animations or pieces of it.

[renderhjs]

got some progress with the sprite hull packing algorithm. Obviously in these examples the padding is missing but it should't change much of the compression statistics.



and a test with the Angry birds sprites (from the chrome webstore version). It could be that best fit 90 degrees rotations might improve the result a little bit. Maybe I won't exceed my previously aimed 30% compression compared to the bounding box method.



Next is to finish the mesh generation and adding the padding and improve speed as it can be slow with large assets and loads of them.

[JMickle]

what would the silhouette packing be used for? i can imagine it would be a huge pain to try and extract those sprites again.

i mean, technically its a fantastic piece of work, but practically...

[davidarcila]

This is a remarkable piece of software

[renderhjs]

what would the silhouette packing be used for? i can imagine it would be a huge pain to try and extract those sprites again.

i mean, technically its a fantastic piece of work, but practically...

I create the mesh pieces as well, they are not shown in those pictures, this is a old screen

but its rather solid right now, just not connected with the packing yet. So in the end the script would create mesh and UV islands and because of their tight silhouette they could be packed like this.

[Painting]

This is spectacular, great job! I think some of the SWF-related stuff could easily make this a vitally important tool for tons of people.

[Manuel Magalhães]

This is amazing. I wish the best for this project.

[JMickle]

I create the mesh pieces as well, they are not shown in those pictures, this is a old screen

Ah! Fantastic

[renderhjs]

A progress video on the Tile Grabber
WIth some sample maps from Bionic Command, Mega Man 4 and a 8x8 GameBoy tile game





Also some SWFgrabber progress



Which is slowly starting to make progress again. It has a better debugging timeline preview and right now I am working on some of the tricky visible true/false states of the elements of a SWF animation.

[gecko]

woooow, this looks great!

Each tool on its own is very useful, so this combination it's like a super mega useful tool!

[renderhjs]

updated to version 1.30
http://renderhjs.net/shoebox/air/shoeBox_1.30_public.air

documentation
http://renderhjs.net/shoebox/

Quite a lot of bug fixes went into this release but I also managed to release some new toys like the Tile Extractor that can generate a TMX tile map with a tile map based on a screenshot, or the Extract SWF tool that is still in development. Because some tools have actually multi purposes I want to update the documentation in the near future with some practical tutorials on how to use some tools in a different way like creating bitmap fonts using the extract and pack sprite tools.

A overview screen of some of the interesting goodies in this release

[Hima]

This is amazing! Please tell me you accept donation! 

[DanFessler]

This is most awesome thing I've seen in a long while.  I'm most excited for you to release your extract-swf framework for unity so I can start playing with it.  I'd suggest you make an XNA framework for it as well to cover your bases.

I have a suggestion for extending ani sheet to be able to cut up sprite sheets into individual frames.  I've made my own tool for this in the past, but it'd be nice to include in this shoebox.

[Richard Kain]

I haven't used the Flash IDE for developing graphics for so long, that some of these tools would never be necessary for what I work on. At the same time, I could see that pack sprites feature being really useful for OpenGL rendering. (where minimizing how often the texture is swapped out can result in major performance savings)

As always, you are a technical wizard, renderhjs

[renderhjs]

I haven't used the Flash IDE for developing graphics for so long, that some of these tools would never be necessary for what I work on...

I am sometimes in the same boat, especially when I work with Unity3D (where 3dsMax is more my IDE for asset creation). But these tools are no way intended for just flash developers, like the animation sheet tool for example supports also animated GIF animations - not just SWF's. The sprite packing and extracting tools on the other hand are what I use for Unity when I need UI, billboards or sprite based things.
I also use them if I work with other artists together to extract their sprites that they drew on a canvas (PNG sheet for example) and I can split each individual item as a separate PNG image.

I have a suggestion for extending ani sheet to be able to cut up sprite sheets into individual frames.  I've made my own tool for this in the past, but it'd be nice to include in this shoebox.

Yes me and a co worker had an idea for that as well, but it would work best if within the filename a naming convention would already exist, like something indicating how wide and tall a individual frame is, or if its a one row animation strip how many frames it has.
e.g. fireAnimation_112x63.png would indicate that a particular frame is 112x63 pixels, figuring then out how many frames there are is easy.