13 replies to this topic

[SeriousSam]

V1.3



Here is a little something for the hobby game programmers and artist out there, including myself. It is a plugin to test and design Sprite Sheets. For those that do not know a Sprite Sheet is a collection of images arranged in a grid used to make animations. This is done instead of having a bunch of image files.

Hidden Content:

About:
This plugin will load each image from the grid to build a list of "frames". And from the list sequences can be created and animated.

I am quite proud of the user interface. Drag and Drop is used to add and arrange the frames. What this means is just click and drag to move them. An insertion point is drawn to specify the location. It is very intuitive and fast to create sequences.

For a simple demonstration try this image

Select "Animation->SpriteSheetAnim" to run the plugin. Upon opening the 4 frames will get added into the left list box like screen shot above where it says "Frames 4". This is the working set of frames that are used to build animation sequences. This set can not be arranged or added to like the sequence list. The size of the frames happens to be 32x32 pixels which is the default but this can be adjusted to up to 512x512 pixels. Selecting "Draw Grid" is useful for matching the frame size to an existing sprite sheet or starting a new one.

Creating a sequence is as easy as clicking any of the frames from the "working set" and dragging to the "sequence set" on the immediate right. Frames 0 and 1 were added to the sequence in the above screen shot. Frames in the sequence set can be arranged by dragging and removed by hitting the Delete key. Also, holding Control will duplicate the frame while dragging instead of moving (think copy then paste).

To start animation press the "On" button and "Off" to stop. While running the current frame is highlighted in the sequence list.

Hidden Content:

Version:
V1.1 May 20
Improved Drag Drop Scrolling
Zoom decrement bug fix
Support for different borders around frames. No border, border both sides, or border just to right
Other bug fixes

v1.2 May 25
Added Saving/Loading Sequences. Make sure to save to file after done creating.

v1.3 May 31
Improved insertion of frame during drag and drop.

Added GIF save feature! Tested with Firefox and IE8.
Notes on GIF:
GIF's can only be created! There will be no support to load GIF's. Animations can be recreated by saving and loading sequence data.
The GIF is set to loop indefinitely and will animate at the same speed as the preview.
GIFs must use a palette. I choose to use the gdi, Window's graphic application interface to generate palette and image data for convenience. It is most likely using the window's system palette. As a result detailed images do not look that great. I noticed detailed images get dithered/halftoned. I am looking into some more advanced techniques on generating an optimized palette. I would also like to add an option to use PDN's palette or a web safe palette may also be included.

Attached Files

•  PdnAnimateControlSln.zip   134.14K   2899 downloads
•  PDNSpriteSheetAnim.zip   16.41K   3852 downloads

[david.atwell]

This is mad cool! Nice job with the UI. Excellent work! Looking forward to subsequent releases.

[SeriousSam]

Thanks david, a majority of work was doing the GUI. The actual animation and grid drawing were fairly easy. Expect to see some updates soon!

[Kemaru]

WOW!! You are amazing, thanks! I have one question, though. After composing the animation, what does it do? Does it save as .pdn or as .gif?

[SeriousSam]

Thanks Kemaru. It is very common in 2D games, like super mario brothers on snes for example to use sprites sheets. They are simple and easy to use. What this plugin will do is help create different animation sequences from them. It saves the animation sequences created as a text file that could be loaded into a game. No image data is saved; only the sequence info is saved. So with this tool the user must open the same image to do the animation again.

I realize not every one is a hobby game designer but would like animations for web sites so I have been looking into saving alternatively as an animated GIF. So far I have looked over the file format and at some different existing code libraries. If I get it working I will include it into an update In the mean time I believe there is a plugin that uses different layers to save a animated gif.

[Simon Brown]

I'll consider adding code into the GIF/APNG plugin to allow the user to choose to have sequences detected in the image and use them as the animation instead of layers.

[barkbark00]

^that would be really cool!

[david.atwell]

Excellent job. This should be the gold standard in animation.

[Kamala]

Holy Cow, this is going to be a great feature!

I had one question - I already understand what to do with the .dll file, but what file should the skin file go, as it does not say dll? (Can you tell I'm still painfully new?) :oops: :shock:

Thanks so much for this.

[Simon Brown]

If you mean the SLN download, that's only of use to other plugin authors.

[Kamala]

Thank you, Simon 8)

I had it saved to my desktop in the interim - I'll go ahead and discard. Thanks for your time and kind help.

[wiirus]

[...]
GIFs must use a palette. I choose to use the gdi, Window's graphic application interface to generate palette and image data for convenience. It is most likely using the window's system palette. As a result detailed images do not look that great. I noticed detailed images get dithered/halftoned. I am looking into some more advanced techniques on generating an optimized palette. I would also like to add an option to use PDN's palette or a web safe palette may also be included.

First, thank you very much. I like it.
Would that mean that I have to use the windows pallette to avoid results like this?

Right?

[Mike Ryan]

Crazy awesome! While that hobby died down for me a few months ago, this is almost reason enough to jump back in. UI is excellent, it is fast, and it all makes sense. Well done

[rtargo20]

SeriousSam , I have your plugin installed under Effects and I can't get
any file loaded or how/where do I draw a stick man? I have used "Pivot Stickfigure Animator" ,
made some stickmen which are .stk files and they will not load into your plugin. I'm at a
loss as to what file type it will load. Will you please give me some guidance to get started?
Thanks, Robert

Edit: I didn't download >>>>File comment: VS2008 C# Solution
PdnAnimateControlSln.zip [134.14 KiB]
Downloaded 535 times <<<<
Should this be downloaded?