Best practice/workflow for creating product configurator on web

Hi! The documentation has something about creating a 3d configurator via that startup template, but it doesn’t say anything at all about how to get something like that deployed to web. Say, for an example, that I want to create an interior architecture configurator in Unreal Engine 4 (5 by time), and want to have it accessible on web for customers to be able to change designs/objects/materials and see updated prices etc.

Say you have it all set up and working in an Unreal application, even with touch controls for mobile or whatever. But then, it needs to be put on web.

Is the solution here pixel streaming from a web based file, communicating with json to fetch the changed configuration, and using predefined camera positions - or do I need to have all this rendered out beforehand, and then make a html/javascript kind of solution changing still images? Latter sounds something like year 2000, so I hope not. :slight_smile:

Any hints for how this could be done? Ultimately I want to learn how to do it, and I have a decent knowledge of blueprinting as well as javascript.

I have found some material, like this: PureGuide to interactive 3D streaming - PureWeb.
And How to design and deploy a 3D configurator that will wow customers

Are these techniques the best for the future - and hence state of the art?
As a foundation, I would really love seeing a more detailed punctual list of the workflow on specifically a 3d product configurator.

Thanks!

Normally you would want to do that by building for HTML5/WebGL, however that support has been dropped from the engine in recent versions so your only alternative is to do Pixel Streaming, which means that you would have to host the app running on a server somewhere and it would stream the rendered image to the user and send their interaction commands back to the server. This isn’t necessarily ideal because it will require a server with graphics rendering capability and the number users it can serve is very low, the user also has to have a constant and fast connection or they get a poor experience.

The issue with them dropping support for web is that ultimately the engine wasn’t designed for that in the first place so they were trying to take it and translate/dumb it down to work and it was a mess. Unity has a bit of a similar issue though they still offer support for it, but theirs has never supported mobile browsers properly (neither did Unreal when it had it).

That was not the answer I hoped for, but I did expect it might come. I watched the online Build-event yesterday, and there was a guy working for a web storage hosting who seemed to address this if I recall.

It would be pretty awesome having a html5 solution right out of the box.

The one other engine I know of is PlayCanvas which is entirely webGL based, but it’s extremely lacking in features compared to Unreal/Unity so it might not be capable of what you want to do.

Unity does it out of the box.

Godot can be made to.

I would suggest you just build a JS/html 5 canvas system yourself though.
Yea the rendering in 3d is hard to get right, it’ll take a bit. But it was possible years ago. It’s only gotten better now.

Start off something simple like this

Move onwards.

The example I recall from that time was a tank with sharks - Screensaver like.
A bit of stutters due to Mozilla’s memory constraints was the only thing really wrong with it.
Now aways, I don’t think that’s an issue anymore.