All Versions Adding Animations to Your Stream

[Jaxel]

Jaxel submitted a new resource:

Adding Animations to Your Stream - CSS3 and JS animation tutorial

Adding animations to your stream is actually very easy. The problem however is that animations are resource intensive; so unless you have a strong computer, your animations may stutter or appear sluggish. I have created several videos which show off animations.

The first demo starts at 5:55 in this video:

What I show in this video is how to do a very simple image slide-in. In the video, I show it using jQuery. Since then I have converted the animation to...

Read more about this resource...

 

[unseeingeye]

Looks great, will have a play around with it some time soon.

Appreciate the helpful tutorials as well.

 

[Angelo]

is there a way this could be used to make audio synced bars for when i am playing music?

 

[Jaxel]

is there a way this could be used to make audio synced bars for when i am playing music?

If you can do it in Javascript or CSS3 animations, you can do it with this.

 

[john5566]

Have a like. Hope you update this guide.

Also any idea how much space I would be saving if I switch from 1080 to 720? Ballpark estimate?

 

[ZekZpe]

Dont know why, but 2nd script dont work for me, banners are static (yes i have minified in folder), I have same pics and script, can some1 help?

 

[LyfeStyleGFX]

Jaxel submitted a new resource:

Adding Animations to Your Stream - CSS3 and JS animation tutorial



Read more about this resource...

I recently started adding AE social media animations to my stream, using CLR Browser. Here is an example video.This uses a special animation file and script. I am also working on other stream animations but this is the only one i have finished. Everything can be edited and changed. CPU usage is equal to that of a follow alert from Nightdev, which is pretty much nothing, lol.

 

[Jaxel]

I recently started adding AE social media animations to my stream, using CLR Browser. Here is an example video.This uses a special animation file and script. I am also working on other stream animations but this is the only one i have finished. Everything can be edited and changed. CPU usage is equal to that of a follow alert from Nightdev, which is pretty much nothing, lol.

That is awesome... would love to see your code.

 

[MuddyUnders]

I recently started adding AE social media animations to my stream, using CLR Browser. Here is an example video.This uses a special animation file and script. I am also working on other stream animations but this is the only one i have finished. Everything can be edited and changed. CPU usage is equal to that of a follow alert from Nightdev, which is pretty much nothing, lol.

I have seen this on a few different streams and would LOVE to add it to mine. Any chance you could provide more detail?

 

[Livastyle]

Jaxel, your animations are awesome.
I'm using the CLR Browser for animations (and other dynamic things) since i got into SaltyPlayground.

It's almost the easiest way to provide this!

 

[unseeingeye]

@LyfeStyleGFX , how are you encoding into webm using after effects?

What's the difference in file sizes compared to h264? Would using the latter via the same CLR Browser plugin also be less CPU intensive than the video plugin (which is what I've been using up till now)?

 

[Jaxel]

https://twitter.com/8wayrun/status/716697083391176704

 

[Jaxel]

This guide has been replaced with this:
https://obsproject.com/forum/resources/animating-streams-with-scoreboard-assistant.373/