Friday, 24 May 2013

On homegrown tools

The level editor

In order to build Urban Galaxy Online we had to create a set of tools to make our life easier as developers, so we decided to invest alot of our time to create a simple level editor so that our level designer could put the pieces together as fast as possible.

We decided to build our tools on Java and we chose jMonkey Engine as our foundation library. After a couple of months we ended up on our level editor looking like this:

Urban Galaxy Editor

We chose the grid based approach to create game districts as easy as possible using building fragments connected together like lego parts.

Within the editor you can set some generic properties such as the level size, name, pvp flags etc. Then, using brushes you can actually "paint" the level using building blocks.

Apart from the level itself, you are able to position mobs and NPCs inside the level and adjust their positioning and patrol path.

The admin pages

The level editor is actually part of a bigger set of tools called "admin pages", a web based portal to edit everything that has to do with the game, in a distributed manner that works on top of a cloud. The admin pages were built using Codeigniter PHP framework and the Bootstrap library for the interface.

From the admin pages, you can edit all aspects of the game, including items, weapons, mobs, quests, events etc. While developing the game several "needs" emerged for helping tools. Those tools will be added into the admin pages. Currently we have developed such a tool to help us visualize the quests per class. We also plan to develop such tools to help in balancing the in-game economy.

Each graph represent the quest sequence of a career, since this is a first version of the tool there are overlapping errors

Behind the scenes

The level editor is running within the admin pages as well using the Java applet technology of  jMonkey Engine and LWJGL.

We built the user interface of the editor from scratch using the following components of the JMonkey Engine 2.0:

  • BitmapText
  • Textured Quads
  • Orthographic viewports
  • Key and mouse event listeners
All the 3D primitives are loaded using JMonkey's OBJ loader and then saved to a custom XML file format describing the structure of the level.


  1. How come you chose to use jMonkey and LWJGL for the editor? Surely building it as WebGL would offer a better indication of the final product?

  2. We started developing the game 4 years ago. Back then, WebGL was still on its infant steps, no final standards yet and javascript was not performing as it performs today.

    That said, we decided to utilize browser support though Java Applets and we chose JMonkey for that. In that sense we built our tools and the client in parallel, both in Java. We spent the last 6 months trying to port the client from Java to WebGL. It was a cumbersome task and it would not make sense to do it twice for the tools, at least not for the next couple of years, since we want to focus on completing the game and release the next episodes as soon as possible.

  3. Awesome, yeah makes sense then to leave them as java. Glad you decided to port to WebGL

    Will you eventually be working on graphics options?

  4. On a future blog we are going to discuss the reasons behing porting to WebGL, based on real user-metrics.

    About the graphic options: They are not on the table, at least not for the moment. We aim for the best looking graphics on the best variety of devices to keep things simple, both from the user's and the developer's perspective. It is a browser game after all :)

  5. Yeah good call. Although I bet you are now excited about the prospect of Mobile WebGL in Chrome ;-)