It is a really nice idea to create (at least) a mockup for Inkscape. Moreover, a real UI design for SVG animation is good. Here is my answer:

1) Just animating the image slider. I am not a web designer after all.
2) Types of animation. It is because frame by frame and tweening (motion tween and shape tween) are incredibly important. If you create an option to choose which type user can use, it will be good. So make it clear to user, he/she is using framing or tweening. I know it is very hard.
3) I am not sure.
4) The interval should be displayed. Make it as clear as possible. And make user can easily hide/view it.
5) No, no additional window. Place it horizontally, above the color pallete bar.
6) Depends on the length of the animation itself. If it is long, so timeline is very important. If it is short, then simple (Powerpoint-like) animation control will be important.
7) Oh, do you mean animation template? Same as programming library, create once use everywhere? It is a nice idea. Make it optional, user can choose both whether it is in different project or in the same project.

So you are from Czech? Thank you from Indonesia. Sorry for my English.

Hi, this is a late answer but maybe it's useful (?).

I have been looking into animation options for SVG and there is, for me at least, definitely a "hole" to be filled.

On the one hand there's Inkscape, which I find a fabulous SVG editor / drawing program. But as far as animation goes, almost nothing.
On the other hand there's Synfig, which is quite nice as an animation tool (missing some advanced features but a good base, I find), but which I find too restricted as a drawing/design tool to be useful. Coming from Inkscape, it's just too clumsy. I just don't have enough control over the shapes and paths, etc.

I think that if Inkscape could be "grafted" on Synfig, the combination would be great. Like add the Inkscape interface to Synfig for creation and modification of shapes and paths, or add the animation tools of Synfig to Inkscape. Kind of merging them together.

I suppose that this is not as easy as it sounds as far as programming goes.

As far as your questions go:
1) I wouldn't design web pages exactly. I would make animations just for the animation (to be displayed as such).
2) I would like to animate about anything I can modify through Inkscape's user interface. Obviously position of shapes and nodes, colors, blur and fade, stroke properties. But ultimately almost any parameter can be ineresting. I think Synfig has a good approach with their timeline. Critical would be advanced features to "smooth out" movements (accelerations etc) in a graphical way, "drawing" the change velocity etc.
3) Don't know
4) a kind of arrow pointing to the element that triggers? Clicking on one, or hovering over it, makes the element that triggers light up?
5) Oh please, not a zillion separate windows like the Gimp (or Synfig), but one single window. Just like Inkscape would be fine, dockable or free float according to one's own preference. A highly customizable interface, with a standard preset.
6) The two. Again like Inkscape: graphic interface with an XML editor that automatically jumps to an object you click on.
7) Don't know either. Not really critical I think.

What Synfig is missing is a graphical way of smoothing out a movement. If you want to make a ball bounce, for instance, you have to calculate the times between keypoints yourself. Ideally you should be able to draw a graph representing speed/acceleration/..., I feel.

Thank you for your great idea.

Wouldn't it pay off to see if you couldn't join forces with Synfig, instead of starting over again? Although I would prefer something that starts with Inkscape, adding animation functions to it, would be awesome...

I'm in the process of writing a page about animation for the Inkscape website. Hopefully it should be ready for the live site within the next couple of weeks. You can see what I have now, which is seriously subject to change, at this point, on the staging site http://staging.inkscape.org/en/learn/an ... d-inkscape.

Note that the links aren't live yet, and are simply text URLs. But specifically, you might find this wiki page interesting, if you haven't found it already: http://wiki.inkscape.org/wiki/index.php/SVG_Animation (it has a link to another wiki page about a UI, near the top).

Based on my research so far, it seems someone picks up the idea of animation with Inkscape, every several years or so, starts wiki pages or project pages elsewhere, but soon drops it, for whatever reason. (Perhaps once they really get involved, they realize what a huge undertaking that apparently it would be, and just can't do it alone.) I hope having a page on the website, aside from having a place to refer interested visitors, will help to focus, and generate more interest. Perhaps it will take a small team to make animation a native feature. Or perhaps Inkscape could be forked into an animation version....I'm not sure, really, being as uninformed about programming and development as I am.

I don't know if the op here ever achieved any results on their project, since they've never posted a followup. Maybe they decided not to continue, since they got literally no response from us here, for over a year.

Nice page, interesting!

Conclusion stays the same, of course, nothing that really rocks the boat. Synfig is by far the closest, I think, to a real SVG animation tool, but I find its drawing interface very clumsy (coming from Inkscape). It feels like drawing with your elbows, as it is based on Karbon (I think), and Karbon is not up to par with Inkscape, at all. As far as the Synfig animation tools go, they're very promising. I like their timeline concept, you can animate lots of parameters.

If I imagine the perfect solution, it's a few extra dockable dialogs for Inkscape (timeline, ...) which you can show (when you want to animate) or hide (in case you just want to draw). A bit like Blender: you can just 3D-draw in it, or you can animate, activating the tools for animation. Or an Inkscape fork, but then really closely following Inkscape...

I'm going for Javascript, for the moment (still learning and having not much spare time, so it's slow). Because I also want to use some maths/program flows, not just visually animate. But I would love to play with a good SVG animation tool.

Maybe on your page you could make a difference (different chapters) for
- programs that allow to "onion skin" SVG images (I mean just display one after the another, not sure if "onion skin" is the right word) (like Gimp, Tupi, ...)
- "real" native SVG animation programs meaning you can animate actual SVG parameters over time (Synfig)

Maybe what is really needed is a mockup for developers to follow or be inspired by? In detail, I mean, really showing what it should look like according to the people who want to use it?

Maybe what is really needed is a mockup for developers to follow or be inspired by? In detail, I mean, really showing what it should look like according to the people who want to use it?

Did you find this page? http://wiki.inkscape.org/wiki/index.php ... imation_UI

Maybe on your page you could make a difference (different chapters) for
- programs that allow to "onion skin" SVG images (I mean just display one after the another, not sure if "onion skin" is the right word) (like Gimp, Tupi, ...)
- "real" native SVG animation programs meaning you can animate actual SVG parameters over time (Synfig)

Oh, well I'm learning as I go with this. Do you mean that "real" SVG animation allows you to have certain parameters (say a rectangle or text object) to be animated....say rotates, while some other part is animated differently, say it moves in a straight line across the page?

I do understand how GIMP animation works. I haven't tried Tupi or Synfig or Blender yet, although I keep threatening to.... But with GIMP, you have to draw each "frame" (a whole image for each frame) as a different layer. I guess animating in an SVG file is done with scripts. I guess you would have a script applied to the "rectangle or text object", to rotate, and a different script applies to the other object, to move it across the page? I'm beginning to see how making a ui for this will be such a huge task!

Assuming I understand that correctly, it's a distinction I had not really considered. And btw, if anyone else has any comments about that new animation page, I certainly would appreciate hearing suggestions

Ah no, I didn't find the UI page. Will look into that, thanks.

By "real SVG animation" I mean: at keyframe "0s" SVG-parameter X (whatever attribute of a path or shape or text) is x and at keyframe "1s" it's y, and interpolation between x and y is following this or that function (linear, exponential, ..., ideally drawn graphically). Animating the SVG-parameters. But in a graphical way, just like Inkscape actually writes code when you drag a rectangle on the screen. Ideally with also an XML-editor, like Inkscape.
By contrast, animating in Gimp for instance is like a flipbook. You take snapshots and then make a flipbook out of them. Not the same thing at all.

Actually, Synfig does "real" SVG animation. The Synfig timeline is really, really interesting (see screenshot).


I drew a path, added a second keypoint (the first is predfined at 0s), and changed path node positions, color and feather at the second keypoint. I dragged the nodes graphically around; the color and feather values were set by hand.
You can see in the screenshot all the parameters that can be defined at every point - graphically and/or by defining values -, plus the interpolation method between them where applicable (there are properties you can get into, for most parameters). It's pretty impressive.

Only thing with Synfig is I can't get used to the drawing interface, it's too much like Karbon or LibreOffice Draw style, and it lacks many features that Inkscape does have. But as far as animating goes, they've come a long way already, very promising... Rather steep learning curve however, for me at least. And as long as the drawing part doesn't promise to get better, I'm reluctant to dive into it...

And concerning the timeline widget on the SVG Animation UI wiki page you mentioned, it looks great.
But I would love to see a little triangle left of each element (for instance "ball"), that if clicked on opens up all the parameters of the element, so you can set/modify them at keyframes. Like the Synfig timeline (see my previous post).

The IPO curves window is perfect, and that is missing in Synfig (I think, I'm not an expert either).

I think the proposal on the wiki page, if the parameters would be added to the timeline (as I mentioned above, by opening them up when clicking on a little triangle), would already go a very long way. Would love to see it happen.

I just noticed that Krita is working on incorporating animation also (well, during lunchbreaks apparently ).

Animation-plug-in
The animation plug-in is also being refactored in this branch.

Refactoring is necessary because the architecture of the Animation Plug-in was awkward to work with.
Right now, animation has been folded into the main Krita program, so we have a single program for both illustration and animation.
Filestructure is also currently being worked on.
There’s been correspondence about funding this feature, which is good, because then we can have someone work on this properly instead of during lunchbreaks.

(Source: https://krita.org/item/last-week-in-krita-week-45-3/)

Here is a pre-alpha video: https://www.youtube.com/watch?v=LnvVCHRzDoY.

Krita is tremendously interesting because it has full raster drawing/painting support (rather like MyPaint, lots of brushes etc) and full vector support, "mixing" the two in one single program! (On separate layers). Very cool. Again, like Synfig, its vector interface is, to me, too clumsy, compared to Inkscape, but the concept is very powerful. This vector interface problem is like a KDE malediction, I really don't like these Karbon-like interfaces.

But they're developing a lot, I think, and are heading towards having in one and the same program raster, bitmap and animation capabilities, not bad.

- SOMEtimes we have projects where we need to control everything in exact detail.
- SOMEtimes we just need a simple result quickly. It could be done by one of our beginners. With just a small number of commands.
I suggest making a streamlined variant of the animation interface, for quick and dirty projects that is easy for a beginner to learn with just the essential animation commands. With a primitive, or even no timeline. For the full set of commands, switch to the advanced view. But for many, lightweight users, they will never need that.

Well, anyway I just read on the Google+ Inkscape Community that animation for Inkscape is not to be realistically hoped for, until an extra developer comes into the project and dedicates a lot of time to it. Which is understandable, of course.
Javascript and snap.svg, here I come

Just found this. Another program, maybe with different possibilities?

That would be this: https://duckduckgo.com/l/?kh=-1&uddg=ht ... spberry_Pi

So Raspberry, Linux and Mac - no Windows version, it looks like.