Forum Discussion
Storyline 360 Advanced JavaScript API
Back in March we released the Advanced JavaScript API for Storyline 360 🎉
What you may not know is that this project actually started as part an internal engineering "hackathon". Once a quarter our engineers have the option to spend a few days exploring ideas that excite them. Some of those projects never see the light of day, but every so often something promising emerges. The Advanced JavaScript API was one of those ideas.
The goal was to give authors more control and flexibility when they bump up against the edges of what is possible with Storyline’s built-in features. We wanted to create a path for deeper customization, more sophisticated interactivity, and experimentation.
Now that it has been out in the world for a few months, I would love to hear from you:
- Have you used the API to unlock something you could not build before?
- Have you experimented with “vibe coding” JavaScript for triggers using the API? If so, what tools or models helped you along the way?
- Where could the API itself improve, and how might we bring more of that “vibe coding” experience directly into Storyline?
For me, the most rewarding part of projects like this is seeing how creative the community can be with them. If you have tried the new JavaScript API, even if you only got partway to what you wanted, I would love to hear about your experience. Your stories and feedback help us figure out where to take things next!
2 Replies
While I don't use many features of the API, I have grown to appreciate using it to identify slide objects and for doing simple translations/transforms that don't break when the slide is resized. This is much simpler than before.
A couple of things I would like to see:
- Provide an explicit property in object() that references the DOM element associated with the data-model-id (unless I'm missing it). While it's straightforward to get the reference, it is a lot of extra typing to use that tag to identify each of the elements. And, sometimes you just need the DOM element.
- It would be handy for object() provide some standard properties/methods the could facilitate working with the SVG structures ubiquitous to most Storyline slide objects. In particular, something that would make it easier to add or manipulate SVG filters and masks, and possible simplify accessing/manipulating path data for shapes. Having entries in object() that separated background and foreground elements would be nice too. Deconstructing SVG DOM structures after the fact and inserting modifications can look quite nice, but can also be quite a hassle.
I realize number 2 is quite niche and a significant effort, but just throwing it out there in case a bored engineer needs a side hobby.
Thanks for the feedback, Nathan_Hilliard ! I wouldn't say any of our engineers are "bored", but they do like a good side quest 😉.
