MD2 Entities

This week I’ve been working on revamping the old OBJ and MD2 importers to support the new Entity system. I originally wrote these loaders back in 2010 and, although the parser/loader code worked without any changes, I decided to revamp the external interfaces to make it easier to select the correct loader depending on the file type.

Importing a MD2 model with texture into the Vortex Editor.

Importing a MD2 model with texture into the Vortex Editor.

The image above shows how easy it is now to bring a Quake II MD2 model into the editor. We start by importing the files into the asset library. Then drag and drop the MD2 file from the library into the 3D world and -voila- a new Entity is created.

Using the properties panel, we can adjust the Entity’s transformation and set the texture file for the material. This process is definitely much simpler than than what it used to be, back when we had to load the model through code and then feed its vertex arrays into the GL.

The plan for next week is to wrap up MD2 support by implementing better control for the format’s animations, and then we will be off to new better things!

Stay tuned for more!

Bring in the Assets!

This week I worked on a way to bring in external assets into the Editor.

Importing an external image into the editor and texturing a cube.

Importing an external image into the editor and texturing a cube.

The way this works is by means of a new import tool in the UI. Import allows the user to select any set of files to copy into the project’s resource directory. Once in the project, resources are shown in the new Library View from where they can be accessed.

What can you do with the assets you bring into the project?

For 3D assets, when dragged onto the 3D view the Editor will instantiate a new entity. This new entity will appear in the entities list view and can be manipulated like any other entity.

For Image assets, these can be assigned to materials to change the appearance of entities in the scene. The figure above show how we can bring a JPG file into the Editor and use it to texture a box we create from the Entity menu.

Designing the Asset Library UX

I tried different designs for the library view, starting with a simple list that would show the asset’s name, type and preview, but I ultimately decided to simplify the interaction and settled for a tree view.

It was hard to throw away the initial tabular design I implemented, but I believe going with the tree view was ultimately the right choice.

Once I had the library view, the first thing I wanted to try was whether dragging assets from it onto the 3D world and other widgets would be feasible. I thought this feature would be troublesome to land, however, I was very pleased to see the implementation come together rather quickly.

Drag and drop is a great interaction because it prevents taking the user out of context when she wants to assign a value to a widget or other UI element.

Putting the picture together

If we take a step back, we can now start to see how these features are coming together to help bring the WYSIWYG experience to the Editor.

If you recall from our first post in the Vortex Editor series (click here to quickly jump there), one of the main objectives of this project was to allow simplifying the way we assemble scenes for the Vortex Engine.

Having now a Resource Library and a way to visually edit Entity properties, look at how much simpler it is to create a scene from scratch:

  1. First, we start the Editor, click File -> Import Assets.
  2. Then, we select the assets to bring into the project (for instance, a few obj files).
  3. After this, we simply drag the imported obj file from the Library onto the 3D view. This will create a new Entity.
  4. And Finally, we adjust the new Entity’s properties (position, rotation, scale) to our liking and drag image assets to texture them. That’s it!

The whole process is very visual, allowing the user to see the scene at all times and (hopefully) unleashing her artistic creativity by allowing quick improvisation and trial and error. It feels much more fun than having to be tweaking a series of float values intermixed with C++ code and recompiling every time.

Having reached this initial milestone, the plan for next week will be mostly polish work for these features, improving project resource management and further cleaning up the internal architecture.

Stay tuned for more!

Entity transform via the Properties Panel

This week I finished implementing full edition of Entity transformations by means of the properties panel.

Five boxes showcasing different transforms set via the properties panel.

Five boxes showcasing different transforms set via the properties panel.

In the above image, five box instances were dynamically created and then moved, rotated and scaled using nothing but the transform panel. This is a big milestone that will allow, from now on, assemble complete scenes to be rendered with the engine without having to tinker with the transformation values in code.

Now, a common piece of feedback that I’ve been receiving during this series is whether the editor is capable of rendering something other than boxes. Because the editor is powered by the full Vortex Engine, it can load and render a number of file formats out of the box.

With the ability to assemble scenes dynamically, we can now start bringing in external geometry in the form of entities and build our setup from them. This coming week I’m going to be working on better Entity support for external meshes and start bringing them into the editor.

Stay tuned for more!