Babylon.js Editor and Electron
A new story began with the Babylon.js Editor since it is now able to run as an embedded app in an Electron app :)
@sevan, from the Babylon.js Core Team, experimented the editor with Electron and finally shown us that it is easily possible: only 20 minutes to package the editor (including Babylon.js) into an Electron app! Starting from this point, some POCs were realized to show the power an embedded app such as the editor.
Note: this article is special for Michel Rousseau since the POCs are all related to him :)
Automatically reload a scene when changed
The first challenge was to make the editor able to automatically reload the scene when the artist re-exported it. Considered as a challenge, the Node.js APIs were extremely powerful and only few lines of code were needed.
Now, at each exportation, the editor is able to reload the scene (keeping the last camera position, target, etc.).
Live texturing with Photoshop CC
Another challenge was to offer the possibility to connect the editor and photoshop together. Why: Live texturing! The advantage of live texturing is that the artists do not need to reload the scene to see their modifications on their 3D models. So, they can see the result in realtime in the editor!
In fact, the editor plays the role of a server, where Photoshop is a client that sends buffers (via sockets) to the server (the editor).
The demo video
In the future
Electron offers infinite possibilities to an application such as the editor, a lot of new useful features may come with the editor in the future.
Can wait for ideas & development and enrich the editor thanks to Electron!
Installing the photoshop plugin
To be able to connect to photoshop and live texture, you just have to install the photoshop plugin available at https://github.com/BabylonJS/Editor/tree/master/Tools/Photoshop in the Photoshop’s plugins folder typically located at YourApplications/Abode Photoshop/Plug-ins/Generator/.
The folder “Photoshop Plugin” is the folder I created which contains the editor plugin’s files:
Now you can restart photoshop and connect using the editor :)