I'm new to Storyline with a background in the Adobe Suite, specifically After Effects. I was wondering what sort of integration Storyline has with After Effects in terms of overlays on videos. Or if there are users out there who have used After Effects animation in Storyline and have any tips or best practices, that would be helpful as well.
I have done a few projects using After Effects and Storyline. Here is one example
In this example most of the animation was done in After Effects which I encoded as an MP4 video and inserted into Storyline. The text animation was done in Storyline and inserted on top of the video. I did it like this so that I would not have to redo the video if I decided to change the text.
You can overlay text, buttons, markers, videos, quiz questions, pictures, objects, etc on top of the After Effects video and use simple triggers, variables or JavaScript to start/stop or interact with the video.
Storyline does not support alpha channels so you can't overlay a video with a transparent background onto elements in Storyline.
Thank you so much for your response! The example you showed is remarkable and is exactly the type of thing I'm looking to do. Great to see what's possible with these tools, thanks!
Do you have any tutorials of this process? I love what you did with the sliced photos and your transitions. Great work!
Thank you so much for the link! What's the effect called where it splits the photo and sort of fans it up out from the image? I'll take a look through these, appreciate it
Each image is split into 4 separate pieces and are on separate layers in a composition. Each of these layers has a transform effect that changes the position and rotation of the image over time.
Great sample Nancy... challenges me to recreate something alike with Gsap in Storyline..thus being dynamic and changeable directly inside Storyline. Most animations and effects i see are quite doable directly in Storyline with GSAP.
One other option people could use to combine AfterEffects and Storyline are Lottie animations. As Lottie and Bodymovin work quite well and are JSON ( Javascript Object Notation ) it can be integrated perfectly into Storyline.
If you check my posts and profile you find a lot of tips and tricks. Not perse well documented process but enough helpfull stuff. Most important to get started is knowing your way around with Javascript and how to select elements in Storyline with JS. If you know that, the GSAP website has abundant tips and tricks too.
I know this is a very old post, but I was curious to see Nancy's example. For me, the link brings up the Mac scam where it tells you your computer has been locked for security purposes. Just an FYI.
I just wanted to pop in and share that since this discussion is a bit older, Nancy may no longer be subscribed. If you want to reach out to her directly, you can do so by clicking on her name and selecting the 'Contact Me' button.
17 Replies
I have done a few projects using After Effects and Storyline. Here is one example
In this example most of the animation was done in After Effects which I encoded as an MP4 video and inserted into Storyline. The text animation was done in Storyline and inserted on top of the video. I did it like this so that I would not have to redo the video if I decided to change the text.
You can overlay text, buttons, markers, videos, quiz questions, pictures, objects, etc on top of the After Effects video and use simple triggers, variables or JavaScript to start/stop or interact with the video.
Storyline does not support alpha channels so you can't overlay a video with a transparent background onto elements in Storyline.
Thank you so much for your response! The example you showed is remarkable and is exactly the type of thing I'm looking to do. Great to see what's possible with these tools, thanks!
Do you have any tutorials of this process? I love what you did with the sliced photos and your transitions. Great work!
I don't have any tutorials but Adobe has some good ones and you can find loads on YouTube
Here is the link to the Adobe tutorials: https://helpx.adobe.com/after-effects/tutorials.html
The way I learned was to download some After Effects templates and then dissected how they were created.
Thank you so much for the link! What's the effect called where it splits the photo and sort of fans it up out from the image? I'll take a look through these, appreciate it
Each image is split into 4 separate pieces and are on separate layers in a composition. Each of these layers has a transform effect that changes the position and rotation of the image over time.
Ah that makes a lot of sense! Thank you.
Beautiful Nancy - just about to head down the after effects route - very excited!
Nancy that was amazing! I'll be learning after effects for sure now. The layers you were mentioning before, are those similar to layers in photoshop?
Beautiful!
Great sample Nancy... challenges me to recreate something alike with Gsap in Storyline..thus being dynamic and changeable directly inside Storyline. Most animations and effects i see are quite doable directly in Storyline with GSAP.
One other option people could use to combine AfterEffects and Storyline are Lottie animations. As Lottie and Bodymovin work quite well and are JSON ( Javascript Object Notation ) it can be integrated perfectly into Storyline.
Nicely done!
is there a well documented process on how to apply GSAP animations to articulate elements?
If you check my posts and profile you find a lot of tips and tricks. Not perse well documented process but enough helpfull stuff. Most important to get started is knowing your way around with Javascript and how to select elements in Storyline with JS. If you know that, the GSAP website has abundant tips and tricks too.
Hi Nancy,
Are you still out there? I would love to see some of your work.
I know this is a very old post, but I was curious to see Nancy's example. For me, the link brings up the Mac scam where it tells you your computer has been locked for security purposes. Just an FYI.
If you want INTERACTIVE motion graphics in authoring tools like Storyline...use Rive
Hi Karen!
I just wanted to pop in and share that since this discussion is a bit older, Nancy may no longer be subscribed. If you want to reach out to her directly, you can do so by clicking on her name and selecting the 'Contact Me' button.