Let lines simultaneously been drawn

Post questions on how to use or achieve an effect in Inkscape.
tylerdurden
Posts: 2174
Joined: Sun Apr 14, 2013 12:04 pm
Location: Michigan, USA

Re: Let lines simultaneously been drawn

Postby tylerdurden » Sun Jun 24, 2018 12:39 pm

Will do!

SVG Image
Have a nice day.

I'm using Inkscape 0.92.2 (5c3e80d, 2017-08-06), 64 bit win8.1

The Inkscape manual has lots of helpful info! http://tavmjong.free.fr/INKSCAPE/MANUAL/html/

User avatar
Xav
Posts: 1139
Joined: Fri May 08, 2009 1:18 am
Location: UK
Contact:

Re: Let lines simultaneously been drawn

Postby Xav » Sun Jun 24, 2018 4:43 pm

Moini wrote:(May I ask what you kind of animation you built, Xav?)


Nothing worth mentioning. I first came across this technique a few years ago, played with it very briefly to check I'd understood it correctly, and filed it under "things to cover when I get on to web stuff in my tutorials". At the time I didn't expect it would take over 6 years of tutorials before I got onto web stuff.

With your extension I've only created a test file, with a couple of stars, and some text converted to paths then joined with "combine". There's really nothing to share that hasn't now been bettered by TD's creations.
Co-creator of The Greys and Monsters, Inked - Inkscape drawn webcomics
Web SiteFacebookTwitter

Moini
Posts: 2913
Joined: Mon Oct 05, 2015 10:44 am

Re: Let lines simultaneously been drawn

Postby Moini » Mon Jun 25, 2018 2:06 am

@Xav Ah, okay. I thought you've been following some really different concepts, because you understood the extension's purpose differently, so I was curious to see what else one might want to do with it.
Something doesn't work? - Keeping an eye on the status bar can save you a lot of time!

Inkscape FAQ - Learning Resources - Website with tutorials (German and English)

Moini
Posts: 2913
Joined: Mon Oct 05, 2015 10:44 am

Re: Let lines simultaneously been drawn

Postby Moini » Mon Jun 25, 2018 2:47 am

If you haven't read yet, Tav is trying to help getting animation of the path with CSS into the SVG spec:

https://www.patreon.com/posts/biweekly-update-16995867
(just found it)
Something doesn't work? - Keeping an eye on the status bar can save you a lot of time!

Inkscape FAQ - Learning Resources - Website with tutorials (German and English)

Moini
Posts: 2913
Joined: Mon Oct 05, 2015 10:44 am

Re: Let lines simultaneously been drawn

Postby Moini » Mon Jun 25, 2018 3:02 am

(and meshes and hatch fills are no longer in the draft for SVG 2.0 - but they are *in* the draft for 2.1)
Something doesn't work? - Keeping an eye on the status bar can save you a lot of time!

Inkscape FAQ - Learning Resources - Website with tutorials (German and English)

User avatar
Xav
Posts: 1139
Joined: Fri May 08, 2009 1:18 am
Location: UK
Contact:

Re: Let lines simultaneously been drawn

Postby Xav » Mon Jun 25, 2018 5:22 pm

Moini wrote:@Xav Ah, okay. I thought you've been following some really different concepts, because you understood the extension's purpose differently, so I was curious to see what else one might want to do with it.


No, it was just that when I originally proposed an extension, it was with the thought that you would select one path, enter a duration, and a block of CSS would be added. Multiple paths selected: multiple identical blocks of CSS added. If you wanted paths animated sequentially, you would set each one up individually, providing a delay for subsequent ones.

In that manner, there's no need for the user to name the animations. If they operated the extension on the same path more than once, the new setting would replace the old ones (hence my suggestion to use multiple style blocks, as it makes this a lot easier).

The difference is one of workflow. In my approach:

* Multiple lines selected - they're animated with the same settings.
* Multiple visits to the dialog to set sequential animations.

In your approach:

* Multiple lines selected to set sequential animations
* Multiple visits to the dialog to animate multiple paths with the same settings.


So it's not so much that I understood the extension's purpose differently, but rather the manner in which a user might work with it. Having text "write itself" is cool, and an easy one for users to understand. But I've most usefully seen this animation method used with complex drawings with lots of paths that all animation at once to quickly create the image. Something like your Inkscape logo or TD's celtic cross. So I was coming at it from the perspective of animating multiple lines simultaneously (per the OP's request), rather than making it easier to sequentially animate multiple lines.
Co-creator of The Greys and Monsters, Inked - Inkscape drawn webcomics
Web SiteFacebookTwitter

Moini
Posts: 2913
Joined: Mon Oct 05, 2015 10:44 am

Re: Let lines simultaneously been drawn

Postby Moini » Tue Jun 26, 2018 12:00 am

@Xav can you link to an example for that 'most usefully' used method? It's not impossible that the extension could do both - sequential AND parallel animation, as the user chooses.
Something doesn't work? - Keeping an eye on the status bar can save you a lot of time!

Inkscape FAQ - Learning Resources - Website with tutorials (German and English)

tylerdurden
Posts: 2174
Joined: Sun Apr 14, 2013 12:04 pm
Location: Michigan, USA

Re: Let lines simultaneously been drawn

Postby tylerdurden » Tue Jun 26, 2018 12:12 am

I'm thinkin sequential is more common: whiteboard animation is quite popular, and it seems the OP was looking for something VideoScribe might not do (i.e.- something not common).

As an end-user, I would welcome the option to switch between approaches... it's just more programming, and that happens by magic, right? :?
Have a nice day.

I'm using Inkscape 0.92.2 (5c3e80d, 2017-08-06), 64 bit win8.1

The Inkscape manual has lots of helpful info! http://tavmjong.free.fr/INKSCAPE/MANUAL/html/

User avatar
Xav
Posts: 1139
Joined: Fri May 08, 2009 1:18 am
Location: UK
Contact:

Re: Let lines simultaneously been drawn

Postby Xav » Tue Jun 26, 2018 1:28 am

Moini wrote:@Xav can you link to an example for that 'most usefully' used method? It's not impossible that the extension could do both - sequential AND parallel animation, as the user chooses.


This page (linked from the CSS Tricks article) is the sort of thing I was thinking of:

https://tympanus.net/Development/SVGDra ... index.html

But I've seen other sites do the same thing (I didn't keep track of the URLs at the time, so can't provide references). There was one that was used for a couple's wedding site, where an outline of the happy couple was drawn over the space of a few seconds. And another where an isometric view of a computer was drawn (I don't think it was the page I linked above, as I seem to remember it was a PC and monitor, not a Mac, and that it remained with the outline image at the end).

Of course "most useful" is entirely subjective, and I'm coming at this from a web developer perspective. I don't see much benefit in being able to "write" text beyond a few short words - anything much longer probably benefits from a normal font anyway, at least in terms of readability. So to my mind the "most useful" examples are those that use it as a fancier alternative to just fading an image in.

I could easily see web developers wanting to "draw" their company logo, or an image of their product on their website, rather than just fading it in or having it immediately appear. If over-used it's also the sort of thing that could turn into the new <blink> or <marquee> tag (i.e. a fancy effect that quickly annoys the hell out of users) - but for the time being it's still niche enough to be cool ;)


Outside of web sites I'm sure I've seen a similar technique used in TV: the architect's plans or blueprints that are "drawn" over the space of a few seconds on a home improvement show, or the line drawing of a scene that then fades into video footage. I'm not suggesting your extension would be used for those specific cases, just that there are probably other examples of "draw several lines simultaneously" that fall outside the normal scope of SVG or websites.
Co-creator of The Greys and Monsters, Inked - Inkscape drawn webcomics
Web SiteFacebookTwitter

Moini
Posts: 2913
Joined: Mon Oct 05, 2015 10:44 am

Re: Let lines simultaneously been drawn

Postby Moini » Thu Jun 28, 2018 8:11 am

Thanks for the explanation, Xav. I see now where you're coming from :) This sounds like a useful addition to the extension. As I currently cannot work on this, but would very much like the extension to be able to do that, I've opened an issue on gitlab for it: https://gitlab.com/Moini/ink_line_animator/issues/6
Something doesn't work? - Keeping an eye on the status bar can save you a lot of time!

Inkscape FAQ - Learning Resources - Website with tutorials (German and English)

tylerdurden
Posts: 2174
Joined: Sun Apr 14, 2013 12:04 pm
Location: Michigan, USA

Re: Let lines simultaneously been drawn

Postby tylerdurden » Fri Jun 29, 2018 12:55 am

What we have so far is pretty great. Thanks for putting this together!

SVG Image
Have a nice day.

I'm using Inkscape 0.92.2 (5c3e80d, 2017-08-06), 64 bit win8.1

The Inkscape manual has lots of helpful info! http://tavmjong.free.fr/INKSCAPE/MANUAL/html/

User avatar
Xav
Posts: 1139
Joined: Fri May 08, 2009 1:18 am
Location: UK
Contact:

Re: Let lines simultaneously been drawn

Postby Xav » Fri Jun 29, 2018 1:12 am

For a way more complex investigation of a similar effect to TDs previous post (warning, seriously technical stuff!):

https://css-tricks.com/animate-calligraphy-with-svg/
Co-creator of The Greys and Monsters, Inked - Inkscape drawn webcomics
Web SiteFacebookTwitter

Moini
Posts: 2913
Joined: Mon Oct 05, 2015 10:44 am

Re: Let lines simultaneously been drawn

Postby Moini » Fri Jun 29, 2018 10:57 am

Cool techniques :)

I've tried both here (with clones, as it seems the animation is being lost when an object is moved into the defs section):
https://framadrive.org/s/MjF5rNLJ8xn94CK
Something doesn't work? - Keeping an eye on the status bar can save you a lot of time!

Inkscape FAQ - Learning Resources - Website with tutorials (German and English)


Return to “Help with using Inkscape”

Who is online

Users browsing this forum: No registered users and 6 guests