Clockwork Editor

TGA - Group Project Editor



Description


  • 4 Group Projects
  • Custom Engine

During our Game Projects at TGA, I was mainly responsible for the creation and maintenance of the Clockwork Editor.

It was mainly modelled after Unity due to me being familiar with it, and it continued being developed as I listened to requests and demands, while making some modifications and alterations by my own wit.

I will now detail some of the main functionalities and a bit about what goes on behind the facade.


- Prefabs -

The Prefab system showed itself to be vital when streamlining our workflow during our projects. Without it our Level Designers would have to manually update all of the thousand of different objects in their scenes as soon as the Graphical Artists updated their models or anyone wanted to do any change.

They work by practically saving an object and it's children in a special Prefab File, which contains the data needed to reconstruct the object and a special Prefab ID. The instances in a scene file contain this Prefab ID which points to which Prefab it should load. 

In our Editor we reload every instance from the Prefab File to always keep them updated, but we also allow for the special loading and saving of instance variables that are specific to that one instance. This procedure of loading an object and then recreating it from a Prefab File may seem costly, but it is only done in our Editor. In our Game build all of the prefabs have been baked into the level file and are instead loaded as normal objects.


By utilizing this our Level Designers were able to quickly begin the production of their levels, confident in that all of their white-box assets were able to be quickly replaced with new ones in their scenes. While there were some problems during the first iterations of the system, it has now been able to reach a stable state. I've also written a guide for those using it so I don't need to explain every single detail of it and to minimalize the risk for error.


- ImGuizmo Transformation -

ImGuizmo and their transformations are certainly... interesting...

They require a raw matrix to be passed in, which it then manipulates. This means we needed to decompose and then recompose our transforms into their matrix form and back. For those uninitiated this is a highly inaccurate operation and it is very error prone.

A video showcasing how error-prone ImGuizmo can be with Matrix Decomposition.


To solve this I implemented about 5 different error checks and handlers to make sure that the Matrixes never bugged out, which landed us on a fully functional Transformation Gizmo much like those in Unity and Unreal. It also features flawless multi-selection transform manipulation.


- Hierarchies -

Our Hierarchies came with all of the standard features that you'd expect.

We had:

Parenting & De-Parenting
Simple system for indentation in our hierarchies, had the standard functionalities outside of the hierarchy such as following the parent's transform and such.

Shift & Ctrl Selection
System for selecting multiple objects at the same time or adding/removing specific objects from the selection list. This was then interwoven with our pixel picking system in the scene window to allow the user to click on the objects in the scene with the same functionalities.

Drag & Drop
Drag an object to something else in the Editor, used for things like parenting or adding an object reference to another object.

Searchbar

Just a simple searchbar for quickly finding your objects. Given that they are properly named of course.


- File Browser -

Another baseline implementation, the file browser recorded all of the files in our asset directory on startup and has a small refresh wheel if you've changed something externally. You can then drag & drop from an external source to add files to the browser.

The browser then categorizes things based on the file types and allow you do to different kinds of drag & drop operations with them depending on the type. For instance; an animation cannot be dragged into the material slot of a model.


- Debug Drawing -

In our Engine and Editor I created a Line-Drawer for quickly drawing Debug Shapes in a performant way.

The base was given out as an extra implementation by TGA but I modified it to better fit our Engine and then made upgrades and an interface for our other programmers to use. The system is built upon either adding a shape every frame or adding a shape and returning a Handle which can be used to manipulate or remove the cached Debug Shape.


- Node Scripting -

 Another handout from TGA which mainly I modified, the Node Scripting system is based on the MuninGraph and allows our other disciplines to create Gameplay features on their own hand. It is similar to the Blueprint Event Graph in Unreal Engine.

By implementing a varied amount of Nodes we allowed our Level Designers to make gameplay by themselves, they gradually made requests for Nodes to be implemented and eventually the system had been quite expanded upon. Examples of such Gameplay features they've done is Moving Platforms, Pickups, Rotating Objects, etc.