Blau Game Official Level Designing Toolbelt - Made with Unity Engine.

Table of Contents

• The Game
• Game Level Design Process
• How The Level Editor Works
• Usage
• Contributing
• License

The Game

blau is game where your goal is the simplest possible one: get to the end of each level. How? By guiding blau - actually, an abstract black circle - through many simple - yet elegant - puzzles, avoiding physics-based traps and collecting shapes; to every level, there are many solutions, which go from beautifully simple to deep and complex ones - it all starts with a gesture, then evolves with physics, but the end is up to you.

Watch now the official game teaser!

Game Level Design Process

blau has its core entirely writen in Swift, using the SpriteKit framework.

As stated by the official docs provided by Apple:

An SKScene object represents a scene of content in Sprite Kit. A scene is the root node in a tree of Sprite Kit nodes (SKNode). These nodes provide content that the scene animates and renders for display. To display a scene, you present it from an SKView object.

When it comes to blau, all the content that is rendered by our main scene is fetched from a .json file. This file consists of an array of level objects.

Dev note: SwiftyJSON was such a great choice for us when it comes to parsing JSON data; it gave us a much simpler and clearer syntax for doing it!

Here's a simple example of a level object:

{
  "hero":{
    "position":[
      -350,
      0
    ]
  },
  "camera":{
    "position":[
      0,
      0
    ]
  },
  "finish":{
    "position":[
      350,
      0
    ]
  },
  "background":{
    "size":[
      1100,
      1100
    ]
  },
  "checkpoints":[
    {
      "position":[
        -350,
        0
      ]
    }
  ],
  "pickups":[
    {
      "position":[
        -175,
        0
      ],
      "collected":false
    },
    {
      "position":[
        0,
        0
      ],
      "collected":false
    },
    {
      "position":[
        175,
        0
      ],
      "collected":false
    }
  ]
}

Which is rendered to the following level scene:

As can be noticed, data described in our JSON model consist basically of Cartesian coordinate system plotting coordinates of our gameplay elements.

Our gameplay elements aren't restricted to the mentioned above, there are a few others, e.g. flows and vortexes objects containing the respective positioning data - amongst other data - in more complex levels.

How The Level Editor Works

This is a Unity project which takes advantage of Unity's scene editor to ease our level design process.

Instead of spending hours doing lots of maths to plot each gameplay element correctly in our scenes, our level designers can now do it visually and then have a simple level object in a valid JSON format generated.

Here's an example of a level in our editor:

And this is the generated JSON:

{
  "hero":{
    "position":[
      -350.0,
      0.0
    ]
  },
  "camera":{
    "position":[
      -350.0,
      0.0
    ]
  },
  "background":{
    "size":[
      1100.0,
      1100.0
    ]
  },
  "checkpoints":[
    {
      "position":[
        -350.0,
        0.0
      ]
    }
  ],
  "pickups":[
    {
      "position":[
        0.0,
        200.0
      ],
      "collected":false
    },
    {
      "position":[
        0.0,
        -200.0
      ],
      "collected":false
    }
  ],
  "flows":[
    {
      "center":[
        0.0,
        0.0
      ],
      "origin":[
        0.0,
        -200.0
      ],
      "destiny":[
        0.0,
        200.0
      ]
    }
  ],
  "vortexes":[
    {
      "position":[
        0.0,
        0.0
      ],
      "radius":150.0
    }
  ],
  "finish":{
    "position":[
      350.0,
      0.0
    ]
  }
}

Which is rendered to the following level scene:

Usage

First Steps

1. Download the project here.

2. Open it with Unity.

3. Drag the the gameplay elements - Unity game objects - from the Hierarchy tab into the scene.

4. Click the blau tab on the main menu and select Serialize Level.

If everything goes right, you should see a window with a compressed JSON object:

Gameplay Elements

Gameplay Element	Editor Representation	Rendered Result
Hero
Background
Finish
Checkpoint
Pickup
Vortex Eater
Vortex Field
Flow Emitter/Receiver

Contributing

Contributions are very welcome! If you'd like to contribute, these guidelines may help you.

License

• Blau Game Official Level Editor source code is licensed under the MIT License.

• Other stuff related to Blau Game itself - e.g. logo and visual identity - which are available in this repo are licensed under the Creative Commons Attribution-NonCommercial-NoDerivatives 4.0 International License.

• The Download on the App Store badge has All Rights Reserved to Apple Inc.