VR & WebGL Experience for Astaxanthin Education

Our Solution

We created a multi-platform educational experience combining immersive VR and a browser-based 3D showroom:

• Narrative-driven VR training with guided scenes, voiceovers, and intuitive interaction.

• WebGL-based online showroom for product browsing and post-session feedback collection.

• Built using Unity (VR) and Three.js (WebGL), optimized for performance and usability.

Experience Overview (VR & WebGL)

Scene 1: Origin of Astaxanthin

Setting: Scandinavian red lake surrounded by fjords

Purpose: Establish natural source of astaxanthin (red algae)

Features:

• High-detail fjord landscape

• Contextual storytelling via voiceover

• Minimal interactions to onboard new users

• Choice: Dive suit or underwater drone to proceed

Scene 2: Underwater Absorption Journey

Setting: Underwater fjord path with marine life

Purpose: Visualize natural absorption in the food chain

Features:

• Drone-guided path for narrative control

• Marine species (krill, trout, carp, salmon)

• Leads to an underwater cave → bloodstream transition

Scene 3: Biological Function in the Human Body

Setting: Inside bloodstream

Purpose: Explain how astaxanthin protects the body

Features:

• Visual metaphors for free radicals and defense

• Focus on joints, brain, vision, cardiovascular system, liver, muscles, skin

• Elevator-style transition to next scene

Scene 4: Product Showroom

Setting: Futuristic lab environment

Purpose: Present Vita Healthcare product line with astaxanthin

Features:

• Interactive product panels with detailed info

• Optimized for mobile VR performance

• Clean UI with low-motion design to reduce fatigue

Scene 5: WebGL Showroom + Feedback Form

Setting: Browser-based 3D showroom

Purpose: Remote access + feedback collection post-VR

Features:

• Clickable products with expandable descriptions

• Embedded questionnaire with logic routing

• Backend-ready for analytics

Technical Overview

VR Deployment:

WebGL Deployment:

Scope of Work

• Concept refinement & storyboard development

• 3D asset creation + optimization

• Scene scripting & transition logic

• Voiceover scripting + sound design

• Full-stack dev in Unity (VR) & Three.js (WebGL)

• Performance testing & usability QA

• UI/UX design for VR first-time users

• Feedback collection system

Why VR?

For Pharmaceutical Training (Astaxanthin):

• Emotional storytelling = stronger retention

• Smooth onboarding = lower tech barriers

• Immersive visuals = deeper understanding

• Blended format = better engagement & recall

For Scalable Learning:

• Higher engagement vs. slides/videos

• Repeatable training across teams/regions

• Personalized pace & interaction

• Post-session browser follow-up = extended impact

The Result

• Delivered a visually stunning, scientifically accurate, and emotionally resonant training tool.

• Enabled pharmacists to learn complex biochemistry in an intuitive, memorable way.

• Promoted Vita Healthcare’s product line through immersive storytelling.

• Positioned the client as a technological innovator in pharmaceutical education.

• Collected actionable feedback to continuously improve training programs.

Summary

This project shows how complex scientific knowledge can be transformed into an interactive and engaging experience—bridging the gap between learning, emotional connection, and sales enablement.