Get Started with WebGL in Unity

In this article, you will learn all you need to know about getting started with Unity WebGL. First, let us have a brief introduction to WebGL itself.

What is WebGL?

WebGL which stands for Web Graphics Library is an application programming interface (API) for rendering both 2D and 3D interactive graphics on web applications.

It relies on JavaScript and can be used with HTML5 (written within the canvas tag). It was developed by the Khronos WebGL Working Group and initially released on March 3, 2011, 13 years ago

With WebGL, a JVM is not needed to process 3D graphics. That is, no need for plugins. It is based on the open-source OpenGL ES. WebGL is compatible with a wide range of browsers; Chrome, Safari, Internet Explorer, Edge, and Firefox.

For more information on WebGL, visit this site

Now that we fully understand what WebGL is and what it does, let’s dive into Unity WebGL.

Unity WebGL

There is support for WebGL in Unity. The WebGL option in the Unity Editor gives developers ultimate access to render interactive graphics in a web browser, as long as the web browser is compatible.

Here is a non-exhaustive list of compatible web browsers with Unity WebGL:

• Google Chrome
• Mozilla Firefox
• Apple Safari
• Microsoft Edge

Note: Unity WebGL only provides support for desktop browsers, not mobile devices. Also, Unity no longer supports WebGL 1, just WebGL 2 for now.

Visit Unity’s Browser Compatibility Page to learn more about Unity WebGL browser compatibility.

Getting Started with Unity WebGL

Getting started with Unity WebGL is very straightforward, as long as you have met the browser compatibility requirements. As long as you have the Unity Hub installed, you can access the WebGL Build Support module and add it. This module is required for building WebGL applications.

How to access the WebGL Build Support module

In case you do not know how to access the WebGL Build Support module, here is a quick step-by-step guide on how to do that;

1. On the Unity Hub, navigate to the Projects tab.
2. On the Installs tab, search and identify the Unity Editor version you are using.
3. Select the Settings menu and click on Add Modules.
4. Select the WebGL Build Support module and click Install.

By doing these, you have successfully added the WebGL Build Support module to your Unity.

Now, let us take a look at WebGL builds.

WebGL builds

WebGL builds are files that can be published on online hosting platforms like Unity Play to render the real-time experience of your projects.

To create a WebGL build;

1. Open the project you want to create a build on the Unity Editor.
2. Navigate to Build Settings on the File menu and find the Scenes in the Build section.
3. Add the scenes you want to be included in your build.
4. Select Player settings and update the details of your build (Company Name, Product Name, and Version).
5. Select WebGL under the Platform menu.
6. Click Build And Run to create the WebGL build and automatically run locally on your default browser.
7. Do not forget to save your build.

Visit this site for more information on creating WebGL builds.

Now that you know how to create WebGL builds, you should want to host it on online hosting platforms like Unity Play, to enhance sharing of your builds.

To publish your build on Unity Play:

1. Ensure you have the WebGL publisher package installed. Learn how to do that here.
2. Select Publish on the main menu and navigate to WebGL builds.
3. Select the build you want to publish and click Publish.
4. Your build will be automatically published to Unity Play.

Conclusion

Now you have learned the basics of Unity WebGL. Visit the Unity Docs for more resources on exploring the Unity WebGL.