A search engine inside a game engine? It’s an idea that took shape just before one of Algolia’s off-sprint days, an event where Algolians experiment with new concepts.

During the previous off-sprint, my colleague Samuel Bodin and I were thinking: Algolia has a .NET API Client, and Unity supports C# as a scripting language–Why not try to bring them together?

Our idea was to implement a search-as-you-type experience inside a Unity game scene. We decided to create a marketplace, a common use case for searching within a game.

The result? Success. Except for a small challenge with performance, which was solved by switching into asynchronous mode, at the end of the day we had a fully functioning Algolia search within Unity, complete with an index of game assets and images, and a full search and results UI. Let’s see how this was done!

Using Algolia with Unity. Getting started!

Unity does not support the .NET package manager NuGet. To address this, you have to download the zip package of the Algolia library directly on nuget.org, and then unzip the contents in the Assets/Plugins folder of your Unity Project.

After that step, you have to add the using Algolia.Search.Clients; statement in a C# script to start using Algolia with Unity.

Now that we have Algolia plugged into Unity, the next step is to create the game scene.

Finding Assets

Our first task was to find game assets and a dataset to craft our game scene.

We found this excellent starter kit from Unity and used it as a foundation for our experiment. The good thing is, it was packed with a lot of UI elements–we just had to reuse them to create the marketplace scene and add a menu to access it!

Creating a dataset of planets

Before digging into the game design, we had to create a dataset. Since science-fiction was the theme of the assets, we decided to create a dataset composed of planets. We created a thousand fake planets with a powerful dataset generator, Mockaroo. We then used CC images to illustrate the dataset. Once that was done, we were ready to go! If you want to reuse the data you can find it on GitHub.

Crafting the marketplace

The final and most challenging step was to create the game scene for the marketplace. We wanted it to be simple: it would be composed of a search bar and a panel displaying the results. To achieve this, we took the controls scene from the starter kit and customized it. The result—a panel for the planets—looked like this:

After scaffolding the scene, a little bit of work was required to bring it to life. We needed to script some C# to turn the empty box into planets.

Scripting the as-you-type search

Before sending requests to Algolia, we needed to catch every keystroke the user was typing. To achieve this, we attached a C# script to the InputField to catch the ValueChangeCheck() event. All good, we were able to retrieve the input keystrokes! Making a request to Algolia with the retrieved string was as simple as:

var results = await _searchIndex.SearchAsync(new Query(SearchInput.text)
{
    HitsPerPage = 8,
});

Note: we had already instantiated the AlgoliaClient and the Index object in the Start() method to avoid creating a client for each request.

We got the search working, and Algolia’s C# API returned a list of planets (List<Planet>). Now we had to display them. We had to create GameObjects.

We wrote the void LoadResults(List<planets>)method, which creates game objects from List<Planet>. You can find the source code on GitHub. Here we will point out only a few parts. In short, the method loops on the planets to create game objects, one for each planet.

Perfect.

No, not perfect. Not yet: the display of planets was too slow, and the image refreshes were choppy.  

Asynchronicity

Our first idea was to create two game objects per planet: a RawImage and a Text, and then to do some computations to position them in the scene. The search experience was OK, but it was a bit laggy.

So we looked into this and discovered a flaw in how we displayed the planets. We were loading the planets’ textures synchronously, and that’s what made it seem slow. The solution to make the search experience more fluid was to load the planets’ textures asynchronously. To achieve this, we used the Resources.LoadAsync<Texture2D> method from Unity in our LoadTexture

IEnumerator LoadTexture(RawImage image, Planet planet)
{
    var resourceRequest = Resources.LoadAsync<Texture2D>($"{planet.Path}"); ;
    while (!resourceRequest.isDone)
    {
        yield return 0;
    }

    image.texture = resourceRequest.asset as Texture2D;
    image.color = Color.white;
}

You can see the difference in the video below:

Perfect! But not done. While the search experience was fast enough for our POC, we had not yet loaded the scene from the main menu.

Loading the scene from the main menu

To close the loop, we created a button in the main menu to access the marketplace. We attached a LoadSceneOnClick script onto the OnClick() event of this button. This script, as its name implies, loads a scene with its index after the button is clicked:

public class LoadSceneOnClick : MonoBehaviour
{
    public void LoadByIndex(int sceneIndex)
    {
        SceneManager.LoadScene(sceneIndex);
    }
}

We now have all the pieces in place, so let’s see the result!

Are we done?

In one day, we created a simple marketplace in Unity with a search powered by Algolia’s C# API client. And we are not finished! One interesting direction is to try the same with other game engines; for example, another project would be to reproduce this integration with CryEngine, which also supports C# as a scripting language!

But the real next step is to add all of Algolia’s features into the solution. There are still a lot of possibilities for us to explore: creating a search in an inventory in MMO games, adding a UI to search servers, adding facets and filtering, deepening the dataset, adding analytics and personalization, etc. Essentially, as your game increases in complexity, your marketplace, and any search-based feature in Unity, will need to follow suit. Happy gaming!

Written in collaboration with Samuel Bodin.