• Editor
  • Animation and Setup tools

hey Nate! thanks for your quick response!
first of all, sorry for my retarted and bitter post lol, i should have been more informative. and sorry for my bad English 🙁

i have to say it : your program is rock solid, robust, fast, smooth, auto updating, crisp UI and many more!
i think u guys did an amazing job, and where spriter failed (with all the implantation support such as cocos2dx) u guys did stunning job, you are active and do make this thing works! 🙂 so i just want to let you know i really appreciate your hard work and i bought your product instantly without even checking if the export work, because i do beilvie it 🙂 and love the silky smooth feel of your program. again sorry for being bitter 🙂

i played around a lot with your program,and ill metion the good things and bad things:

1) setup time and process:

  • loved the PHOTOSHOP Script! saved tons of time and seems to work good with the jason (did some problem with export, might be PS bug but later it was fixed. (also! maybe put a PIN in the forum so i could get the latest photshop script, there are like 5 running around the forum, dont know which one is the latest, and in your app folder i only have script for illustrator)

but still, setup process is far from being perfect, in fact its really slow, and tedious.

  • problem with bone setup and edit.
    i went forward with your "all bone approach" and its fine, we just need to set out mind that bone is also a pivot and take it in mind while creating them. the only problem i found with bone creating is editing them, after i placed a bone, why cant i edit its pivot point or origin ? for example i made a full character, parent it and found out the arm bone was too short, and i want to re-position the bone origin in setup mode so the arm will rotate in the right way, i was not able to edit the bone, only "hard painful" deleting it completely from the tree, replace image, recreate bone... took long time: if you could add in with a keystroke. for example pressing the bone (while in setup mode) holding "ALT" will let you "REDRAW" or move around the bone pivot, this will make things very easy to edit.

-double "root" bone
while using the PS script, and loading the character, i had trouble to animate the character the keyframe buttons where disable, thought its a bug but seems like if u have double root bone by mistake, u cannot animate, again editing the tree of bone should be improved and be more easy, deleting bone without deleting image, editing bone pivot, start and end point, and etc....

  • Parenting process
    the select image "P" select bone is fine, its annoying that by default while the "rename" window pops out its not focused on the text field, making you move the mouse to the text field, pressing it, and editing it, while when its pops u can right away time the new name and hit enter (this will save time) also you could improve the way the bone tree is shown, while you want to edit something, delete just the bone without deleting the image, its seems impossible, and u have to delete the bone + image after parent.

  • Ordering images
    its now really slow, and painful. while i tried to find a "trick" to do it faster, i was just pressing randomly on the order tree, and tried to see the "bounding box" on the stage and see which body part i selected and then move it around, while if i choose i body part on the stage i do no have "highlight" on the tree (does not make any sense at all that i have to try and try to catch the right body part, if i don't have naming or i have 300 parts, this could be really annoying. what i would suggest that if u select "order" in the tree, and then on the stage select an image, you will instantly see it "marked" or highlighted in the order. also, a MUST HAVE feature, is binding for moving image order up or down, in Photoshop its CTRL + {} in illustrator its CTRL + up\down and in flash also something like that, this will speed up the order process by 80% ! please add this, the binding combo does not really matter, make something logic, even +- will work 🙂 but u have to add this one 🙂)

2). Animation process

-loved the Graph option! the bezier tangets and stuff really usefull!. also loved the new ghosting option! works great 🙂

  • missing a "key all" stroke : i think it was "K" that should key select the whole pose but seems not to work, "L" only key just one value, its a must that ill be able to press one button and key the whole pose, (like in maya for instance) maybe its a bug, but K don't work for me.

  • editing key-frames
    its a must have, not being able to select the "diamond" and change its position its really messed up for animators, please add the option, even CTRL + CLICK and then drag it around, also if i select few diamonds key-frames together, add the option that i can "stretch" them together and maintain the timing changed relatively (the space between key to key will increase relative to the stretch) also not being able to select all keys is annoying, while i want to select all and see the graph, its not good that the only option is from dopesheet, and dopesheet selection is really bad (if u have tons of part)

  • dope sheet
    its great! love the option to do some overlaps animation and change timing for each part, but!! if u have tons of parts selecting it from dopeshit is hard! u need to select from up and wait until its select all down.. maybe add a "bullet" that if u press on the key its automatic selecting the whole dopsheet keys in the selected timeline area instead of manually wait for the mouse drag to select it all (hope i was clear on this one) being able to select all keyslots at currnet frame will speed up the process. also i was not able to "increase" the size of the window (when i go to the upper corner, like in photoshop) when i am on the dope sheet, or even "tear off" to another screen so i could see the whole keys and work (this could be very helpful)

  • changing body parts on the fly
    while u have to add them to the bone and then "click" the little circle at the tree to have them being replace is really slow process, spriter did it right when they added that u right clicjk the image and u instantly see all the images u have and u can choose which one to replace, this could be more fast and intuitive for the animator if u add something like that.

Seggestion:
dunno how hard is it, or if its possible, but maybe add a "SKEW" option, this will make animation 10X more flexible, (like in flash).

changing keystrokes and shortcuts: animators dont like changes, and if they know a program or two its sometimes hard to getting used to it, if u will add the option to have keystrokes similar to other programs, like flash, maya, and ETC... this could be really nice... but its not a must have.

  • i have a lot of things to add, but i know its take time... so i just mentioned the important stuff that will make "SPINE" a must have animation tool and improve all the way setup works, since now the major problem is SETUP MODE.

also wanted to say i made a few simple animation, turned to work smooth as hell 🙂 and really nice!
will test them soon on cocos2dx 🙂)))

again thank you so much for your listening and being active in the forum and community, u did everything right!!, the only thing need to be fixed fast is just the front end experience with setup mode... and its perfect 🙂)) :yes: :yes: :yes: :yes: :yes: :yes:

p.s:

hope i have been enough informative now 🙂) :love: :$

Related Discussions
...

@bobo sorry if this is a short post, I'm on my phone and have a NASTY hangover after a wedding yesterday. If you need to tweak the position of your bone without moving the images, just enable image compensation, likewise you can enable bone compensation as well. This makes tweaking your pivot really quick without having to move images afterwards.

Just some suggestion: set those hot key on the LEFT side of keyboard so we can just use left hand to finish the task while right hand operating the mouse. It's going to be way more effective than what we have now. For example, parenting a image, I have to move my left hand to the right or use right hand moving it away from the mouse. Those subtle differences makes greate differences if tasking in large number.

Whew that's a lot of text. 😃 Diving in...

bobo wrote

hey Nate! thanks for your quick response!
the only problem i found with bone creating is editing them, after i placed a bone, why cant i edit its pivot point or origin ?

As Shiu mentioned, use bone and/or image compensation to adjust a bone without affecting child bones or attached images.

-double "root" bone
while using the PS script, and loading the character, i had trouble to animate the character the keyframe buttons where disable, thought its a bug but seems like if u have double root bone by mistake, u cannot animate

You should only ever have a single root bone. How did you get more than one?

the select image "P" select bone is fine, its annoying that by default while the "rename" window pops out its not focused on the text field

The rename dialog selects all the text. The new-slot dialog and existing-or-new-slot dialogs focus the textfield. Did you mean a dialog other than these three? I've changed the new-slot dialog and existing-or-new-slot dialog to select all the text in the textfield.

delete just the bone without deleting the image

You should never need to do this, since you can edit the bone just fine.

- Ordering images [snip]
what i would suggest that if u select "order" in the tree, and then on the stage select an image, you will instantly see it "marked" or highlighted in the order.

It would be awkward to have to first select draw order then an image, just to get it to select the slot under draw order. The way to do it is this: uncheck the image and bone filters at the top of the tree so only slots are shown. Notice "draw order" is gone, this is because you can drag the slots around directly. Now when you select an image in the editor it is selected in the tree. (actually it isn't, but this is a bug I just fixed and will be in the next version :* )

a MUST HAVE feature, is binding for moving image order up or down

Agreed.

missing a "key all" stroke

It's ctrl+L, but should probably be ctrl+K. Ctrl+L keys all transforms for the selected bones. Often you don't want to do this though, as it causes your animations to be a bit robotic. You also want to use as few keys as possible, which is a little more efficient at runtime.

- editing key-frames
its a must have, not being able to select the "diamond" and change its position its really messed up for animators, please add the option, even CTRL + CLICK and then drag it around, also if i select few diamonds key-frames together, add the option that i can "stretch" them together and maintain the timing changed relatively

We could allow dragging the orange diamonds in the timeline with ctrl pressed. For now just use the dopesheet. At the top of the dopesheet is an "overview" row that shows all the keys. Moving keys in this row is identical to moving the orange diamonds.

Click and drag in the dopesheet to make a selection box. Then click and drag the selection box edges to scale the keys. You can also scale them negatively to flip.

if u have tons of parts selecting it from dopeshit is hard! u need to select from up and wait until its select all down..

I think the "overview" row in the dopesheet handles this.

i was not able to "increase" the size of the window (when i go to the upper corner, like in photoshop) when i am on the dope sheet, or even "tear off" to another screen so i could see the whole keys and work (this could be very helpful)

You can drag the "Dopesheet" button up and down to resize the dopesheet. Tearing it off to a new window would be nice but is hard to implement.

- changing body parts on the fly
while u have to add them to the bone and then "click" the little circle at the tree to have them being replace is really slow process

This feature is planned:
https://trello.com/card/slot-image-choo ... c0059d9/45

dunno how hard is it, or if its possible, but maybe add a "SKEW" option, this will make animation 10X more flexible, (like in flash).

Skew is almost free form deformation and is pretty involved. Maybe in the future.

changing keystrokes and shortcuts

Possibly a way to customize shortcuts, but not any time soon.

Thanks for all the feedback! Keep it coming. 🙂 I like the small changes that improve things the most. We've promised a bunch of features in the Kickstarter, so I have to prioritize all of those before I can work on other features. If I didn't do this then the Kickstarter stuff would never get done, or would drag on and on. This means if a suggestion wasn't part of the Kickstarter and isn't something I can do quickly, unfortunately it has to be left for later.

I think the "two roots" he's talking about is just the two skeletons you end up with in one project when you import the json data exported from the Photoshop script.

"Import Data..." adds the skeleton from a JSON into your current project. But the skeleton data from the Photoshop script doesn't have the default animation that the New Project/New Skeleton normally has. When you go to Animate mode, you can't move or key anything. I assume this is the behavior you intentionally programmed for when there aren't any animations selected. It's just that it's not immediately obvious because the list of animations is at the bottom of the tree pane.

It's not really a bug. But I guess it's a place for a non-modal warning that says "This skeleton needs animations before you can animate anything." if you go to animate mode in a skeleton without animations. Or something. Or a prompt to create one, which might be annoying if you wanted to purposefully make an animationless skeleton.

But this does factor into the main issue I suspect with the centralized Tree UI, which is that the transparency it gives by being relatively 1:1 to the storage model/object model/json (being just a list of lists of lists of lists of what's in it) might not be working for the best interests of the animator.

It's useful as a data-centric summary for geeky types; Spine shines in its backend transparency. But I don't think a list of lists should be the go-to place for manipulation or inspection— not for image swapping. Not for keying color changes. Not for changing draw order. Not for finding bones or slots or images or animations. Maybe not even for inspecting what slots are under the currently selected bone.— It might be a function of typography or visual styling, but it's just too hard to skim or read or find or reach anything in it. And that means it scales really poorly with even moderate complexity of the skeleton.

In fact, it kinda feels like some of the big categories— the bone hierarchy, bones' child slots, the available images, the skins, the list of animations— should be in their own panels or areas, each optimized for the task involving them. And some of them should be represented in some other task-centric part of the UI. (I for one could get behind a good, solid, inspector pane or overlay widget that helps me get a read on and do stuff really quickly to my current selection)

In Setup Mode, it would certainly make sense to be able to drag an image from the list of available images into slots without having to repeatedly scroll up and down to find "where the hell is that image/slot I needed?".

And in Animate Mode, it would certainly make sense to put the list of animations (especially the currently selected animation) in a more visible, easy to reach place.

I'm not sure what the current plan is for the slot image chooser though.

I have a number suggestions for possibly small things. I'll post them later. : p

Nate thank you so much for your quick and informative comment! makes me more happy that i supported this project. also i tested my animation on cocos2dx and they seems to work really well ! (didnt do stess test but i have seen u have the leaks bugs no cocos2dx on controll and fixing it)

i didnt really get how i can edit bones, and where is that "bone/image compensation" is. i think u should add a picture sequence that explain it in the documentation, or even a dedicated video of setup mode tweaks (also all the things u talked about here that are not shown in the doc) because there is no possible way someone will magically find it if the keystrokes and process is nothing like other software we might be familiar with.

Pharan wrote

I think the "two roots" he's talking about is just the two skeletons you end up with in one project when you import the json data exported from the Photoshop script.

"Import Data..." adds the skeleton from a JSON into your current project. But the skeleton data from the Photoshop script doesn't have the default animation that the New Project/New Skeleton normally has. When you go to Animate mode, you can't move or key anything. I assume this is the behavior you intentionally programmed for when there aren't any animations selected. It's just that it's not immediately obvious because the list of animations is at the bottom of the tree pane.

yep exactly what i mean 🙂 and its a shame since i though the PS script wil save me time, but i had to figure out how to delete the extra root and un needed roots, something there was not straight forward for the user.

again, thanks a lot of your response and for listening to the community needs and requests. keep your great work coming

:clap:

In the first quick overview video I show you how to use the compensate tools. I guess I can make an in depth version of it. I'll get to that either tonight or tomorrow. http://www.youtube.com/watch?feature=pl ... jxU#t=472s

We'll definitely add more documentation, just wan't to get some more of the features out of the way. Much easier to do good documentation once the different features are in.

Pharan wrote

But this does factor into the main issue I suspect with the centralized Tree UI, which is that the transparency it gives by being relatively 1:1 to the storage model/object model/json (being just a list of lists of lists of lists of what's in it) might not be working for the best interests of the animator.

Possibly. The tree is a pretty simple view of the project. At the very least it is a good fit for bones. For data that isn't hierarchical it could be represented in other ways. I think the biggest problem is people wanting to do everything in the tree. This will have you scrolling up and down and I agree is not good UX. It isn't the only way to do it though. Filters should also help a little.

Keep in mind that Spine supports multiple skeletons, so there isn't just one "Images" path, etc. It would still be possible to use something besides a tree, it just complicates things. Using multiple skeletons in a project isn't used heavily in Spine right now, but was put in because it is hard to tack on later and enables certain usage, eg building cutscenes.

In Setup Mode, it would certainly make sense to be able to drag an image from the list of available images into slots without having to repeatedly scroll up and down to find "where the hell is that image/slot I needed?".

Don't do that. :p Click an image, click Set Parent or press P, click a bone in the editor. Much easier, no scrolling!

And in Animate Mode, it would certainly make sense to put the list of animations (especially the currently selected animation) in a more visible, easy to reach place.

True. Not sure where though, without doing a large UI overhaul. FWIW, the dopesheet shows the animation name in the "overview" row at the top. If you click the name it takes you to the animation in the tree. Not quite the same as your idea, but a helpful shortcut. 🙂

I think it's less of people wanting to do everything in the tree and more the tree being the only currently visible (and currently working) way to do things.

I figured out the Set Parent thing after a while. Really helps. The missing tooltip for that button is a major bug, I think. : p

IMO though, that context-sensitive box of options and buttons on the bottom is too far from the tree items and viewport/cursor most of the time to be useful for repetitive tasks. From what I recall, you had something against right-click menus? XD Fitts's Law is why hotkeys and transform handles and right-click menus work well.

Here's three smallish changes I thought of offhand:

(1) In Animate Mode, could you make it so that when you click on a bone name or slot name in the dopesheet, it selects that item in the viewport and tree?

You can select images through the viewport in Setup Mode (with the nice outline effect when you hover);
(2) In Animate mode, could you make it so that you can (+modifier key) click on images in the viewport to select its parent slot or bone? This is just so I don't have to keep digging in the tree whenever I need to do an image swap or have a few bones that are really close together.

When I select a bone, I want to be sure I'm selecting the one I want right away. Not clicking and looking someplace else, then looking back and clicking again and looking someplace else.
(3) Is it also possible to show the bone name OR highlight the images under a bone when you (+modifier key) hover over that bone?
It's really messy to show all of the bones and bone names all the time, and the button to toggle showing and hiding bone indicators and bone names is too far to use frequently. The tree and the bone name that shows up at the bottom of the viewport is too far from the cursor to be useful in this way.

And one idea for the long run:
Apart from Local, Parent and Global axes, an awesome extra axis would be "Previous Keyframe"... which would probably be Previous Keyframe Global and Previous Keyframe Local.

I get the multiple skeletons for cutscenes, but it feels like animating cutscenes would have to be an entirely different UI arrangement. I feel like with just Setup Mode and Animate Mode, selecting an active skeleton (and its set of available images) should be from a dropdown, or a separate list somewhere.

quote="Pharan" In Animate Mode, could you make it so that when you click on a bone name or slot name in the dopesheet, it selects that item in the viewport and tree?[/quote]
The bone name collapse the group. You can currently click the item name under the bone though to both select the bone or slot and the appropriate tool. This works best with the dopesheet locked.

quote In Animate mode, could you make it so that you can (+modifier key) click on images in the viewport to select its parent slot or bone? This is just so I don't have to keep digging in the tree whenever I need to do an image swap or have a few bones that are really close together.[/quote]
https://trello.com/card/easier-bone-sel ... c0059d9/77

quote Is it also possible to show the bone name OR highlight the images under a bone when you (+modifier key) hover over that bone?[/quote]
https://trello.com/card/show-bone-name- ... c0059d9/78

And one idea for the long run:
Apart from Local, Parent and Global axes, an awesome extra axis would be "Previous Keyframe"... which would probably be Previous Keyframe Global and Previous Keyframe Local.

Implementing this would be hell. :p Getting the 3 we have just right was a huge pita. Neat feature idea though.

I get the multiple skeletons for cutscenes, but it feels like animating cutscenes would have to be an entirely different UI arrangement. I feel like with just Setup Mode and Animate Mode, selecting an active skeleton (and its set of available images) should be from a dropdown, or a separate list somewhere.

Yes, cut scenes really need an animation mixer, which is like the dopesheet but shows what animations will be played and for how long. Still, having two skeletons in the same scene does enable cutscenes, synchronized skeleton animations, and other things.

10 days later

you guys are working great! i am very impressed with the activity and response on the forum and how good the actual animation turns out once you export it its working smooth and exactly like in the spine tool.
well deserve every dollar i payed for support ! 🙂 and i will recommend all my friends to purchase your product. very very robust tool (really impressed with how smooth the tool is), hope to see the UX fixes soon

Thanks bobo! 8) It's been a little quiet lately. Over the next 2 weeks I'll do some of the easier tasks, then I'm taking a short break for a honeymoon in Real Life. 🙂 Tying the knot (noose? 😉) tomorrow!

enjoy your honeymoon ! :}

Thanks! 🙂 I'm all married now, though the real honeymoon is July 2, when I take 2.5 weeks off. 🙂