Overview
A fully interactive 3D event venue that lets users explore exhibition spaces from their browser. Built for large-scale events and expos, it renders the complete venue (exhibitor booths, conference rooms, food courts, restrooms, and entrances) in a navigable 3D environment. Users can search for specific exhibitors or facilities and get visual wayfinding directions. The experience is available in both an immersive 3D perspective view and a clean 2D floor plan, with seamless switching between the two. Supports full bilingual navigation in Arabic and English.
The Challenge
Rendering a large-scale 3D venue in the browser with dozens of exhibitor booths, color-coded by industry sector, while maintaining smooth 60fps navigation. The wayfinding system needed to calculate and display routes from any starting point to any destination, whether that's a specific booth, a conference room, or the nearest restroom. The experience also had to work on mobile devices with touch controls, provide a 2D alternative for users who prefer simpler navigation, and handle real-time search across all exhibitors and facilities. All of this had to load quickly and run smoothly without requiring any app installation.
The Solution
We built a Three.js-powered 3D venue with a custom waypoint-based navigation system. The venue is rendered with color-coded sectors (AI & Technology, Healthcare, Energy, Fintech, Smart Cities, and Creative Industries) so users can quickly identify areas of interest. Clicking any booth opens a detail card with exhibitor info and options to get directions or visit their website. The wayfinding engine calculates optimal routes and displays them as animated paths through the 3D space, showing distance and estimated walking time. A 2D map mode provides the same functionality in a top-down view with the same search and filtering capabilities. The entire experience supports Arabic and English with full RTL layout switching.
