How to Integrate Unity and Blockly?

alexandrol · January 29, 2016, 3:25am

I would like to know if there are integration experiences of Unity games controlled through Blockly.
Specifically I would like to evaluate the possibility of developing educational games with Unity and controled by Blockly as those offered in https://studio.code.org/

Thanks in advance

Shizola · April 19, 2017, 4:10pm

One year later, has anybody tried this?

UnnikrishnanR · June 15, 2017, 10:14am

I had integrated Blockly into a WebGL project I was working on earlier this year. I have since then moved on to creating a blockly/scratch like environment inside Unity (using UI.Canvas elements) as I needed portability across platforms (Blockly does have Android support but I think the process integrating the BlocklyActivity into a Unity based app would not be trivial).

The key is to understand that Unity WebGL runs on asm.js [0] which is practically machine level byte code for the browser JS engine, which means you will not be able to directly access game objects, scripts and other features in Unity from the webpage. The solution I figured out was to first integrate Blockly[1] into a WebGLTemplate [2] and then use Application.ExternalCall [3] (Unity has since deprecated this and recommends creating a jslib) to call the eval function [4] in Blockly (after converting your blockly workspace to JS/Python/… code first) [4]. Though you cannot access Unity elements directly, you can still communicate from your blockly code to Unity using the SendMessage function [5]. I was not very happy with this roundabout way plus I did not like the design choices the Blockly team made (like the way they restrict the hues one can use for coloring custom blocks). Do let me know if anyone figures out an easier way to integrate Blockly into Unity and especially one that is portable across all platforms!

[0] https://blogs.unity3d.com/2014/04/29/on-the-future-of-web-publishing-in-unity/
[1] Fixed-sized Workspace | Blockly | Google for Developers
[2] Unity - Manual: WebGL templates
[3] Unity - Manual: Interaction with browser scripting
[4] إنشاء JavaScript وتشغيلها | Blockly | Google for Developers
[5] Browser to Unity WebGL communication - Questions & Answers - Unity Discussions

YumaS · January 9, 2018, 7:51am

UnnikrishnanR:

I had integrated Blockly into a WebGL project I was working on earlier this year. I have since then moved on to creating a blockly/scratch like environment inside Unity (using UI.Canvas elements) as I needed portability across platforms (Blockly does have Android support but I think the process integrating the BlocklyActivity into a Unity based app would not be trivial).

The key is to understand that Unity WebGL runs on asm.js [0] which is practically machine level byte code for the browser JS engine, which means you will not be able to directly access game objects, scripts and other features in Unity from the webpage. The solution I figured out was to first integrate Blockly[1] into a WebGLTemplate [2] and then use Application.ExternalCall [3] (Unity has since deprecated this and recommends creating a jslib) to call the eval function [4] in Blockly (after converting your blockly workspace to JS/Python/… code first) [4]. Though you cannot access Unity elements directly, you can still communicate from your blockly code to Unity using the SendMessage function [5]. I was not very happy with this roundabout way plus I did not like the design choices the Blockly team made (like the way they restrict the hues one can use for coloring custom blocks). Do let me know if anyone figures out an easier way to integrate Blockly into Unity and especially one that is portable across all platforms!

[0] https://blogs.unity3d.com/2014/04/29/on-the-future-of-web-publishing-in-unity/
[1] https://developers.google.com/blockly/guides/configure/web/fixed-size
[2] https://docs.unity3d.com/Manual/webgl-templates.html
[3] https://docs.unity3d.com/Manual/webgl-interactingwithbrowserscripting.html
[4] https://developers.google.com/blockly/guides/app-integration/running-javascript
[5] http://answers.unity3d.com/questions/825602/browser-to-unity-webgl-communication.html

I also want to integrate Unity and Blockly but I can’t understand how to integrate Blockly into a WebGLTemplate. Would you tell me more details to integrate Blockly into a WebGLTemplate?

Silence_ZM · July 3, 2018, 6:55am

garasouleima01 · June 23, 2019, 3:14pm

i have the same problem any helps

suryakumara33 · January 15, 2020, 7:17am

UnnikrishnanR:

I had integrated Blockly into a WebGL project I was working on earlier this year. I have since then moved on to creating a blockly/scratch like environment inside Unity (using UI.Canvas elements) as I needed portability across platforms (Blockly does have Android support but I think the process integrating the BlocklyActivity into a Unity based app would not be trivial).

The key is to understand that Unity WebGL runs on asm.js [0] which is practically machine level byte code for the browser JS engine, which means you will not be able to directly access game objects, scripts and other features in Unity from the webpage. The solution I figured out was to first integrate Blockly[1] into a WebGLTemplate [2] and then use Application.ExternalCall [3] (Unity has since deprecated this and recommends creating a jslib) to call the eval function [4] in Blockly (after converting your blockly workspace to JS/Python/… code first) [4]. Though you cannot access Unity elements directly, you can still communicate from your blockly code to Unity using the SendMessage function [5]. I was not very happy with this roundabout way plus I did not like the design choices the Blockly team made (like the way they restrict the hues one can use for coloring custom blocks). Do let me know if anyone figures out an easier way to integrate Blockly into Unity and especially one that is portable across all platforms!

[0] https://blogs.unity3d.com/2014/04/29/on-the-future-of-web-publishing-in-unity/
[1] https://developers.google.com/blockly/guides/configure/web/fixed-size
[2] https://docs.unity3d.com/Manual/webgl-templates.html
[3] https://docs.unity3d.com/Manual/webgl-interactingwithbrowserscripting.html
[4] https://developers.google.com/blockly/guides/app-integration/running-javascript
[5] http://answers.unity3d.com/questions/825602/browser-to-unity-webgl-communication.html

Hi… I have done your step… now I still get a problem… I cannt combine 2 block… it running at the same time not one by one

htq110219891 · April 30, 2020, 8:21am

We have studied and practiced for 4 years, combining unity and blockly. And completed version 1.0. We used it to create complex games and successfully released them. Compared with the code, it reduces the development time by 70%.
Version 2.0 is currently under development and has been developed to the end. It will be announced after completion and free to use.

MKrohn · June 8, 2020, 10:39am

Hi htq110219891,

that sounds great, though I wonder what exactly “version 1.0” and “version 2.0” relate to. Are you part of the Blockly developers and talk about a new version of Blockly? Or are you a Unity developer who wrote a framework for Blockly?

htq110219891 · August 6, 2020, 8:06am

The problem with version 1.0 is that it runs slowly, and the official Bolt also has this problem. Version 2.0 We rewrite the underlying code and support incremental updates of the code. The running speed can surpass the code, and the actual test is 18 times faster than Bolt.

We are not google staff, but we have provided code for blockly. We have used blockly to develop many tools and are very familiar with Unity, so we thought of combining the two. The results are great.