Messebau Franke - 3D Reference Hall

At a glance

• 16 exhibition stands as a walkable 3D hall in the browser
• 95+ project photos from 9 trade fair cities and 13 industries
• Control via mouse, touch, scroll and keyboard
• Automatic fallback to list view without WebGL
• References get explored instead of skimmed

Background

Ein Messebauer lebt von seinen realisierten Ständen. Bei Messebau Franke lagen Jahrzehnte an Projekten vor - Hirschvogel auf der IAA, Berner auf der Analytica, FlavoLogic auf der Anuga FoodTec. Online lag das alles in einer klassischen Referenzliste: Kachel, Bild, Text. Korrekt, aber austauschbar. Genau das, was jeder Wettbewerber auch hat.

The challenge

Wie zeigt man das Handwerk eines Messebauers so, dass es sich anfühlt wie eine Messe? Eine Bildergalerie erzeugt keine Räumlichkeit, und Standbau lebt genau davon: Raum, Größe, Licht, der Gang zwischen den Ständen. Dazu die harten Anforderungen: Es muss im Browser laufen, ohne Download, ohne Plugin, auf Handy und Desktop - und darf niemanden ausschließen, der kein WebGL hat oder Animationen nicht verträgt.

Our solution

Wir haben eine begehbare 3D-Messehalle direkt in die Website gebaut. Mit Three.js entsteht im Browser eine echte Halle: 16 Messestände links und rechts im Gang, jeder mit beleuchtetem Standbild, Standnummer, Kundenname, Messe und Branche. Der Besucher schaut sich per Maus oder Wischgeste um, geht per Scrollrad, Tastatur oder Buttons durch die Halle und klickt einen Stand an, um alle Projektbilder in einer Lightbox zu sehen. Über 95 Projektfotos sind so erlebbar statt nur gelistet. Wer kein WebGL hat, Animationen reduziert oder mit der Tastatur navigiert, bekommt automatisch die vollwertige Listenansicht - dieselben Inhalte, nur ohne 3D.

The outcome

Tech used

Related knowledge article