Best option for 3D on the web?

Hi,
If I want to make stuff in Blender which will be seen in a web browser, possibly interactively (say, a box, when clicked by the surfer, will emanate smoke…), what is the best option? Should I use Verge3D, one of the game engines like Armory3D, Godot (is BabylonJS an option?), or…X3D?
Thanks.

1 Like

If you haven’t already I would give basic game development a go to build a prototype, even if its just BGE. This will give you a better understanding of how real-time stuff is different to standard rendering and its limitations. Smoke for example will probably need to be an animated texture.

Verge3D is an option, but expensive.
Armory3D is also an option (and free). You’ll have to sort out WebGL configuration for optimal export.
Godot appears to be in its WebGL infancy, so wouldn’t consider it until things get more stable, but that’s just my opinion.
BabylonJS is not an option if you don’t know how to code.

All of these will require being able to start up a web server locally (1 line of python code in the console).
You’ll also need basic HTML knowledge.

Hope this helps :slight_smile:

1 Like

Unity3D has a webplayer that can be used for this. Ive seen archiv viz demos where you can walk around and open cupboards, change the carpet color and stuff.

Now, one of the very big issues that you will encounter, with web browsers is: "which web-browser?" And, which version?

It used to be that you would use the Adobe Flash® plug-in routinely, but Flash has lately fallen out of favor, giving way to something that is – oddly enough – almost the same thing: “HTML-5 plus WebAssembly.” However, not every web browser supports this. Some do not support it at all, and with others you find yourself right back in the latest manifestation of “Internet Explorer® hell,” where different development teams read the standards documents in different ways and did different, incompatible things.

The Armory3D engine is probably your safest current bet, because it uses the Haxe programming language, which really is “cross-platform.” It can “target” a web-browser, and (without changing the Haxe source-code) iOS and Android and a game console.


(In my professional opinion, "Haxe is a power-tool that you owe it to yourself to become very familiar with anyway." Its usefulness goes far beyond “computer graphics.” For instance, you’ll never write JavaScript “by hand” ever again. Get to know Haxe. You’ll be very glad you did.)

1 Like

Don’t forget Blend4Web, which is proven in production.

Export directly to the web, and simple visual scripting as well.

Blend4Web is obsolete, isn’t it? Like, they took it out of the codebase? It’s not going to be in 2.8?

1 Like

…no opinions on X3D and how it compares to the others??

Could you please explain what you mean by this statement?
I’m familiar with JS. But not Haxe - how will it render “by hand” coding unnecessary, and what will it replace it with?? (it’s not a “RAD” tool or whatever, is it?)
JS itself can also target multiple platforms, right? Why do I need to learn a whole other language for that??

You should also take a look at Sketchfab. (I work for them)

3 Likes

Also - what are the minimum hardware requirements to run Blender and Armory 3D with it?? (My PC is not too high-config :frowning: )

Will the resulting product, whether that’s web or mobile or whatever, adapt itself to the platform, ie. if the viewer HAPPENS to have a real high end Nvidia 2080 or whatever, the gfx. will look that much better?? Or, if it’s a low-end phone, the gfx. will be crappy, but (and this is a Big But), the game will still run??

Yep, Verge3D costs some money. But it has an unlimited trial version which can be used completely for free in non-production environments.

Also, when using Verge you don’t need to configure local server (it’s already included in Blender addon and started automatically). With regard to HTML no knowledge of it is required either. See this small tutorial on using Google Web Designer for creating web layout for Verge3D.

1 Like

“JS itself can also target multiple platforms, right? Why do I need to learn a whole other language for that??”

js itself can’t. but there is a lot of platforms, that use JS on different platforms - so with third-party help yes, it can.

But best of HAXE - it’s very forgiving and its still NOT js. It is very convenient language, that has best of all programming worlds. and it is the closest to write-once-run-everywhere i see. It’s really quite solid in features across all platforms. Besides that it has the easiest ways to bind with platform-dependend stuff. forget about crappy “plugin/addon” interfaces - if you need, you can always plug anything in any place you want. You have full control over every piece of result. Pure joy, comparing to waiting months for bug fixes from adobe (regarding air/flash extensions) or any other team behind “new js-powered-bla-bla-bla to run-the-world”

To elaborate on what IPv6 is saying:

JavaScript, first of all, is a “moving target.” ES6 is completely unlike its predecessors, not at all the same language but still (mostly for political purposes, I think) calling itself “JavaScript / ECMAscript,” much as the “Perl-6” language called itself “Perl” while bearing no actual relationship to it other than name. The complexity of the ES6 language is immense – to the point of baroque nonsense – and yet it’s still meant to be interpreted on the client-side system in source code form.

JavaScript, both old and new, relies upon massive libraries of third-party code – many megabytes now, even when compressed – to do anything at all. Yet the language itself allows many programming errors to be made while the language tries to “recover” from them. (It’s like PHP, only much worse.)

Haxe is what’s called a transpiler, or "source-code to source-code compiler." It’s an optimizing compiler with all of the goodies that you expect from a compiler, including dead-code elimination, but, depending on the “target,” it can either produce bytecode (e.g. for Flash), or source code in a different language. It can generate Java, JavaScript (old and new), C++, PHP, and so on … all from one Haxe source file which is what the programmers actually maintain.

Haxe has a rich library of contributed code, but it is written in Haxe and is incorporated into the compiler’s output – only what is actually needed. And you don’t have to use a bunch of separate tools to get there. You don’t have to load massive libraries to get it to work (only the target’s natural runtime environment). The generated output is self-contained.

Haxe is an expressive language with strong type-checking, and this eliminates many errors “at compile time.” (JavaScript, by comparison, doesn’t have a “compile time.” Neither does PHP.) If the Haxe source-code makes it through the compile process, the output source-code that it has produced is going to be correctly generated.

If you want to do “cross-platform development,” you can do it natively, without relying on “a horrible JavaScript wedge.” Mobile platform programming is not the same as web programming, and anyone who assures you otherwise is a liar. … :wink:

Therefore, you can write one program, deploy it to iOS and to Android “targets,” and in each case get a native application for that target. This is the “secret sauce” that, I predict, is going to make Armory3D explode onto the gaming scene, very very soon. “Unity & Co.” had better watch their backs – and I’m sure that they know this by now, even though they’re betting their present business-model that you don’t [yet].

So … “get to know Haxe, very very well.” As I said earlier, you’ll be glad you did. Whether you’re writing a game, or something else. I speak from first-hand experience.

Many programmers today really don’t know what “a compiler” is, because they’ve never used one. They write JavaScript by hand on the client side, and connect it to PHP or Perl programs on the host side, and all of their programming is directly executed in source-code form. (Furthermore, they are separate programs.) Errors are discovered by reading run-time logs, and they are literally discovered, the hard way. Haxe, on the other hand, will simultaneously generate the programming for both sides, and will treat them as “one [Haxe] program.” No matter how many different “targets” there are, there is only one “Haxe program.” And, if it makes it through the gantlet of the compile-step successfully, it’s gonna run.

2 Likes

Well, there is also https://aframe.io/ and some add-ons on https://supermedium.com/superframe/
I want to try it for a personal web-site project I haven’t found time for yet.
It does say VR, but as you can see from the various demos, it works in a browser on a conventional monitor very well.
For example a nice model-viewer: https://supermedium.com/superframe/components/orbit-controls/examples/basic/
In comparison to other solutions mentioned here, it might lack some features - but can be I didnt discover them yet :slight_smile: If anybody has experience with a-frame, I’d love to hear!

this was a while ago but I liked bablonjs. I didn’t get as far as actually hosting external fbx, mp3 ect files on github to see how it works online, but I made the blender exported html that ran locally on my computer pretty quickly. I created the gihub account and left it all for ‘later’ :smile:

the3dcgfxcompany.blogspot.com

Hang on - I thought the Whole World Was Moving To The Web??? The Web is the be-all, end-all, the back and forth, the to and fro, the beginning and the end…isn’t it?? :slight_smile: Why do we actually need native apps any more? They’re saying JS performance is close to native, anyway?? (and with things like Emscripten and WebAssembly, the scenario is getting even better…?)

Are you really writing a game? Awesome. By yourself, or in a company, if you don’t mind me asking??

Sorry - what does this mean? Browsers which run JS are available for practically every platform out there by now…?

The difference is native.

JS in all its forms is built for the scenario it was conceived for – a web browser. It is a powerful language but in some ways an inherently weak one. Like many other languages that are popular today it is designed to be “on-the-fly interpreted from source.” Functionally, it is very dependent on “indirect methods” such as DOM-manipulation and HTML5. It relies very heavily on third-party “language extension” libraries. It’s very easy to make mistakes and for those mistakes to be very expensive.

That’s why I find tools like this to be so very useful … and, for so many situations. The presence of “compile time” makes a huge difference.

No, not at all. You are confusing Blend4Web with the old Blender game engine. Blend4Web is an independently developed product. Blend4Web will be made available for 2.8.

Blend4Web is arguably the easiest direct to html option in Blender right now, as far as I am aware. Install the plugin, create a scene, export to html. Done.

1 Like

Took a look - it looks cool! But unfortunately it’s Pay though… :frowning: (maybe I can make do with the “CE” version for now…?)