Sharing the game!
How to Host Unity Games on the Web
In our last article we covered building and testing our unity project. We did this primarily through our standalone builds for Windows, Mac OS, or Linux, but we touched upon a few settings that needed to be changed for WebGL Builds. Namely, the compression format. It is important to have the compression format set ti disabled from the projects settings window in Unity or your build won’t play properly on sites like itch.io where we can share our games with the world!
The first thing we need to do to make a WebGL build for our game to be hosted online is to open our build settings window and swap to a WebGL build configuration by selecting the WebGL option from the Column on the left and clicking the Switch Platform button.
You’ll notice that once we switch there are some instructions at the bottom of the build settings window instructing us to go to the Player Settings window and correct our Color space settings for WebGL builds.
We’ll click on the Player Settings … button to open our Project Settings window.
If it’s not already selected, click the Player Option on the left side and then click on the tab with the symbol for HTML5 on it. This is the WebGL tab of the player settings. Once we are on this tab, we will want to expand the Other Settings Section. We can see a message about our color space not being compatible with WebGL 1.0 and instructing us to uncheck the Auto Graphics API check box to Remove WebGL from the build and allow our Linear Color space to be used. Uncheck the box as instructed.
This will change the options section to display all the Graphics APIs used in the project, which in my case was just WebGL 2.0.
While we’re in the Project Settings window let’s take care of our Compression Format that I mentioned earlier. Click on the Publishing Settings section and change the Compression Format to Disabled
Now close the Player Settings window to return to our Build Settings window. Click the Build button and select a location to save the built files that Unity will produce.
We will want to Compress (or Zip) the folder that Unity creates for our build. The zip file should include the 2 folders and the index file that are generated by the build. The zipped files are what we will upload to the site hosting our game.
I am using simmer.io to host my game but itch.io is another popular alternative. Head over to simmer.io, create an account, and once logged in, click the upload button which takes you to the screen below. We can either drag our build folder with our three folders and index file directly into the upload screen, or we can, alternatively, click to upload the zip we just created.
** It is important to note that not all browsers support WebGL 2.0, I had to use Chrome to upload and play my game at simmer.io because Safari for Mac does not support WebGL 2.0.*
After the upload completes we can enter some basic information like our games title and then Click the Save Game button. We are then presented with the screen for our game that provides us with a link to share our game.
Next Time!
That’s it! We can now share our web build with others for them to play it! Next time we’ll look at coding to allow for the Escape key to close our standalone builds. If you enjoyed this article, or want to come along with me as I progress on my journey, follow me at gamedevchris.medium.com.
