User Interface in progress

Amongst the various things that can take a lot of time when developping a video game, you can find the user interface, aka UI. In many games, it’s one of the major way used to interact with the game, when it’s not the only one. Thus, it’s *kind of* an important task to complete. It’s not usually a complicated one, but it requires a lot of time considering the amount of features it needs between the simple variety of controls needed, and the many game windows and popups to create.

Here is what it’s looking like at the moment :

UI controls, UI controls everywhere!

On the left you can see an item detail panel. This one is a test, it’s not linked to real data, which is the reason why it’s still incomplete. It’s the control I’m working on at the time.

On the middle, there is a test inventory window. It can move freely within the bounds of the screen, contains a text button and a checkbox, both working the way one could expect. More interesting, the bottom part of the window is a “container”. If you’ve ever played to a RPG, especially online ones, you should know fairly well what it does : represent an inventory and the used/available storing space.
Items inside a container can be activated (e.g, : use a potion, a scroll, etc) or moved between different slots of the same container for reordering purpose.

If you look at the bottom and right of the screen, you can see two skillbars. Both contains a container. The difference between the inventory container and those of the skillbars is that the later only contains “shortcuts” to items (or skills). It’s possible to drag-and-drop an object from the inventory to a skillbar.
If you’re attentive, you might notice on the right skillbar an image button above it : it’s the rotation button, used to switch between horizontal and vertical display. The skillbars can be moved like any window.

I still have add tabs, radio buttons, tables, listboxes and comboboxes. The scalability is not complete at the time (only window and buttons works with it). More interesting – I guess – the UI is already fully skinnable. I use an external XML to describe the graphical elements.

In case you were wondering, the weapon icons and UI skins are tests. I won’t keep them as they are now.

And that’s all for now :)

Leave a Reply

Your e-mail address will not be published.