Updated "Reveal" codes
I’ve been experimenting with the original HTML code blocks included in Articulate 360’s built-in examples and wanted to share how far you can extend that base structure using GenAI to iterate and refine interactions. Starting with the default image-reveal index provided by Articulate, I used GenAI to progressively develop three new versions. I supplied my own images, created meaningful alternative text for screen readers, and introduced additional UX and accessibility improvements. Every version is fully tailorable if you want to adapt the formatting, colours, spacing or behaviour. The three examples are: Enhanced Image Reveal Grid Uses the original Articulate structure. Adds a hover zoom, a click-to-zoom state, and high-contrast purple letter tiles for accessibility. Fanned “Deck of Cards” Flip Interaction A dynamic fanned layout, more like a real card hand. Cards lift and reveal their letter on hover, flip on click, and reset if clicked again. Includes chevron navigation for easier cycling. Plain Flip Grid with Navigation A clean, accessible flip-card grid with navigation chevrons. Mirrors the deck behaviour but with a simplified layout. All three examples are linked below, along with the downloadable files. If you have suggestions, improvements or alternative approaches, I’d really love the feedback. And if you’d like to use or remix any part of this, feel free — I’d love to see what you create with it. Review360 Zip files GDrive location: HERECooking Game (Jeopardy style + Gamifiation)
Hello Articulate Heroes! I'm excited to share my second personal project with you — a cooking-themed, Jeopardy-style game! Cooking Frienzy This project was inspired by two fantastic webinar series shared here: How to Create A Jeopardy! Style Game Gamification series I started with the "Jeopardy!" template and added the following custom features: Cooking-themed questions and answers — 5 questions across 5 categories Custom visuals — including characters, backgrounds, UI, and tokens The ability to choose one of three characters at the start of the game (and replay with a different chef assistant!) Personalized feedback and questions — with character-specific images and voiceovers A 20-second Pomodoro-style timer with a “wiped” animation Tokens awarded when the user completes a certain number of questions The characters were created using AI. Thank you for taking the time to check out the game! I’d love to hear your thoughts — feel free to share any comments or suggestions! You can check-out the game by this link: Cooking FrienzyClaude Shannon Explainer – Interactive Overview of the Father of Information
Hi everyone, This interactive module offers a short introduction to Claude Shannon’s key ideas and how they shaped modern computing and communication. The module is part of my portfolio and was designed to demonstrate accessible design, custom illustration, and learner-driven interaction in Storyline. I’d appreciate your feedback on: Navigation and overall flow Accessibility (especially for screen readers) Visual design and pacing Any suggestions for improving engagement or polish Here’s the link: Claude Shannon Explainer Thanks for taking the time to have a look. I’m new to the community and would welcome any thoughts or suggestions.Assemble the Machine: Building with Merge Shapes in Storyline
This project was my response to an eLearning Weekly Challenge focused on using the new Merge Shapes feature in Articulate Storyline. What started as a quick creative experiment turned into a surprisingly satisfying puzzle-building experience! The Build: Creating the Machine I began by designing the main machine using Storyline’s Merge Shapes functions, combining, subtracting, and intersecting shapes to form unique components. The process felt a bit like digital metalwork, piece by piece forming into something that actually looked mechanical! Some shapes were built entirely with merge functions, while others were enhanced using Storyline icons to save time, a little creative shortcut that kept the project moving while maintaining consistency in style. From Design to Functionality Once the main machine was built, I duplicated the slide to use as a reference layout. This duplicate became my “blueprint”, essential when I began disassembling the machine to turn it into an interactive drag-and-drop activity. Each part was separated, turned into a draggable object, and then matched to its original position using drop states. Having that duplicate slide open side-by-side made it much easier to ensure perfect alignment and placement, and saved a lot of trial and error. The Final Interaction Learners are invited to assemble the machine by dragging each piece into its correct position. Once everything’s aligned, the machine powers up, a small visual and audio payoff for the effort! You can check out the full example in the Storyline file I’ve uploaded with this article. Lessons Learned Merge Shapes is an underrated powerhouse — perfect for creating custom illustrations directly inside Storyline. Always duplicate your “complete” layout before disassembling — it’s the best visual guide when rebuilding drag-and-drop interactions. Blending icons and shapes keeps things efficient without sacrificing creativity. Shout-Outs A big thanks to the Articulate Community — your shared examples and feedback are such an incredible source of learning and inspiration. And of course, gratitude to the eLearning Weekly Challenges team for sparking these creative build experiments in the first place! Disclaimer: The voiceover in the example was AI-generated, and I used ChatGPT for story brainstorming and script development support. Blog Post: https://niamha.wordpress.com/2025/09/04/assemble-the-machine/ Check it out in Articulate Review here: https://360.articulate.com/review/content/8902c41c-3cc3-40cb-808f-2f572a34f0b0/review About Me: https://niamha.wordpress.com/about/🧙♀️✨ Magical Coffee-Bar: Fan-Inspired Drink Simulator
The project were created for Articulate Challenge #524 – How to Brew the Best Coffee & Espresso Drinks Welcome to Crossroads Cafe, a whimsical drag-and-drop interaction where learners take on the role of a barista serving enchanted drinks to guests from across fictional universes. ☕ Project Concept In this interactive experience, players are left in charge of a magical coffee shop after the senior barista is called away on urgent business. One by one, guests arrive — each inspired by beloved characters from books, shows, and movies — and place their orders for fan-favorite drinks like Butterbeer, Blue Milk, and Miruvor. 🎮 Gameplay Drag & Drop Mechanics: Learners select ingredients and place them into a mug in the correct order. Hints Available: A recipe card is available for reference if the learner needs help. Serve & Feedback: Once the drink is assembled, the learner presses “Serve” and receives themed feedback from the guest — magical praise or playful critique. Progress Tracking: The game tracks how many drinks were made correctly, with a final summary and stylized feedback. 🎨 Design Style Classic 2D animation inspired by mid-20th century cartoons Watercolor textures with bold outlines Magical UI elements and whimsical decor Custom illustrations for guests and environment 🧙♂️ Senior Barista’s Message “Ah, welcome, apprentice! The guests are lining up, and the steam is rising — it’s time to brew some magic. Drag the correct ingredients into the mug, press ‘Serve’ when ready, and consult the recipe card if you need a hint. Every cup carries a little enchantment — brew wisely!” ⚠️ Disclaimer All visual assets in this project were created using AI tools and custom design. Guest characters are original creations inspired by popular fictional archetypes and do not directly represent or reproduce any copyrighted characters. This project is intended for educational and creative demonstration purposes only. Crossroads CafeVictorian Alphabet game
A Most Curious Diversion: The Victorian Alphabet Dial Dearest Gentlefolk, Though I am tardy in submitting this humble creation, I felt compelled to share my vision nonetheless. Ever enchanted by the elegance and refinement of the Victorian aesthetic, I have embarked upon a whimsical endeavour: an interactive alphabet dial. With a gentle spin, the player shall unveil a letter accompanied by a charming illustration and a verse, each rendered in the ornate style of the age. It is my sincere hope that this modest project shall delight and amuse, and perhaps even transport you—if only for a moment—into a bygone era of beauty and imagination. * This project has also been submitted to the #522 Weekly Challenge (Dial Menus), where I hope it may find favour among fellow enthusiasts. ** The images and verses were brought forth with the assistance of artificial intelligence, yet each has been lovingly tailored and refined to suit the spirit and aesthetic of this particular work. Enchanted AlphabetThree Little Pigs game quiz
Hi Articulate Heroes! My name is Ekaterina, and I’m excited to share my very first post here! I’ve created a quiz game inspired by the classic fairytale “The Three Little Pigs.” I aimed to make it fun and engaging, with playful visuals and plenty of interactive moments for the player. I’d love to hear what you think—any feedback or suggestions are very welcome! Three Little Pigs Game QuizFlip animation using GSAP in Articulate Storyline to have smooth flip animation.
We recently faced a challenge with the built-in swirl animation in Storyline (SL). Our client found it cluttered and pointed out that the animation flipped twice, which logically should result in showing the same side again. We agreed with this feedback and decided to explore alternative solutions. After some research and experimentation, we discovered that using GSAP (GreenSock Animation Platform) provided a much cleaner and more logical flip animation. GSAP allowed us to create a smooth and visually appealing flip effect that only flips once, addressing the client's concerns effectively. By integrating GSAP with Storyline, we were able to enhance the overall user experience and meet the client's expectations. This solution not only resolved the issue but also opened up new possibilities for creating more sophisticated animations in our e-learning projects. Hope it will be helpful..
