JavaScript
2 TopicsCybersecurity Meets Creativity
For this submission I took a different approach. Instead of building a traditional demo or scenario-based quiz, I focused on the first few seconds of the learning experience, because in cybersecurity every second counts. Setting the Scene with Sound and Motion To immediately capture the learner’s attention, I created a high-energy introductory slide using kinetic typography and a stomp-style soundtrack. The idea was to create an immersive, rhythmic start that echoes the urgency and tension of the cybersecurity landscape. This isn’t just a flashy animation, it’s a carefully timed message. With bold movement and percussive beats, the slide communicates the importance of staying alert and protecting personal information in a digital world filled with threats. Powered by Articulate’s New JavaScript API To bring this to life, I used Articulate’s latest JavaScript API. This gave me more control over the timing and sequencing of the animated text, allowing it to sync precisely with the beats of the music. Each key term, like defend, detect and protect, gets visual emphasis to reinforce key cybersecurity concepts and actions. Why This Approach? Cybersecurity training can sometimes feel dry or overly technical. My goal was to disrupt that expectation with something bold and modern. By combining motion graphics with a high-intensity audio track, I aimed to spark curiosity and set a tone of urgency that pulls learners into the content. Absolutely — here’s the revised **Final Thoughts** section with your point expanded. It emphasizes the contrast with traditional e-learning intros and reinforces the value of your creative approach: Final Thoughts This submission is just a single-slide experience, but it’s designed to make an impact right from the beginning. In many e-learning courses, the first slide is often a static title screen, maybe a logo, a headline, and a stock image. While that’s functional, it often misses a valuable opportunity to emotionally engage the learner and signal the importance of the topic. With this project, I wanted to challenge that norm. By opening with kinetic text, rhythmic motion and intense stomp music, I created a visceral first impression that communicates urgency and relevance, especially important when the subject is something as critical (and often underestimated) as cybersecurity. This kind of introduction does more than just look cool. It tells the learner: Pay attention, this matters. And in a world where digital threats are constantly evolving, capturing attention from the very first moment is a key part of building awareness. Because in cybersecurity, awareness begins with attention and great learning starts with engagement. Want to Try It Yourself? You can preview the interaction here to see it in action. If you'd like to explore how it was built, I’ve also made the full project available as a free download. Feel free to dive in, tweak it, and make it your own! About me: Paul Alders LinkedIn Profile The eLearning BreweryWho sent it?
Hello! This demo shares a simple but overlooked tip on how to verify whether an email is legitimate. I've used Javascript in a couple of places. Firstly, some custom script adjusts the X position of the email background relative to the value of the invisible slider in the foreground. Then, Chris Hodgson's code from last week's challenge stops the whole slide from shifting when you drag the slider with your finger on a mobile device. Finally, a third piece of This gives the effect of moving the email to one side and 'peeking behind the curtain' to see who actually sent it! Looking for an award-winning learning manager, who can rapidly prototype and visualise his ideas to lead and inspire creatives? If so, I am currently hashtag#OpenToWork. Send me an email! Hopefully not a dodgy one.