Sorry your browser is not supported!

You are using an outdated browser that does not support modern web technologies, in order to use this site please update to a new browser.

Browsers supported include Chrome, FireFox, Safari, Opera, Internet Explorer 10+ or Microsoft Edge.

AppGameKit/AppGameKit Studio Showcase / SpriteFX WIP - Animation system / spritesheet maker

Author
Message
baxslash
Valued Member
Bronze Codemaster
17
Years of Service
User Offline
Joined: 26th Dec 2006
Location: Duffield
Posted: 21st May 2012 17:49 Edited at: 16th Oct 2013 00:39
I have changed the name of "Character Workshop" to "SpriteFX". I think it's more general and a little more catchy New demo attached!



This is a procedural animation system for AppGameKit (and I guess other languages too). It is currently in use in a TGC project for iOS/Android etc and is working pretty well but still needs some work on making the GUI more user friendly.

SpriteFX FULL LATEST VERSION updated 15th October 2013


Demo Project with runtime code


The latest version now exports spritesheets although I haven't fully decided which features to sell and which to give away yet so this version has watermarks and doesn't export animation data. It should still give you an idea of the functionality though I hope.





How does it work?
...put your images in the media folder for the app then:-
1-Character-Create New Limb
-This will let you load an image as a sprite
2-Hold shift and drag the 'limb' somewhere in the middle
3-Drag without shift to rotate the limb
4-Character-Set Limb Rotation
-This will let you change the rotation point of the limb from the centre of the sprite to somewhere else by first clicking on the sprite you want to edit then clicking where the rotation should be
5-Character-Set Limb Parent
-This lets you select which limb is the parent limb (if a parent is moved or rotated its children move too). First click the 'child' sprite, then the parent
6-Depth
-This menu lets you edit the draw order of your limbs
7-File-New Character
-This will clear the scene
8-File-Save Character
-This will let you save the scene
9-File-Open Character
-This will let you re-open a previously saved scene

I plan to add:
Exporting spritesheets / images
Smooth interpolation for individual limbs / keyframes
Automatic Ragdolls from exported data
Fully scalable timer based movement
Editable physics based particle system within workshop and as exportable emitter

oct(31) = dec(25)

Attachments

Login to view attachments
Cliff Mellangard 3DEGS
Developer
18
Years of Service
User Offline
Joined: 20th Feb 2006
Location: Sweden
Posted: 21st May 2012 18:00
Very cool
I will try to test it later on !
baxslash
Valued Member
Bronze Codemaster
17
Years of Service
User Offline
Joined: 26th Dec 2006
Location: Duffield
Posted: 21st May 2012 18:00 Edited at: 26th Mar 2013 17:27
Thanks Cliff! I need to get this working by Friday so any help would be much appreciated!


this.mess = abs(sin(times#))

Attachments

Login to view attachments
The Zoq2
14
Years of Service
User Offline
Joined: 4th Nov 2009
Location: Linköping, Sweden
Posted: 21st May 2012 18:10
This looks awesome!

I have to try it sometime
baxslash
Valued Member
Bronze Codemaster
17
Years of Service
User Offline
Joined: 26th Dec 2006
Location: Duffield
Posted: 21st May 2012 19:04
Please do, and check back as I'll be updating this thread a lot this week.

MikeMax
AGK Academic Backer
12
Years of Service
User Offline
Joined: 13th Dec 2011
Location: Paris
Posted: 21st May 2012 20:20
Great job Bax ! I will try this as soon as possible
bjadams
AGK Backer
15
Years of Service
User Offline
Joined: 29th Mar 2008
Location:
Posted: 21st May 2012 20:28
AGK would be greatly incomplete without all these useful Baxslash tools.
The Zoq2
14
Years of Service
User Offline
Joined: 4th Nov 2009
Location: Linköping, Sweden
Posted: 21st May 2012 20:49
Quote: "AGK would be greatly incomplete without all these useful Baxslash tools."


Agreed
MrValentine
AGK Backer
13
Years of Service
User Offline
Joined: 5th Dec 2010
Playing: FFVII
Posted: 21st May 2012 21:04 Edited at: 16th Sep 2013 18:23
nose dive!

hmm I am wondering how else this can be utilised...

DBpro? I mainly do 3D work so can this be utilised in any way? long shot but hey you never know

baxslash
Valued Member
Bronze Codemaster
17
Years of Service
User Offline
Joined: 26th Dec 2006
Location: Duffield
Posted: 21st May 2012 21:24
You could use it only for 2D in DBPro I would imagine. Would work with the DBPro Box2D plugin

kamac
13
Years of Service
User Offline
Joined: 30th Nov 2010
Location: Poland
Posted: 21st May 2012 22:14
Really nice

And done fast

Follow me on twitter! @MotionStruct
Rich Dersheimer
AGK Developer
14
Years of Service
User Offline
Joined: 1st Jul 2009
Location: Inside the box
Posted: 21st May 2012 23:36
Wow, looks like it will be awesome!

I know it's a WIP, but I don't seem to be able to add more than one of any image. For example, I can add one upper leg, but nothing happens when I try to add another with the same .png file. I'm sure your working fast and furious on it though.

Some things that would be good to have...

An UNDO options for when I really didn't mean to do what I just did, oops.

A zoom options, for detailed work. 150%, 200%, etc.

Also, when you release the next beta version, how about an example character file? I've included my one-armed, one-legged zombie.

Attachments

Login to view attachments
baxslash
Valued Member
Bronze Codemaster
17
Years of Service
User Offline
Joined: 26th Dec 2006
Location: Duffield
Posted: 22nd May 2012 00:13 Edited at: 22nd May 2012 00:14
Quote: "I know it's a WIP, but I don't seem to be able to add more than one of any image. For example, I can add one upper leg, but nothing happens when I try to add another with the same .png file. I'm sure your working fast and furious on it though."

Thanks Rich, that's exactly why I put it out early. I missed that one!

Quote: "Some things that would be good to have...

An UNDO options for when I really didn't mean to do what I just did, oops.

A zoom options, for detailed work. 150%, 200%, etc."

I'll add an undo at some point but for now I think a delete limb option will do. Zoom and pan will be coming very soon.

Quote: "Also, when you release the next beta version, how about an example character file?"

Will do, good idea!

Rich Dersheimer
AGK Developer
14
Years of Service
User Offline
Joined: 1st Jul 2009
Location: Inside the box
Posted: 22nd May 2012 00:44 Edited at: 22nd May 2012 00:50
I just noticed that all the media files are also in the "permitted" Documents/AGK/CharacterWorkshop/media folder. But my game assets aren't copied to my permitted folder. Do you copy them there yourself? Or there some process I'm not aware of?

EDIT: Never mind, I just figured it out. I haven't used the new commands to look for images in a folder, but I just looked at the help, and I guess any images that are loaded like that get copied to the "permitted" folder, and I loaded ALL the images, so they all got moved, heh heh.
Duffer
21
Years of Service
User Offline
Joined: 9th Feb 2003
Location: chair
Posted: 22nd May 2012 00:50
@ baxslash,

V interesting. Will give it a whirl.

a long time dabbler with DBC and DBPro with no actual talent but lots of enthusiasm...
baxslash
Valued Member
Bronze Codemaster
17
Years of Service
User Offline
Joined: 26th Dec 2006
Location: Duffield
Posted: 22nd May 2012 01:03
Quote: "EDIT: Never mind, I just figured it out. I haven't used the new commands to look for images in a folder, but I just looked at the help, and I guess any images that are loaded like that get copied to the "permitted" folder, and I loaded ALL the images, so they all got moved, heh heh."

There is a slight bug in that you have to manually create the media folder before anything is copied in, it's on the bug board.

Cor
AGK Developer
13
Years of Service
User Offline
Joined: 19th Dec 2010
Location: Its a trap!
Posted: 22nd May 2012 01:06
Looks awesome! This would have been very useful when I made the rag dolls for stress ninja.
The Slayer
Forum Vice President
14
Years of Service
User Offline
Joined: 9th Nov 2009
Playing: (Hide and) Seek and Destroy on my guitar!
Posted: 22nd May 2012 01:06
Whoaaaah, bax...what can I say...outstanding man! This tool could be veeeeeeeeeeerrry useful! Sweeeeeet.
Just watched the vid...noticed that the arm was hidden behind the head...teh order of which you add new limbs (sprites) does affect the sprite depth, I assume? Would it be possible to allow an option to change the order?

Nice work, man.

Hodgey
14
Years of Service
User Offline
Joined: 10th Oct 2009
Location: Australia
Posted: 22nd May 2012 01:20
Someone's been busy! That's truly amazing baxslash. Even I might be able to make a few animations with this tool.

baxslash
Valued Member
Bronze Codemaster
17
Years of Service
User Offline
Joined: 26th Dec 2006
Location: Duffield
Posted: 22nd May 2012 08:09
Thanks guys

Quote: "Just watched the vid...noticed that the arm was hidden behind the head...teh order of which you add new limbs (sprites) does affect the sprite depth, I assume? Would it be possible to allow an option to change the order?"

Yes, draw order is now completely editable.

Alien Menace
AGK Developer
19
Years of Service
User Offline
Joined: 11th Jan 2005
Location: Earth (just visiting)
Posted: 22nd May 2012 10:19
Wow, that's really cool!

Apps published: 3
BraindeaD
15
Years of Service
User Offline
Joined: 30th Mar 2008
Location:
Posted: 22nd May 2012 10:26
Really impresive, baxslash.
There is any possibility to include built-in anims (walk, run, hit, shoot...)?
Thanks for your work.
baxslash
Valued Member
Bronze Codemaster
17
Years of Service
User Offline
Joined: 26th Dec 2006
Location: Duffield
Posted: 22nd May 2012 10:32
Quote: "There is any possibility to include built-in anims (walk, run, hit, shoot...)?"

I guess it might be possible to have a basic character template where you'd just have to change the images to your own and edit the rotation positions when not in keyframe mode. I'll have a play when I get to that point.

bjadams
AGK Backer
15
Years of Service
User Offline
Joined: 29th Mar 2008
Location:
Posted: 22nd May 2012 13:06
maybe it would be a good idea in the future to be able to save out animation co-ordinates in "banks" and then load them in again and apply them to different limbs/structures.

Don't know what kind of data will teh program output. i assume it's a text file that one can load and manipulate and integrate in his own engine?
baxslash
Valued Member
Bronze Codemaster
17
Years of Service
User Offline
Joined: 26th Dec 2006
Location: Duffield
Posted: 22nd May 2012 13:18
Quote: "maybe it would be a good idea in the future to be able to save out animation co-ordinates in "banks" and then load them in again and apply them to different limbs/structures.

Don't know what kind of data will teh program output. i assume it's a text file that one can load and manipulate and integrate in his own engine?"

The output will eventually be something like this:
num of limbs
-limb data (IE.angle / position / joint limits etc)
num of keyframes
-keyframe data per keyframe (IE.limb angle / position changes)

At the moment I'm only outputting the initial limb data.

bjadams
AGK Backer
15
Years of Service
User Offline
Joined: 29th Mar 2008
Location:
Posted: 22nd May 2012 13:31
great!
this way it will be easily integrable with one's code.

another good option is that i use photoshop as my main placement editor and then output screen co-ordinate positions in a text file. hopefully i can output in a format recognisable by this tool, so that i can automatically load all sprite positions and depths in place right away and not have to place them manually (i have 60 sprites on each screen)!

i will wait for the tool to be a bit more complete and then use it for my next project which will require a lot of such animation.

the project if for ipad retina, so do you think it will be easy to load in pictures in sizes of 2048 x 1536 and then zoom out in the editor screen?
baxslash
Valued Member
Bronze Codemaster
17
Years of Service
User Offline
Joined: 26th Dec 2006
Location: Duffield
Posted: 22nd May 2012 13:38
Quote: "another good option is that i use photoshop as my main placement editor and then output screen co-ordinate positions in a text file. hopefully i can output in a format recognisable by this tool, so that i can automatically load all sprite positions and depths in place right away and not have to place them manually (i have 60 sprites on each screen)! "

If you can output the character part of the code (without animation) in the correct format there is a good chance it will be possible (with some slight code changes).

Quote: "i will wait for the tool to be a bit more complete and then use it for my next project which will require a lot of such animation."

Cool, I will be using it heavily myself so perhaps between us we can iron out the main bugs

Quote: "the project if for ipad retina, so do you think it will be easy to load in pictures in sizes of 2048 x 1536 and then zoom out in the editor screen?"

I will add zoom in and out in a future update. I see no reason that size of image wouldn't work as long as AppGameKit can load it.

bjadams
AGK Backer
15
Years of Service
User Offline
Joined: 29th Mar 2008
Location:
Posted: 22nd May 2012 14:48
Problem with 2048 x 1536 artwork is that my PC desktop is only 1280 x 1024 so that won't fit!!!!!
baxslash
Valued Member
Bronze Codemaster
17
Years of Service
User Offline
Joined: 26th Dec 2006
Location: Duffield
Posted: 22nd May 2012 15:04
Quote: "I will add zoom in and out in a future update."

...

Nokiaqd
14
Years of Service
User Offline
Joined: 31st Aug 2009
Location:
Posted: 22nd May 2012 15:42
delicacy

I'll be glad to use such istrument in the future ..

badablog.ru - bada developer
baxslash
Valued Member
Bronze Codemaster
17
Years of Service
User Offline
Joined: 26th Dec 2006
Location: Duffield
Posted: 22nd May 2012 15:48
I have added keyframing for position and rotation. Now I just need to add moving / deleting keyframes and a few minor things before I can play an animation. Then I need to add animation export...

I fixed the bug for adding multiple limbs with the same image today too. I have a fully working zombie test character. I'll add a basic walk sequence to him once I have the code in place and then you'll have a character to play with.

bjadams
AGK Backer
15
Years of Service
User Offline
Joined: 29th Mar 2008
Location:
Posted: 22nd May 2012 16:52
very fast progress!
Nokiaqd
14
Years of Service
User Offline
Joined: 31st Aug 2009
Location:
Posted: 22nd May 2012 22:56
baxslash fast very fast...
closely follow your progress ...

badablog.ru - bada developer
cdoty
14
Years of Service
User Offline
Joined: 13th Feb 2010
Location:
Posted: 23rd May 2012 00:27
Nice program.

The only issues I've noticed is the difficulty in parenting objects (occasionally it doesn't seem to work), and changing sort order (again, sometimes doesn't seem to work). Maybe having an indicator indicating when you're in each of the modes, and not exiting the mode until a correct selection is made, or the indicator is clicked on to abort the operation.

And, a suggestion is to allow the pieces to be moved with the arrow keys to allow more precise movement (and maybe support Page Up/Down to change depth).
baxslash
Valued Member
Bronze Codemaster
17
Years of Service
User Offline
Joined: 26th Dec 2006
Location: Duffield
Posted: 23rd May 2012 07:53
All good ideas cdoty I'll keep them in mind. At the moment I'm hacking the basic features out for this weekend so getting it working is my main priority. Getting it working well will come later

Thanks for testing it!

bjadams
AGK Backer
15
Years of Service
User Offline
Joined: 29th Mar 2008
Location:
Posted: 23rd May 2012 09:27
maybe a good idea is that when the cursor is on the sprite, the sprite is highlighted and on a box in the corner you see a small image of the parent of the sprite. and you can switch on and off the box.
baxslash
Valued Member
Bronze Codemaster
17
Years of Service
User Offline
Joined: 26th Dec 2006
Location: Duffield
Posted: 23rd May 2012 09:35
I like the idea of having a helper by the cursor. For now I might just highlight the child once selected and highlight any potential parent in another colour...

BatVink
Moderator
20
Years of Service
User Offline
Joined: 4th Apr 2003
Location: Gods own County, UK
Posted: 23rd May 2012 12:15
Wow, looks impressive...and essential. I may try it on some quirkier objects when I get chance, I see it being more useful than just for characters.

baxslash
Valued Member
Bronze Codemaster
17
Years of Service
User Offline
Joined: 26th Dec 2006
Location: Duffield
Posted: 23rd May 2012 12:26
Quote: "Wow, looks impressive...and essential. I may try it on some quirkier objects when I get chance, I see it being more useful than just for characters."

vinkster! How's it hangin' dude

Yes, I really want to make it a handy spritesheet making tool too for explosions and other effects.

It could be used for a wide variety of things really once it's done...

I like the idea of setting up vehicles with motors too!

baxslash
Valued Member
Bronze Codemaster
17
Years of Service
User Offline
Joined: 26th Dec 2006
Location: Duffield
Posted: 23rd May 2012 16:59 Edited at: 23rd May 2012 17:03
Not had much progress today but I thought I'd share a screenshot showing keyframes being created (in red on the timeline at the bottom):


Edit: The timeline is scrollable and runs from 0 to 99. This will ultimately work as a percentage of an editable timeframe. This allows up to 100 keyframes in any single animation. The output will include the start position of the character and any changes over the timeline to any limbs, children will be adjusted along with any parent limbs.

Eventually I'll also add full frame export for every limb but for now this suits my needs.

Attachments

Login to view attachments
Ancient Lady
Valued Member
19
Years of Service
User Offline
Joined: 17th Mar 2004
Location: Anchorage, Alaska, USA
Posted: 23rd May 2012 17:07
You are just too cool!

Cheers,
Ancient Lady
3d point in space
14
Years of Service
User Offline
Joined: 30th Jun 2009
Location: Idaho
Posted: 23rd May 2012 17:52
i guess you would have to do it in dark gdk or dark basic for 3d. I guess that sence backslash is doing this program that means that no one else has will have to do it. I would of used mfc to make a simular menu to that which you can do in agk just have to look at some of my old programs in dark gdk.

Developer of Space Chips, pianobasic, zipzapzoom, and vet pinball apps.
Developed the tiled map engine seen on the showcase.
Veterian for the military.
baxslash
Valued Member
Bronze Codemaster
17
Years of Service
User Offline
Joined: 26th Dec 2006
Location: Duffield
Posted: 23rd May 2012 17:58
I would consider using mfc if the C# wrapper for AppGameKit was updated as I use forms in C# at work. I imagine there's a way to make it work with a console app although I haven't looked into it. I guess I should just learn C++ at some point but I'm happy with what I'm using for now.

Sometimes it's nice to create your own GUI for a different look although it would be good if the fonts scaled nicer...

Hopefully I'll get this to live up to expectations

baxslash
Valued Member
Bronze Codemaster
17
Years of Service
User Offline
Joined: 26th Dec 2006
Location: Duffield
Posted: 23rd May 2012 18:34
It's crunch time. The fundamental code for animation the character needs to be written now! I've got working Play / Pause / FFW / REW / First / Last buttons. I just need to fill in my "updateCharacter()" function which sets the rotation and position of each limb according to the keyframe data...

*cracks knuckles and takes a final gulp of coffee*

Let's do this

polomint
11
Years of Service
User Offline
Joined: 3rd Apr 2012
Location: Lancashire, United Kingdom
Posted: 23rd May 2012 19:27
Go for it baxmeister, hehhe

Blackberry App Development & ZX Spectrum Game Development.
baxslash
Valued Member
Bronze Codemaster
17
Years of Service
User Offline
Joined: 26th Dec 2006
Location: Duffield
Posted: 24th May 2012 15:42 Edited at: 25th May 2012 18:24
Still not quite there with the keyframing code but if you ignore that then you can try the new demo which comes with a full zombie character (File->Open character then type "zombie"):
Download!

Attachments

Login to view attachments
baxslash
Valued Member
Bronze Codemaster
17
Years of Service
User Offline
Joined: 26th Dec 2006
Location: Duffield
Posted: 24th May 2012 15:43 Edited at: 24th May 2012 15:44
New screenshot attached.



Attachments

Login to view attachments
baxslash
Valued Member
Bronze Codemaster
17
Years of Service
User Offline
Joined: 26th Dec 2006
Location: Duffield
Posted: 24th May 2012 18:28
Keyframe animation is now working! I just need to work out a strange little bug in my tweening code and then I'm about ready to add animation export / import... and saving with the character I guess.

At least now I can set up keyframes and when I click on a keyframe it remembers the limb rotations (which are all relative to the parent limb).

Animation will not allow movement of limbs for the time being, only rotation of the limbs within your character.

Getting there

Rich Dersheimer
AGK Developer
14
Years of Service
User Offline
Joined: 1st Jul 2009
Location: Inside the box
Posted: 24th May 2012 19:17
Sweet!
The Slayer
Forum Vice President
14
Years of Service
User Offline
Joined: 9th Nov 2009
Playing: (Hide and) Seek and Destroy on my guitar!
Posted: 24th May 2012 23:37
Coooool, bax!

You da man!

Login to post a reply

Server time is: 2024-03-02 03:49:15
Your offset time is: 2024-03-02 03:49:15