Games Community Group meeting

Anthony Bowker - Unity for the Web
15 April 2021

Table of contents

  1. Video
  2. Transcript

See also:

Video

Transcript

Hello everyone, I'm Anthony Barker and I'm the software engineer lead at Unity on the WebGL platform team. I've been at Unity now for six months and I'm going to share with you today a little bit about Unity and support for the web.

Unity is a leading platform for creating interactive real time entertaining entertainment content, including things like film animation, automotive, manufacturing, architecture, engineering, and the reason we're all here today: games.

With Unity, we have this goal, where you can build once, you can create your game once, and you can deploy it anywhere across mobile desktop consoles and the Web.

The web has been an important target for Unity for a long time. We first previewed our WebGL target back in 2015 and before then we even had a plugin web player for various browsers so you could bring your content to the web that way.

So let's dive in and have a quick look at how you build for the web. What I'm going to show you here is a way of creating a very simple 2D game within the Unity editor and I'm going to use the Dragon Crashes project, which was released recently as a sample 2D game that you can use with Unity.

So we saw here that we open the Unity editor and first of all, we created a 2D game and we changed the target platform to be WebGL. Now I can go to the Unity asset store and from there, I can find the Dragon Crashes asset bundle. And we can import this into our project.

I sped up for this recording some of the import stages which are quite long, the first time you do them. Once we have Dragon Crashes imported, we can go ahead and set the initial scene to be that start screen. I hope everyone can see this video okay. With this, we can then, if we wanted to, play it within the editor but let's go ahead and make a build for the web. We open up the build settings window again, we can target compilation for speed, build to a destination web directory. And then we pop that open in our development browser on our desktop.

Dragon Crashes is the official sample project that was released recently and it showcases a lot of the tools that come with using the Unity platform. It's an example of the sort of side scrolling RPG game and it sort of shows off the things like the skeletal animation, inverse kinematics, level design, and some of the shapes and pixel art tools that are available in Unity. This project and these assets are available free on the web for anyone to try and, as you can see, you can build very easily within the download of the Unity editor.

I'd like to take a quick overview on... First of all, once we create the game with Unity, it's really designed so that it can be hosted anywhere. We saw in the demonstration that I hosted it locally, on my own desktop machine for testing. Anyone can provide their own web server, provided that they set up the WASM mime type, and we also provide within our build system pre-compression to Brotli as well. So if you configure the Web server to supply Brotli files, you'll get that advantage of serving those in a compressed way. There's also many sites out there, where you can then upload your Unity game and host it, including play.unity.com which has become a very interesting way where users can quickly share what they have created with their friends and get feedback on a website that's free for anyone to use.

The Unity WebGL target. As we saw in the DEMO has a basic template that your game exists within but essentially all you need to do is give it a canvas element within your web application. And then connect the Unity player to that so those canvas elements or elements can then be embedded within any web page of your choice.

Take a quick look here at how the Unity game arises on the web. Unity is essentially a native C++ game engine which is how it supported across all of those different platforms, and it enables the user to create their game logic in C# game scripts. And so, how do we get those onto the web. Unity includes this ahead of time compile step to C++, and this is something that's used across various different platforms, where we want the user C# game logic to be pre compiled into native C++ from the get go. On desktop platforms, you can also use the .Net core and run your game that way, if you want as well, which is great for development, because you get that faster iteration side time. So on this slide we show that the C# game logic, we first of all, use the C# compiler to compile that to manage assemblies, this is using the intermediate language.

The next step is we actually go through those intermediate language assemblies, which include your game logic also things like the core framework, and we do a very aggressive stripping of all of the manager seminars that you're not using. This is very important, particularly for the web, to remove anything that your game doesn't use. And so those striped assemblies is what we then use feed into the head of time compiler IL2CPP. And that creates the C# C++ code, which we then bring together with the game, libraries and we can then compile either to in this slide and native binary for things like desktop or some of the console's or the mobile platforms, or for the web. We then use the Emscripten tool chain to build that to run on top of web assembly.

And that gives us near native speeds within the Web browser. And it also allows us to, you know, then you target the WebGL as the graphics back end on the web.

The Unity development team, particular my colleague Yukka has been contributing to the EMScripten projects for many years. Most recently, we did a contribution, which supports you know some explicit uniform location binding transcripted handling of the GLSL shader support. So that if you're using an EMScripten an application which treats the graphic devices and OpenGL graphics device, it provides you the ability to lock your layouts in those shaders that you're using. And so, using these technologies, the IL2CPP and then the scripts install chain is how we bring the Unity content, which is the C++ content and the user C# scripts to the web. And that's pretty cool because now, anyone can access their game just a hyperlink away.

For the remainder of the presentation, I like to talk a little bit about where we're headed with the Unity support for the web. And we've actually, at the GDC this year, announced that there's a public roadmap now on the Unity website, which is what all of the different groups within Unity are bringing forward in future versions. With the Web support we're focused at this time on adding the support that we need in terms of features and in terms of the bundle code size. To get us to a place where we can support Unity content on the mobile web.

We all know that many users of the Web come to their sites from mobile devices and while in the past we've had solid desktop support, we want to bring that also to the mobile as well. And so, some of the things that are being worked on our support for compressed audio. Which is necessary for things like background music, you heard the background music in the Dragon Crashes game there so that can remain compressed in memory, rather than decompressing you in the browser. And likewise support for mobile compress texture formats within the Web solution, and so that will allow you to support compressed texture straight through to the graphics hardware on the mobile devices.

We also including various mobile features like support for the gyroscope gravity sensor, locking screen orientation and the webcam which are provided within Unity C# API and so now you can bring those features through to the mobile web targets as well.

In addition to that we're also going to be working on supporting faster build times within the Unity framework so that you can get more quickly through that process of those tool chains until you can use it on the web. Currently we're targeting WebGL and we'll also be working in the future towards things like WebGPU support. When that becomes available Unity content will be there as well.

The final thing I want to mention is an alternative way of using Unity to target the web, and that is with project tiny. What we've discussed so far is using the Unity editor that's been released for many years to create content for many devices. And that brings a whole wealth of tools, but it also creates fairly large engine deployments and a large content that needs to be downloaded to your device.

Project tiny is really focused on providing a very modular runtime framework so that you can create your games in an instant way so that they are small, light and fast. Project tiny is also built on top of Unity's DOTS, which is a data oriented technology framework which is available. The previous Unity that we looked at was using game objects and more of an object oriented flavor of development.

Project tiny is currently in development so it's only available for preview at the moment, so if you want to look at it go ahead, but it's not yet ready for prime time. Not production ready.

And I have here a quick demo of a game created last fall, Skelly Buddies, and this targets here the web and, as you can see, it has that mobile phone factor right out of the box. In this slide, I've got another quick DEMO as well, but I see that my 10 minutes are up.