SPIN Sprite Sheet Maker

[Hoeloe]

Hey there! I made this app because I needed to compile simple animations quickly and easily for my game. This app is very simple, so don't expect anything marvellous from it. All it does is compile a bunch of separate images into one, and it starts a new line each time you reach the user-defined maximum number of columns. It's not difficult to use, you just select the files you want, click open, select the number of columns you want (with an estimate given as default) and then click "Make Sheet". You can then save it as a .png, .jpg or .bmp file.

Accepted filetypes are .png, .jpg, .jpeg, .jpe, .bmp (Sorry, no gif. Unsupported due to animations).

The app was written in C# with the XNA framework. I built it for myself, but I thought I might as well share it.

Screenys!

v1.0:





v1.1:








v1.2










v1.3











v1.4





(Sprites from FE5, or made by me)

2.0+ Screenshots

v2.0

Version 2.0, with a very different look. I also decided to name the application SPIN.

This time, instead of viewing frames as a long line, you build the sheet in the GUI, previewing it as you go. The sheet consists of animations, and they in turn consist of frames.

Animations can be dragged around with the box on the left. They will snap back, however, unless you have another animation to move them relative to each other.

Like the old application, you can set the number of columns. However, this time it's animation specific, so you can make better use of the space.

Another feature from the older version, now changed to be on an animation basis, rather than global, is the frame separation.

Background colour is still a global option. You can set a background colour or remove it. If you have no background colour, though, some filetypes will export with a white background due to lack of alpha support.

Here, we see a frame inside an animation is selected. Notice some different controls have been highlighted on the toolbar.

Frames can be dragged around to rearrange them, as in the old version.

Here we see a second animation, which has a whole separate panel for it.

Here's something interesting. Frames can be dragged from one animation, and dropped into another. This will change which animation the frame belongs to.

By selecting an animation, and hitting the preview button, you can preview an animation. You can look at it frame by frame, or set the FPS and watch it play.

When saving these files, they use slightly different formats to the old version, though some of the old filetypes can still be opened.

Lastly, these are the filetypes you can export your image as. Sorry, still no .gif.

You can download the old app here (v.1.4.0.6)

The newer version can be found here (v.2.0.0.1)

To install it, just unzip it and run the setup.exe.

That's pretty much it. I might add more stuff later on, but for now that's all you get.

[UnHolyDarkth]

Nice program. I think it'll help organize spritesheets nicely

Although, small question: Can you change the background color or will it be completely black?

[Previous]

I think it's neat, I like such tiny tools.
However, of course, I already have my own similar app, haha.


Personally, I prefer it when you can select a folder. I never use the Win standard folders in the user directory (I didn't even keep any shortcuts) and I think it'd be more convenient if you could choose one where you like (for example, directly in the project directory where you want to have them). Well, your call.

[Hoeloe]

Nice program. I think it'll help organize spritesheets nicely

Although, small question: Can you change the background color or will it be completely black?

The background colour will be transparent. The black is just there as a preview.

I think it's neat, I like such tiny tools.
However, of course, I already have my own similar app, haha.


Personally, I prefer it when you can select a folder. I never use the Win standard folders in the user directory (I didn't even keep any shortcuts) and I think it'd be more convenient if you could choose one where you like (for example, directly in the project directory where you want to have them). Well, your call.

That's easily arranged. I'll probably do that when I update it again. I'll also try and add the ability to copy and paste into the file path. Thanks for the suggestion.

[Hoeloe]

Here are a few screenshots of the next updates new features! (Not actually released yet)

Spoiler

List of files at the bottom of the browser, along with the ability to edit the paths manually.


A sprite previewer, with the ability to set an FPS and play the animation through. You can also select frames to preview them each separately.


The ability to pick up and drag frames from the timeline to reorder them.


Just an example of a reordered frame.


As per Previous' request, you can now save the files anywhere you like, with the whole path included in the save box.

I have a few more things I want to add before I release the update, namely the ability to add "new line" frames in the previewer, which will be used to separate animations and expand the uses of the program.

EDIT: Okay, new features!

Spoiler

Here, you'll notice the ability to reverse the animation and delete frames. All very useful. You'll also see the "New Line" button.
That forward slash you see is a "New Line" frame. They can be dragged about and deleted just like other frames, but they have special properties. Firstly when you play the animation, if it hits a new line frame, the animation will restart as if it had hit the end of the sheet.


And this is what happens when you make the sheet. The new line does what you might expect and forces a new line to occur on the sheet, before the column limit has been reached. This is to allow multiple, different length animations to be put on the same sheet with ease.

ALSO UPDATE RELEASED.

EDIT: New revision. You now have the ability to duplicate frames, and I've fixed a few bugs with the system, so deleting and adding frames now works correctly.

EDIT: Another update because the maximum number of columns didn't update when you changed the number of frames, so it made things awkward in that way.

[Hoeloe]

The link is back up now. Sorry for the inconvenience, I found a load of bugs one after the other and had to fix them. If you find any more, be sure to let me know.

[Previous]

Heh, I know that just too well! You think you're done, wrap it up and then notice a bug. And another one. Aaand the next.

[Hoeloe]

Yep. Fixing one bug just causes 3 more to pop up.

[Hoeloe]

Another small update. Found that copy and paste ability was broken, and that attempting to open files purely by typing them into the path didn't work unless something was selected. Both fixed now, I hope.

[Hoeloe]

Got another major update. I'm having a surprising about of fun making this better.

Spoiler

Here's the first and most minor of the new features, which allows you to preview sprites before you finalise loading them in. It will show you the last one you selected, along with its filename.

Here's another major update. UnHolyDarkth gave me this idea. You can now set the background colour for your sheet.

There's a button to toggle the preview of it, and it will always fill that area, so don't worry about that. There are 12 presets, including the transparent option, which are all fairly useable, non-eye-burning colours.

On top of the presets, there's also a Photoshop-styled hue slider and colour picker. You can get practically any colour possible with it, and if that's still not enough, there's also the option to directly type hex codes to load in colours.

And this is what the sheet looks like with a background colour.

Yet another major update. With the introduction of allowing you access to the full filing system, a simple text box wasn't going to cut it for me, so I built a different kind of file browser, to let you save your files.

Along with this comes the option to save as 3 different filetypes, which is the purpose behind the transparency warning on one of the previous screenshots, since only .png supports transparency of the 3.

You can overwrite existing files, and it will give you a prompt if you try to. Be warned, regardless of what you type, the browser will remove all content after the last "." you type, and replace it with your chosen extension, so you may not be overwriting a file if it is of a different filetype to the one you chose.

And lastly, you may have noticed 2 buttons at the top of the browser. One allows you to travel up through your file system, and the other creates a new folder. This is just previewing that.

That's all for now. I haven't updated the download link yet, but look out for v1.2.

EDIT: Link updated! I also fixed a couple of bugs along with this update, so it should all run fairly smoothly. Let me know if anything breaks.

EDIT AGAIN: Found a bug that stopped you being able to type. Fixed now.

AND AGAIN: Found a bug with the scroll bars, and also added the ability to scroll them while dragging a frame by moving the mouse to one side or the other.

[puggsoy]

I'm having a surprising about of fun making this better.

I know right? It's amazing how fun updating a program is. Guess it's just the satisfaction of improving your work

[Hoeloe]

Guess it's just the satisfaction of improving your work

Well, that and the fact that I'm building a lot of standard objects (Buttons, text boxes, file browsers, etc.) from scratch, and it's quite a challenge to get them all working correctly.

[Hoeloe]

Thought I was done with this? So did I. Until my girlfriend gave me an idea for a feature.

So here's the obligatory screenshot post for v1.3

Spoiler

You'll see here a different icon amongst the image and folder icons you've seen before... and an odd filetype, .ssh.

Now you'll also see Save and Open buttons on this screen, before you render the sheet.

And this is the save screen. .ssh is a Sprite Sheet File, and stores all the information involved in the project.

So here I have another sheet open (featuring a sprite made by yours truly).

And if we open the .ssh file we saved just a minute ago...

Everything pops back up, including new lines and the background colour! Your computer should also link .ssh files to this app, so you can load a project simply by opening a file directly.

Note that .ssh files are fairly large, as they are essentially storing all of the images involved in the project in one file. I may add another filetype later that has a smaller filesize, but stores only the location of each file, so it won't necessarily open the same project if you change the source.

[Hoeloe]

Yet another update (download coming shortly).

Spoiler

Here, you'll see two new filetypes, .ssp and .ssl. Both are new to this update.

And you can save your sheets as any of them. Note that .ssh is last on the list, because it has been usurped by .ssp. The .ssp filetype is larger than .ssl, but more stable. It stores all the images in your sheet in the file, to be reloaded at will. The .ssl file is a lot smaller, because it doesn't save any of the images. Instead, it saves the location of each image in your hard drive, to be loaded in at a later date. Thus, you cannot transfer .ssl files between computers securely...

...Because this might happen. This image appears if you load a .ssl file and one of your images has been renamed, moved or deleted.

Now I mentioned that .ssp files have taken the place of .ssh files. Why? Because .ssh files did not store the location of the file, and .ssp does. This means that you can convert between .ssp and .ssl, but .ssh does not have the correct information to do so. If you load a .ssh file, you cannot save the result as a .ssp or .ssl for this reason. If you want to make completely sure your file is safe, I suggest .ssp. If you're keen on saving space and don't mind about sharing your files, then perhaps .ssl is for you.

[gensym]

Hoeloe, have you heard of http://www.imagemagick.org/Usage/montage/ ?