Showcase: 3D Molecular Visualiser/Manipulator
Hi everyone! I wanted to share a project I’ve been working on a 3D molecular visualiser for 4-bromo-3-nitroacetophenone for a Level 6 HE Applied Chem course, and it’s been a bit of a journey in balancing high-end aesthetics with rock-solid performance. The "Why" Behind the Build We’ve all been there: you embed a cool 3D element, and it either looks tiny on the screen or feels like you're steering a tank when you try to rotate it. For this asset (S0501b), I wanted to see if I could create a digital laboratory experience that felt "snappy" and scientifically grounded, even when tucked inside an iFrame. The Technical "Secret Sauce" I spent quite a bit of time under the hood on this one, and here are the bits I’m most excited about: Scientific Grounding: No manual models here! The engine pulls raw SDF coordinates directly from PubChem (CID 87737), so every atom and bond is exactly where it should be. Fixing the "Input Lag": If you’ve ever used WebGL, you know the keyboard can sometimes feel laggy. I built a custom Input State Filter (a little JS buffer) that syncs movement to the browser’s refresh rate. It completely killed the "overshoot" and made keyboard navigation feel instant. The "Cyber-Flora" Look: I moved away from the standard black background for a softer, pastellised #691eda (Purple) theme. It’s easier on the eyes and makes the Jmol colour-coded atoms really pop. Features at a Glance Adaptive Scaling: No more "tiny molecule" syndrome. The engine forces a zoom and a strict 700px height to keep the UI stable. Accessibility First: It’s fully navigable via mouse, touch, or keyboard (tuned with a high rotStep for precision). Performance Tweak: I used Level of Detail (LOD) geometry to make sure it runs at a smooth 60fps, even on older hardware. I'd Love Your Feedback! I’m really looking to see how this holds up across different environments. If you have a moment, I’d love for you to review and evaluate the interaction. Does the rotation feel smooth on your setup? How does the scale look in your specific VLE? Please feel free to reach out if you’re working on something similar or want to chat about the code logic behind the input filtering. I’m more than happy to share what I’ve learned! Review360Practice: Visualizing Policy with Rise360
Hi there, I'm Leslie! I built this microlearning module in Rise360 because I wanted to practice creating a short, visual story with interactive elements from a text-only public policy source. 7 Ways the SAVE Act Would Block Voting Rights Government and think tank materials are text-heavy and focus on the process to create the policy or proposal, rather than who the policy impacts and what they either have the opportunity to do, or are now responsible for. I wanted to select a topic and source material that I didn't know anything about to keep my decision making to a minimum. I think visual storytelling would help people process policies and decide faster if they want to complete the call-to-action. I used Flaticons for the icon/ vectors. I created two different source attribution pages at the end of the module - one for the source material and one for the icon/ vectors used I'm unsure how to create a .story file for download. But happy to share anything I can. Thank you in advance for your feedback and comments on the design, flow, etc. While I believe in this topic and the research behind it, I realize it is political, so I hope I haven't violated and posting rules. Best, LeslieClaude 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.Up-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. NOW WITH MORE EXAMPLES of what reveal styles can imagine! 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. Review360Storyline Instant ToolTip
Hi everyone! I'm sharing a script to add tooltips in Storyline. Just one reference object, a quick copy-paste, and it's ready. You could use a native rollover state, but this gives you full control over the animation. Position, colors, shadow: all configurable in 10 seconds. No JavaScript skills needed, the script is designed to be easy to use and maintain.Workplace Violence and Harassment – Game-Based Scenario
One of our recent projects involved developed a game-based, scenario-driven Custom eLearning Solution focused on Workplace Violence and Harassment Training. As part of our broader corporate training solutions and digital learning services, the goal was to move beyond traditional click-through compliance courses and create a learning experience where employees actively practice real-world decision-making. What we built: A scenario-driven course with 1–4 progressive levels Each level presents realistic workplace situations that require learner judgment Learners complete a knowledge check or quiz at the end of each level Successful completion unlocks a badge, reinforcing motivation and progression Why this project matters: Rather than relying on a traditional, click-through compliance approach, we designed this eLearning course to help learners practice real-world decision-making in a safe environment, supporting better recognition, prevention and response to workplace violence and harassment. Behind the scenes: Branching scenarios were designed to encourage reflection, not just right-or-wrong answers Feedback carefully crafted to explain why a response is appropriate Game mechanics were applied thoughtfully to maintain the seriousness of the topic What this project reinforced for us: When designed with intent, gamification can enhance engagement and retention, even for sensitive compliance topics. Tools used: Articulate Storyline 360 for course development Vyond for video creation Learning outcome: Participants will be able to identify, prevent and appropriately respond to workplace violence and harassment situations through practical, scenario-based decision-making. Explore the course: Click the link below to view the course. https://www.swiftelearningservices.com/our-portfolio/game-based-scenario-sample/story.html We welcome your feedback, questions and suggestions, especially around scenario design, feedback strategies and gamification for sensitive compliance topics.ADDIE SPRINT
This 5‑minute microlearning module explains the ADDIE model for building effective e‑learning. The course uses audio‑visual storytelling, and an interactive drag‑and‑drop activity to help learners quickly understand how Analyze, Design, Develop, Implement, and Evaluate work together in real‑world e‑learning projects. Built in Articulate Storyline 360, the module focuses on clarity, engagement, and practical application—perfect for beginners and busy professionals. Review Here: https://360.articulate.com/review/content/44d1a951-be35-45ec-bb0d-21a79c60964e/review
