Live data from Hacker News

Show HN: Create animations by dragging an element with your mouse

animatize.com

51–59 of 59 posts

Re: Show HN: Create animations by dragging an element with your mouse

#51

Earlier quoted context omitted.

This sounds like a great real-time teaching style. Can you point us to the videos you're talking about?

This meme[1] is pretty famous but doesn't hide the cursor or anything. There are a few others like it, I've never seen an educational video done like that though [1]: https://www.youtube.com/watch?v=J-fXTRHApRc

That was… hypnotic, no other word for it. Thanks for the discovery.

Re: Show HN: Create animations by dragging an element with your mouse

#52

Remindes me of the video Inventing on Principle by Bret Victor.

I dream of a day when my day-to-day tools feel more like the tools in that video. I have some hope VR will bring us closer.

I'm really excited about the user interface possibilities that AR/VR will bring.

It may literally create whole new industries.

Re: Show HN: Create animations by dragging an element with your mouse

#53

Very cool! Does anyone know if something like this exists for video? Like "motion tweening" but with my mouse in real time?

Hey, maybe it will be helpful if you need a video from website/saas. I'm working on an app, that can turn website into a motion video.

Example gif: https://ibb.co/w4h7FVD

Link: https://talevideo.com

Re: Show HN: Create animations by dragging an element with your mouse

#55

This is great! As someone who has dealt with After Effects (and Flash) this feels like a great stepping stone tool. Looking at the output code, it seems like you could have an edit mode that displays the Animation History as numbered "dots" on the background to let someone click and move or remove a dot. Then you start to expose things like time between dots, and soon enough you've taught the basics of tweeting. :-)

Did you mean tweening? I haven’t heard of tweeting used in the context of animation.

Ha! Yes, the forever battle with auto correct. Although I'm sure it could be made to auto-tweet :-P

Re: Show HN: Create animations by dragging an element with your mouse

#56
post #41

Earlier quoted context omitted.

This meme[1] is pretty famous but doesn't hide the cursor or anything. There are a few others like it, I've never seen an educational video done like that though [1]: https://www.youtube.com/watch?v=J-fXTRHApRc

How do they manage to move multiple “cutouts” independently at the same time, using the mouse? Especially when they’re overlapping. Green screen multiple recordings, and then merge them? Or is there a simpler explanation?

Yes since the background image is static you don't need a greenscreen. From watching just once, I think the guy never overlaps his clone(s). So you make two separate versions where their bounding boxes won't overlap (requires some planning) and then just show the left two-thirds of the bg image with guy 1, and the right one-third with guy 2, divided by a simple vertical cut.

And the overall zooming/panning is done after the merging. That's how I'd approach it.

Re: Show HN: Create animations by dragging an element with your mouse

#58
post #11

This is really cool. As others have said I'd love to see an option to output a GIF and additional animation options.

What animation options (other than GIF export) are you craving? I've heard pausing, deleting frames, and rotating so far. I'll probably work on the GIF export next, but I'm low on time this month since I'm trying to get 31 projects out the door [0]. [0] https://31launches.com

I want to change the speed. [Edit: Now I see that I can vary the speed in my initial drag.]

Have securtiy concerns putting this on my website. Can nasties be hidden in the code?

Post reply on HN