Labyrintus - cooperative family game for Table PCs and mobile phones

• Download XNA-WPF_integration.zip - 2.7 KB

Introduction

Article category: All-In-One, Games

Labyrintus is an original new cooperative family game specifically designed for touch screen Table PCs and mobile phones. Up to four players can play this game together. Interactive game plan is displayed on the main screen - the labyrinth composed of small rectangular tiles. Other game objects and player's stones are displayed there.   

Every player has also a mobile phone with the companion app running on it. On this small screen he can see the game instructions and other aims and informations that other players shouldn't see. Also there is an actual score displayed there and the number of the round.  

Te aim of the player is to travel through the labyrinth with its "game stone" . There are small pictures displayed on some tiles - a dog, a car, a small building etc. Player can slightly modify the game plan every round (by moving or rotating some tiles, see the game variants below) and then move its stone. If he accomplish the aim displayed on his phone (for example if he successfully travel through the labyrinth and put his stone on the correct image), he will aim a point. 

Because the player doesn't see directly the actual aims of the other players, he can only estimate what they want to do. If he suspect correctly their aims, he can modify the plan, so it will be harder to get there for them. There are some aims that require to roll with the electronic dice, some aims will be limited only by the round number etc. 

This game is now in preproduction, we have some first "board game" handmade models and also some first software prototypes. We want to test this game on some real Table PC hardware. We really believe in our concept. We have previously created the game HexaLines, which is available to download for Windows PCs now on the Intel AppUp Store. 

Game variants

The first type of the gameplay is a "sliding game plan". It is composed of 5x5 or 7x7 rectangular tiles, each tile is made of 4 fundamental paths (straight line, a curve, T-type or crossing). Player can modify the plan by sliding by one tile in the column or in the row. So the "1-2-3-4-5" row becomes "5-1-2-3-4" or "2-3-4-5-1".

There will be some locked tiles that cannot be moved (so the whole row and the whole column that contains this tile cannot be moved). These locked tiles will have a different color.

The second type of the gameplay is a "rotating game plan". Each of the tile can be rotated to 90, 180 or 270 degrees (this rotation = one correct game move).

Game flow

The game starts and there are four QR codes displayed on the Table PC display (for red, blue, green and the yellow player). Each player starts its mobile application and reads the correct QR code from the app. When all players are initialized, the game starts. 

Each player has its game stone in one corner of the plan. In the mobile app it is displayed the first aim for each player. Players are alternating in moves, modifying the plan and moving the stones. The game ends when the first player accomplishes all his aims.

Implementation XNA+WPF

The game will be programmed in combined XNA / WPF project (as a Windows Desktop application). The main UI will be drawn in XAML, the game plan and all effects will be drawn by the XNA Framework.

It is quite tricky to find a solution how to connect these two technologies together. There is no official solution from Microsoft how to integrate XNA into WPF.  But it is definitely possible. We can add a WindowsFormsHost item into our XAML file (so we will draw all XNA content into WinForms sub-window, inserted on XAML page): 

<WindowsFormsHost Name="WinFormsHost">
    <wh:OptimizedPanel x:Name="RenderingPanel" />
</WindowsFormsHost>

We can pass this RenderingPanel into our Game1 class:

Game1 game1;
public MainWindow()
{
    InitializeComponent();
    game1 = new Game1(RenderingPanel);
}

Our Game1 class should look like this:

public class Game1
{
    GraphicsManager gfx = new GraphicsManager();
    ContentManager Content;
    SpriteBatch spriteBatch;
    ServiceContainer services = new ServiceContainer();
    contentLoaded = false;

    public Game1(Control parentControl)
    {
        gfx.Create(parentControl);
        gfx.Draw += new EventHandler<EventArgs>(Draw);
        gfx.Update += new EventHandler<EventArgs>(Update);
    }
    private void Initialize()
    {
        spriteBatch = new SpriteBatch(gfx.GraphicsDevice); 
        services.AddService<IGraphicsDeviceService>(gfx);
        Content = new ContentManager(services, "Content");
    }
    private void LoadContent() { // Load code }
    private void Update(object sender, EventArgs e)
    {
        if (!contentLoaded)
        {
            Initialize();
            LoadContent();
            contentLoaded = true;
        }
        // Update code
    }
    private void Draw(object sender, EventArgs e)
    {
        if (!contentLoaded)
            return;
        // Draw code
    }
}

To make it work we also need to add these two helper classes into our project: GraphicsManager and ServiceContainer. You can download them in the attachment of this article.  

Implementation - phones  

The first version of the phone companion app will be created for Windows Phone devices, in Silverlight (C# / XAML). We are also thinking about other platforms, it should be possible to aim Android and iOS thanks to Xamarin.iOS and Xamarin.Android frameworks. 

For QR code reading we will use a messagingtoolkit Barcode library from twit88.com, or ZXlib library. There are a couple of other libraries available for Windows Phone, most of them are very easy to use. 

For the communication between mobile phones and the Table PC we will use a standard WiFi connection with server-client architecture, communication will be led through the sockets.

Summary

Labyrintus is a very original new concept of the interactive game. Table PC is used for the main game plan, connected mobile phones run a companion app with further instructions and the important game aims.

Concept of game tiles that can slide and rotate and together compose a labyrinth is very interesting. The game has very simple rules, but with its complexity can be appealing not only for kids, but also for the parents and other adults. It is a very nice interconnection between classical board games and a modern technology.