Create a Progress Bar in Storyline 360 with Javascript & GSAP

Опубликовано: 18 Март 2024
на канале: Learnomancer
749
19

In this video tutorial, we will explore how to make a progress bar in Articulate Storyline 360.

Our progress bar will update when we move back and forward through our slides. And, no matter how many slides we have in our project, our progress bar will scale and display the progress accurately.

The progress bar uses Javascript (GSAP) to animate the shape and makes use of the built-in Storyline variables showing the slide number in the project (Project.SlideNumber) or the slide number in the scene (Scene.SlideNumber).

We will also be able to make individual progress bar for each of our scenes, which will display only how we progress through the slides of that certain scene.

___________
CHAPTERS:

00:00 Intro
00:50 Create the progress bar
12:14 Final result for project progress bar
13:35 Individual progress bars for scenes

___________

Code available here: https://learnomancer.com/posts/dynami...

#articulatestoryline #gsap #javascript #storyline #storyline360 #instructionaldesign #elearning #elearningdevelopment


Смотрите видео Create a Progress Bar in Storyline 360 with Javascript & GSAP онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь Learnomancer 18 Март 2024, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 749 раз и оно понравилось 19 людям.