Copyable Storyline 360 builds that go past the built-in triggers: sliders, drag and drop, card systems and player tweaks. Each one has the full code and steps you can follow.
All Storyline Interaction Lab posts
Storyline Interaction Lab
Learn how to build a fully custom drag slider in Articulate Storyline using JavaScript, complete with snap points, GSAP animations, and dynamic floating tooltips. This Storyline JavaScript slider…
Oct 18, 2026 · 10 min read
Storyline Interaction Lab
Learn how to create a chat response simulator in Articulate Storyline or Rise 360 that lets learners practice real-world conversations. This step-by-step tutorial includes complete JavaScript code…
Jul 12, 2026 · 12 min read
Storyline Interaction Lab
Learn how to create a card shuffle stack in Articulate Storyline using JavaScript and GSAP. This tutorial covers dynamic position calculation, coordinated scale and glow animations, smart…
Apr 26, 2026 · 17 min read
Storyline Interaction Lab
Learn how to create click-to-expand cards in Articulate Storyline using JavaScript and GSAP. This tutorial covers element cloning, position tracking, animated transitions to target placeholders…
Apr 19, 2026 · 20 min read
Storyline Interaction Lab
Learn how to create expanding card overlays in Articulate Storyline using JavaScript and GSAP. This tutorial covers responsive typography, device detection, animated expand/collapse interactions…
Apr 11, 2026 · 18 min read
Storyline Interaction Lab
Learn how to create stunning 3D flip cards in Articulate Storyline using JavaScript and GSAP. This step-by-step tutorial covers setup, animation code, visited state tracking, and completion…
Apr 5, 2026 · 15 min read
Storyline Interaction Lab
Learn how to create a JavaScript matching activity in Articulate Storyline with visual connection lines, audio feedback, randomized definitions, and full keyboard accessibility. This step-by-step…
Mar 15, 2026 · 15 min read
Storyline Interaction Lab
Learn how to create timeline-synced text animations in Articulate Storyline using JavaScript. This step-by-step tutorial shows you how to make paragraph blocks float up on cue, respond to seek bar…
Mar 1, 2026 · 9 min read
Storyline Interaction Lab
When off-the-shelf Storyline widgets don't cut it, sometimes you have to build your own. This deep dive walks through creating a fully animated, scrubbable circular gauge using SVG, GSAP, and…
Feb 22, 2026 · 5 min read
Storyline Interaction Lab
Learn how to create a sequential reveal interaction in Articulate Storyline using custom JavaScript. This step-by-step tutorial covers smooth GSAP animations, professional hover effects, and…
Feb 15, 2026 · 12 min read
Storyline Interaction Lab
Learn how to create a JavaScript accordion in Articulate Storyline with this step-by-step tutorial. Build an engaging card-based navigation with smooth animations, hover effects, and automatic…
Feb 8, 2026 · 12 min read
Storyline Interaction Lab
Storyline's default navigation buttons are functional but boring. This JavaScript function rounds them into stylish ovals—or anything in between—with optional gradients, borders, and custom text…
Oct 1, 2024 · 12 min read
Storyline Interaction Lab
Storyline's default seekbar works—but it doesn't match anything else in your course. This JavaScript function lets you restyle it completely: custom colors, gradients, height, and even swap the knob…
Sep 24, 2024 · 5 min read
Storyline Interaction Lab
A grayed-out Next button tells learners they can't proceed—but not why. This JavaScript swaps the arrow for a lock icon when the button is disabled, then restores it automatically when enabled. A…
Sep 17, 2024 · 6 min read
Storyline Interaction Lab
Give your Next and Previous buttons some life with a color wipe that slides across on hover. This JavaScript adds a smooth directional fill effect—left, right, up, or down—with customizable colors…
Sep 6, 2024 · 5 min read
Storyline Interaction Lab
Recreate the iconic Matrix digital rain in your Storyline courses—cascading green characters in that signature font, falling at random speeds across the screen. The code dynamically loads the Matrix…
Aug 14, 2024 · 5 min read
Storyline Interaction Lab
Remember when custom player skins were everywhere in Flash? You can bring that back to Storyline with a simple JavaScript function that applies background images to the top bar, bottom bar, sidebar…
Jul 20, 2024 · 4 min read
Storyline Interaction Lab
Sometimes the Next button going from gray to active isn't enough to catch a learner's eye. This JavaScript adds a pulsing orange border and a bouncing arrow above the button—then clears…
Jul 18, 2024 · 4 min read