Grundriss in 3D mit WebGL nachbauen

Wenn man ein Gefühl für die Größenverhältnisse einer Wohnung bekommen möchte und nur einen Grundriss besitzt, der kann entweder zu Stift und Block greifen oder dreidimensional am Computer nachbauen. Ich zeige hier, wie das geht und wie man das 3D Modell anderen Leuten per Link interaktiv zur Verfügung stellen kann.

Kein Maya, kein 3D Studio Max, kein Blender

Während des Studiums habe ich mich eingängig mit Software zur 3D Modellierung und Rendern beschäftigt. Mein erster Impuls waren deswegen die teuren Tools von damals.

Leider habe ich weder die Lizenzen und anders als beim Fahrradfahren verlerne ich solche Skills wieder, wenn ich sie nicht regelmäßig nutze. Obwohl Blender kostenlos für Mac, Linux und Windows erhältlich ist, habe ich nach kurzer Zeit aufgehört und nach einer Alternative gesucht.

Sweet Home 3D

Gelandet bin ich dann bei einem kostenfreien Java-Programm namens Sweet Home 3D. Auf den ersten Blick sieht die Webseite genau so unaufgeräumt wie das Tool selber aus.

Trotzdem macht es genau das, was ich wollte: Es erstellt aus einem Grundriss als Bilddatei und der Angabe, wie lang eine Mauer in Metern ist, ein maßstabsgetreues 3D Modell der Mauern.

Einrichten mit IKEA Möbeln

Manche Leute geben viel Geld für Möbel aus. Ich gehöre nicht dazu. Mein Wohnzimmertisch war jahrelang ein IKEA LACK Tisch für 10 EUR. Das auch auch den Vorteil, dass man die 3D Modelle für die Einrichtung und Originalgröße frei im Internet findet.

Die Modelle sollten im Wavefront OBJ-Format vorliegen. Einfach IKEA, den Namen des Möbelstücks und OBJ in Google eingeben und runterladen. Achtung: Manche Modelle sind sehr (!) detailliert. Wenn ein Schrank 16 MB als 3D Modell wiegt, dann sollte man lieber die Version mit 500 KB nehmen. Immer auf „low poly count“ achten.

Nun kann man die Objekte in Sweet Home 3D importieren und an die entsprechende Stelle rücken und unter 3D View dann Export to .OBJ wählen.

Keine Unreal Engine, keine CryEngine und kein gerenderter Film

Die meisten Gaming-Engines sind heute erstmal kostenlos. Die Unreal Engine kannte ich noch aus meiner Jugend als ich noch Level für Videospiele gebaut habe.  Aber auch hier musste ich nach kurzer Zeit zugeben, dass ich nicht schnell genug vorwärts kam. Die Editoren sind doch heute komplexer geworden als ich es von der Unreal und Build 3D Engine kannte.

Dazu kommt das Problem: Was macht man nachher mit dem fertigen Projekt? Für Mac, Windows und iOS kompilieren?

I have seen the future: WebGL

Ich hätte es nie anzweifeln dürfen: The Future is in your Browser™.  Es gibt eine Game Engine bei der sogar der Editor im Browser läuft: PlayCanvas.com. Das ist kostenlos solange man die Projekte öffentlich lassen will.

Dort habe ich ein Demo-Projekt aufgemacht und das .OBJ (16 MB) 3D Modell aus Sweet Home 3D importiert. Das ging schneller als in der Unreal Engine und war sogar out-of-the-box halbwegs gut beleuchtet.

Nun kann man einfach einen Build als Link generieren und durch die Gegend schicken: https://playcanv.as/p/kQGf1uEa/ Und natürlich läuft das dank offenen Webstandards auch im Safari Browser auf einem iPhone 7 absolut flüssig.

Das Endergebnis läuft im Browser auf dem iPhone 7

2 Antworten auf „Grundriss in 3D mit WebGL nachbauen“

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.