3D/VR learning experience
Hazardous environment 3D/VR training for industrial engineers
At a glance
We crafted an immersive 3D/VR project that transforms online training for oil refinery employees. This cutting-edge virtual environment allows users to navigate a multi-floor 3D space, interact with training content through hotspots, and master complex machinery systems—all without setting foot in the refinery.
Visit our website
Drop us a few lines at hello@fullclarity.co.uk
See the whole case below 👇
Type:
Services:
UX Research
Business Analysis
UX/UI Design
Learning Design
Development
Sector:
eLearning, Virtual Reality
Technologies:
Svelte (JavaScript Framework)
The challenge
Oil refinery environments pose significant risks such as exposure to toxic chemicals, hazardous machinery, and heights. Traditional training methods, like textbooks and PowerPoints, fail to engage millennial recruits who prefer dynamic, interactive content. Our mission was to create a zero-risk, immersive experience that prepares new hires to navigate the facility, understand the production process, and recognise key equipment.
Our goal was to break down complex training into digestible modules, ensuring recruits build foundational knowledge step-by-step without feeling overwhelmed.
Key solutions
3D Environment orientation
Interactive hotspots & locations: Clickable location circles with pulsing blue lines guide users through the space. Hotspots reveal equipment details and training content via modals.
Visual equipment search: A sticky toolbar with floor navigation and location previews helps users find and familiarise themselves with equipment.
Multi-level interactive floorplans: Custom illustrated maps and interactive hotspots for detailed navigation and equipment identification.
Live radar orientation: A radar UI shows users’ positions and orientations within the facility.
Learning about complex equipment
Multi-sensory learning: Hotspot interactions open modals with bite-sized content, including text, videos, images, and 3D animated diagrams, explaining the internal workings and related systems of the equipment.
Replicating in-person guided training
Guided learning tour: Audio tours lead users through the facility, explaining equipment and systems, enhancing orientation and understanding.
Web and VR delivery
Virtual reality mode: Full-screen and VR modes enrich the interactive learning experience, making navigation and equipment understanding seamless.
Technology stack
We leveraged the latest technologies for this project, including Three.js and the Svelte framework, along with WebGL, DeviceMotionAPI, and WebXR, to create a fully immersive VR experience compatible with both mobile and desktop devices.
Project highlights:
57 Explorable Locations
6 Audio Tours
Need help with a 3D/VR training experience?
We thrive on technical challenges. Get in touch to see how we can elevate your training solutions.