Live data from Hacker News

Mo.js: motion graphics toolbelt for the web

github.com

41–50 of 64 posts

Re: Mo.js: motion graphics toolbelt for the web

#41
post #2

Awwwards participants have been creaming themselves since this has been released. Good to see how much progress it's made. It's certainly right there next to GSAP as a designer tool.

Can you talk a bit about how this compares to GSAP as a designer tool?

Re: Mo.js: motion graphics toolbelt for the web

#42
post #30
post #6

Earlier quoted context omitted.

Wow those embedded curve editors with copy and paste conversion into final code are a terrific idea. I've not seen that workflow before, but it is inspired!

Curve editors are heavily used by animators in most animation packages like Maya. The fact that it's supplied for a Javascript library like this shows the creators have really done their homework.

Yes, sorry, it wasn't the animation curves, but the workflow, of having them editable on the page, storing their data b/w reloads, and asking them for their own replacement code when done. That's very cool, and applicable to a lot of cases. In fact,makes me wonder if it isn't a better way of doing live coding generally: rather than inferring stuff, have a simple API for exposing inline editors.

Re: Mo.js: motion graphics toolbelt for the web

#43
post #28

Slightly off-topic, Chrome on my early-2015 MacBook (16GB RAM) lags significantly while rendering most of the demos listed in the repository. If things like this become the norm on the web, one can easily claim that such technologies are not inclusive to most users of the world-wide-web, who do not buy a new latest&greatest desktop computer every 2 years.

`mojs` definitely was created to support old and slow computers(it supports FireFox from version 4 and IE9).

The problems usually with the Chrome browser because it updates frequently and the Chromium team changes it a lot, so what was recently woking well might not work well right now. And problems like these are usually regard rendering performance and CSS transforms. So the issues you might see are related to the demos itself(not library) which were highly optimized for recent browsers' engines and those changed. I will revamp the demos shortly to keep them up to date.

Also, I often found that heavy animations work much better on mobile devices like iPhones than at my MacBook Pro mid 2012.

Re: Mo.js: motion graphics toolbelt for the web

#44
post #39

Another powerful animation library for the web with the same issue they all have: I can't give this to my graphic designers to use. Am I the only one who thinks we killed Flash and left a void which no one has filled yet it terms of animating with an intuitive UI?

You're remembering flash with rose tinted glasses I think. It is completely horrible. If what you want is an animation, render a mp4. If what you want is a responsive interface css3 and js animations more than fill the void.

Re: Mo.js: motion graphics toolbelt for the web

#45
post #8

Why in 2017, where we have 8 core processors and 1080 videocards and games that look like real life, even my 2016 high specs rMBP starts to blow fans full speed and lag whenever I try to run this basic animation in the browser, why these basic web animations require so much processing?? btw Great job with this project, I am going to use it for some ui elements in my projects, I especially love the twitter stars anima…

Must be something wrong with your computer / browser. With my 2011 iMac it is absolutely smooth, and there's no increase in CPU use. It's the same on iPhone 6, and it doesn't warm up at all.

Re: Mo.js: motion graphics toolbelt for the web

#47

Is "toolbelt" an actual term for a piece of software? Every single week I see another github project with a completely new term, similar to this one. If it's real what does it mean?

Open source software today is all about being fashionable: picking a fresh term helps you stand out in the crowd.

Re: Mo.js: motion graphics toolbelt for the web

#48
post #2

Awwwards participants have been creaming themselves since this has been released. Good to see how much progress it's made. It's certainly right there next to GSAP as a designer tool.

Can you talk a bit about how this compares to GSAP as a designer tool?

It's traditionally known that design firms like the ones in the Awwwards and dribble communities use GSAP to manually create motion design chains where CSS animations fall short. Sometimes the generation of these are even automated from Adobe tools.

Mo.js was released as a proof of concept a while back, but has matured into a similarly designed library with a much more precise focus on motion design. While GSAP didn't explicitly ever state it was for such a purpose, a significant number of designers use the library for exactly that in very large clients' animations.

Re: Mo.js: motion graphics toolbelt for the web

#49
post #9

This is a fantastic library but one warning based on past experiences is that you'll hit performance bottlenecks for full screen type animations on mobile browsers. I ended up re-writing some of my animations in plain old CSS3 transitions to utilize the GPU on Chrome for Android but this library made it so much easier for me to visualize on the desktop first.

Are you saying you're re-writing SVG animations into transitions? I thought SVG was more performant, but can't seem to find metrics and comparison benchmarks

Yes. I was animating an SVG path's scale from small to beyond full screen (zoom effect) and Chrome for Android struggled with frame rate. I just pulled that particular element out of the mo.js Tween handling since its movement was simple and put it into a CSS3 transition. Things went back to normal after that and I had a deadline to meet so I didn't really go back and dig into exactly why.

Re: Mo.js: motion graphics toolbelt for the web

#50
post #45
post #8

Why in 2017, where we have 8 core processors and 1080 videocards and games that look like real life, even my 2016 high specs rMBP starts to blow fans full speed and lag whenever I try to run this basic animation in the browser, why these basic web animations require so much processing?? btw Great job with this project, I am going to use it for some ui elements in my projects, I especially love the twitter stars anima…

Must be something wrong with your computer / browser. With my 2011 iMac it is absolutely smooth, and there's no increase in CPU use. It's the same on iPhone 6, and it doesn't warm up at all.

Have you tried running any examples from threejs? Is it smooth too?
Post reply on HN