This project demonstrates how storytelling and visual design create engaging learning experiences that drive exploration.
Project Overview
Technical Showcase | Tools: Articulate Storyline 360, Netlify
Some projects exist to solve a business problem. This one exists to answer a different kind of question: what becomes possible when you push a tool to its limits? When Articulate 360 introduced 360° panoramic functionality in Storyline, I didn't wait for a client project to explore it. I built one myself.
The Design Challenge
This project was a deliberate technical exploration and a self-initiated prototype designed to master Articulate Storyline's 360° immersive environment capability to demonstrate how that technology could be applied in real corporate learning contexts.
The subject matter, Bill Baggs Lighthouse and the natural landscape of Key Biscayne, Florida, was chosen intentionally. A visually rich, spatially interesting environment would push the interactive design further than a simple interior space and give the experience a genuine sense of place and discovery.
My Role
eLearning Developer | Instructional Designer | Visual Designer
I owned every aspect of this project independently across four days: one day of research, one day of image sourcing and curation, and two days of full build in Articulate Storyline 360.
The Approach
I started by researching Key Biscayne and the Bill Baggs Cape Florida State Park to identify meaningful points of interest that could anchor each hotspot interaction. Rather than scattering content arbitrarily across the 360° environment, I wanted each hotspot to feel purposeful so this project would feel like a guided discovery experience rather than a click-everything exercise.
I sourced a high-quality 360° panoramic image of the lighthouse through Pixexid, then designed the full interactive architecture in Articulate Storyline: hotspot placement, content scaffolding, progress tracking variables, engagement logic, and multimedia integration including an introductory video and ambient audio to build atmosphere from the moment the experience launches.
The Solution
The goal throughout was to build something that felt genuinely immersive, not just technically functional.
The finished prototype is a fully interactive 360° panoramic module hosted on Netlify, featuring interactive hotspots anchored to real locations and points of interest, progress tracking and engagement variables ensuring learners explore the full environment before completing, custom visual design and color scheme for aesthetic clarity and immersion, and introductory video and tropical audio creating an atmosphere that pulls learners in immediately.
The entire build was completed in four days from research to deployment.
Corporate Applications
This prototype was designed with direct transferability to corporate learning environments in mind. The same immersive architecture can be applied across a wide range of high-value use cases including:
Virtual site familiarization for new hires who need to navigate offices, manufacturing floors, warehouses, or remote locations before their first day
Safety and hazard identification training where learners explore a simulated environment and identify risks in context
Immersive onboarding that gives employees a sense of place and culture before they walk through the door
Gamified troubleshooting scenarios where learners navigate a space and solve problems in a realistic, consequence-driven environment
Compliance and scenario-based training embedded within a realistic environmental context
Remote site familiarization for distributed teams, field workers, or employees who will never physically visit a location
What I’d Do Differently
Looking at this project today through a learning architecture lens, I'd approach the design iteration more formally. Specifically I'd run usability testing with a small group of learners to identify friction points in the navigation and hotspot flow, and use that feedback to refine the experience before considering it production-ready.
I'd also explore branching pathways to create a fully gamified version where learner choices in the environment lead to different outcomes, turning a guided exploration into a decision-based scenario. Accessibility enhancements would also be a priority in any production version, ensuring the 360° experience is fully navigable for learners who use assistive technology.
The most exciting future direction though is applying this architecture to a real organizational context (ex: a safety training module where learners identify hazards in a simulated facility, or an onboarding experience where new hires explore their future workplace before day one). That's where immersive design stops being a technical demonstration and starts being a genuine business solution.
Sources: Pixexid, Florida State Parks, Lighthouse Friends, AllTrails