Using Unity with Playroom Kit

Unity is the most popular game engine, it's also a great way to make web games thanks to the WebGL export option (opens in a new tab).

Playroom Kit complements Unity by simplifying the development of multiplayer games and interactive web-based applications.

Getting started

Video Tutorial

1. Install the SDK

1. Download playroomkit.unitypackage from the releases page (opens in a new tab) (download playroomkit.unitypackage file).
2. Drag the package into your Unity project and import all files.
3. Open terminal, navigate to your project directory, and run:

cd Assets/PlayroomKit
npm install

This will install the required dependencies for the SDK.

2. Initialize Playroom

In your game's Start method, call PlayroomKit.InsertCoin:

using Playroom;
 
void Start() {
    PlayroomKit.InsertCoin(new PlayroomKit.InitOptions()
    {
        maxPlayersPerRoom = 2,
        defaultPlayerStates = new() {
            {"score", -500},
        },
    }, () =>
    {
        // Game launch logic here
    });
}

3. Manage game state

Use PlayroomKit.SetState and PlayroomKit.GetState to handle game state. These automatically sync with other players.

See the API reference for more information.

4. Export to WebGL

1. Go to File > Build Settings and select WebGL as the platform.
2. In Player Settings:
   • Set Resolution and Presentation > Run In Background to true.
   • Change WebGL Template to PWA (or to Discord, if you want to publish to Discord Activities).
   • Set Compression Format to None under Publishing Settings (this is to make sure the build works with most web servers including itch.io).
3. Build your game.
4. Test locally using python -m http.server in the build folder.

Do note that PlayroomKit for Unity only works with WebGL builds.

Testing your games

Mock Mode

Since the current SDK only supports Unity Web, we've introduced Mock mode - a way to test out your game's logic in Unity's Preview mode, without having to build for web every single time.

1. Local (simulated)

The "Local" mock mode doesn't connect to the actual Playroom server. Instead, it just mocks the API calls within Unity, and maintains a local state.

The "Local" Mock mode only works in single player mode for now. We aim to make it multiplayer by Q4.

2. Browser Bridge (live)

This mode connects to a live, multiplayer Playroom server. It will make real network calls, but to do so, it will launch a controlled browser (to run the underlying network calls).

Which one should I use?

1. Start with Local mock mode for:

• Initial project setup
• Testing new features/algorithms
• Rapid iterations

2. Progress to Browser Bridge mock mode for:

• Realistic testing scenarios
• Multiplayer functionality
• Network performance evaluation

Multiple Player testing

The PlayroomKit for Unity plugin includes a "Playroom Dev Manager" panel for multi-instance testing and ease-of-use:

To test with multiple players:

1. Ensure the latest version of the PlayroomKit plugin (opens in a new tab) is installed.
2. Open the Playroom Dev Manager panel in Unity.
3. Click "Launch player" to create a new Unity Editor instance.
4. Repeat step 3 for additional player instances (limited by your computer's resources).

This feature uses ParrelSync (opens in a new tab) Unity Editor to create multiple Unity Editor clones, each representing a different player.

By utilizing both Mock Modes and the Multiple Player testing feature, you can thoroughly test your game's multiplayer functionality and performance within the Unity environment before proceeding to a full WebGL build.

Examples

Check out some simple and advanced use cases!

Simple Example

Use WASD or Arrow keys to move the player around. The player's position is synced with other players in real-time.

Code for this example can be found here (opens in a new tab).

Beanz: Discord Activity Demo

Once built, this demo works on both WebGL in the browser, and in Discord Activities.

Code for this example can be found here (opens in a new tab).

API Reference

See the API reference for more information.

FAQ

 private void LoadSVG(string svgBytes) {
    // Split the string to escape the real data
    svgBytes = svgBytes.Split(",".ToCharArray(), 2)[1];
    // Decode from the URL encoding
    svgBytes = HttpUtility.UrlDecode(svgBytes);
    VectorUtils.TessellationOptions tesselationOptions = new VectorUtils.TessellationOptions();
 
    using (StringReader reader = new StringReader(svgBytes))
    {
        SVGParser.SceneInfo sceneInfo = SVGParser.ImportSVG(reader);
        tesselationOptions.MaxCordDeviation = float.MaxValue;
        tesselationOptions.MaxTanAngleDeviation = float.MaxValue;
        tesselationOptions.StepDistance = 1f;
        tesselationOptions.SamplingStepSize = 0.1f;
 
        List<VectorUtils.Geometry> geoms =
        VectorUtils.TessellateScene(sceneInfo.Scene, tesselationOptions);
 
        // Build a sprite with the tessellated geometry.
        Sprite sprite = VectorUtils.BuildSprite(geoms, 100.0f, VectorUtils.Alignment.Center, Vector2.zero, 128, true);
        sprite.name = "SVGimage";
        profilePicture.sprite = sprite;
    }
}

object[] players = Array.Empty<object>();
 
PlayroomKit.OnPlayerJoin((player) => {
  players.push(player);
  player.OnQuit(() => {
    Debug.Log($"{player.id} quit!");
    players = players.Where(p => p != player).ToArray();
  });
});

Aurea NetLayer: a higher level API for Unity

GuilhermeAlanJohann from our Discord community has created a higher level plugin (opens in a new tab) for Unity that makes it easier to use Playroom with Unity.

Features

• Sync position and rotations of objects over the network (supports interpolation)
• Different object authorities (Host and LocalPlayer)
• Spawn/Unspawn objects over the network
• Send Messages to others (including or excluding yourself)
• RPC (...kind of). It uses Unity message system.