The Forums Are Now Closed!

The content will remain as a historical reference, thank you.

Demigod UI Design

By on August 4, 2008 4:27:28 PM from Demigod Forums Demigod Forums

I bet if I tell you that I'm Caryn Law and I'm the UI Designer on Demigod here at Gas Powered Games, your first question is, "UI? Who cares about UI?" Your second question is probably, "Those shoes. Seriously, where did you get those shoes?" I'm here to answer the first one (sorry, the second one is a state secret) and hopefully make you care about Demigod's UI, or at least understand why I care a lot about it. In fact, I'm kind of like the Dwight Schrute of UI (you know, the guy from The Office) -- I have a deep obsession that borders on creepy for a narrow subsection of game development that few others ever give a second thought to. Except hopefully I'm better at my job than Dwight is at his. And less creepy.

When you develop UI for a game that fits a specific genre, like an RPG or an RTS, you tend to stand on the shoulders of giants. Games with deep pedigrees that came before yours have already established a well-worn path in UI -- by now we know what an RPG or an RTS game interface looks like, don't we?

And that's what makes working on Demigod's UI so exciting. Demigod defies being pegged as one particular genre, which means it's both exciting and challenging to create its UI. UI is very often about conventions and sticking to them because we want our players to immediately be able to pick up our game and get right into the action without having to read a manual on how to control their characters or interact with things in the game world. But at the same time game UI is about the perfect marriage of those conventions with the actual gameplay design of your game. We have RTS elements, so we need to make sure that we use tried-and-true UI buttons and controls that RTS players will immediately be familiar with. But what if those RTS elements conflict with the RPG aspects that we have in Demigod? Can we make an interface that will be immediately comfortable to both RTS and RPG and action players? Aha! Now this is where my job gets real! (See, this is the part where I have to try not to be creepy.)

To accomplish this, I work very closely with our lead designer Mike Marr and the rest of the design team to work out all of the things that we need to provide the player in the UI -- things like your demigod's abilities and their inventory items, as well as the standard pieces of information like your demigod's health and energy levels. Early on in the game's development, all of these items in our list were whiteboxed into the game's HUD, meaning that they were put in with no actual art design, just pure functionality, and placed roughly where we thought they might need to be on the screen.

This is when our playtests become very important to what I do. Playtests allow me to work out any kinks or conflicts in the UI, and other members of the development team can give me feedback on how useful or not useful they found the UI layout and functionality. The ability buttons may be too small, for instance, given how important they are, or maybe the inventory items are too hard to access easily. Based on this continuous feedback from the team, we went through a couple of further whitebox iterations of the HUD to nail down our core functionality and screen layout.

Once we reach a point where we're pretty sure we've got most of the UI functionality in place (we never fully reach that, really, until late in the project since every game goes through lots of gameplay design changes through its development that affect the UI) we begin the art pass. At this point I start working with our lead artist Nate Simpson. Nate is like the General Eisenhower of art design: he's got a sweeping, top-down view of how the art style of every element of our game fits together, and while the technical side of UI is nearly all game design, the art side of UI has to fit into his vision. I create a series of style compositions, art'ing up the UI, so to speak, and give it the style I'd like to see that works well with its functionality. Nate then goes over those passes with his own art style, and together we create something that fits with Mike Marr's gameplay vision, my vision for good UI layout, design, and friendly functionality, and Nate's artistic vision for the game.

And that's part of what makes what I do so much fun. Sure, UI sounds boring on the surface, but there are so many moving parts to it -- I script the basic design and functionality (we use Lua in Demigod) and work with our engineers and designers to get things hooked up to the game engine, and I design some of the art and do the actual graphic design of the UI as well. It's a great blend of both the technical and the art, so I never get bored.

Those of you in the upcoming beta are going to be a critical component of helping me create the best UI possible for Demigod. Getting feedback on how the UI helps or hinders the gameplay experience is going to be key, so I'll be watching those forums. Hope to see you there!

- Caryn "Hellchick" Law

As a bonus, here are a few sketches showing I went through when developing the early stages of Demigod's UI:

Sketch 1


This sketch has a few shapes I was iterating on to try and test the relationships between some parts of the UI with other parts, like the health bars versus the ability and inventory buttons. Demigod is a unique blend of science fiction and fantasy in terms of art style, and I want to make sure we carry that through into the UI. What's that strange egg-shape thingy somewhere in the middle? I was trying out some shapes from the upper left, realizing that it wouldn't really work, and art lead Nate said that egg shaped health indicators with a heart in the center would make us the most emo-looking game on the market. I told him I thought he was on to something,  so I sketched little hearts coming off the health indicator, with sad faces to show that you're losing health and happy faces to show that you're gaining health. He didn't buy it.

Sketch 2


I'm trying to decide how I want the "target indicator" to look when you're fighting an enemy demigod. We know we want to set it apart from anything else in the game, so I'm trying different shapes and edges to help set it apart when it comes up.


Sketch 3


Here I was trying to come up with some basic icon design for our abilities. Abilities are a common RPG item, and while many games have really pretty, painted icons for their abilities I wanted to kind of set ours apart a little and come up with something that was based more on really strong silhouettes. We actually did this for our first round of ability buttons (I think those people in the beta will see them) but we're discovering that while the button imagery looks really awesome thanks to Steve Snoey, who took my basic concepts and turned them into actual icons, it's too easy to make them all look really similar. So these will be getting another revision.

+2 Karma | 53 Replies
September 10, 2008 6:28:06 PM from Demigod Forums Demigod Forums

"Oomiegoo" = Oh my God?

Would be very interested to see more of the principles of UI design.

September 11, 2008 1:42:32 AM from Demigod Forums Demigod Forums

Quoting Nights Edge,
"Oomiegoo" = Oh my God?

nope! close though!

September 27, 2008 12:30:03 AM from Demigod Forums Demigod Forums

Oh my Demigod?

Stardock Forums v1.0.0.0    #108434  walnut1   Server Load Time: 00:00:00.0000125   Page Render Time:

Stardock Magazine | Register | Online Privacy Policy | Terms of Use

Copyright ?? 2012 Stardock Entertainment and Gas Powered Games. Demigod is a trademark of Gas Powered Games. All rights reserved. All other trademarks and copyrights are the properties of their respective owners. Windows, the Windows Vista Start button and Xbox 360 are trademarks of the Microsoft group of companies, and 'Games for Windows' and the Windows Vista Start button logo are used under license from Microsoft. ?? 2012 Advanced Micro Devices, Inc. All rights reserved. AMD, the AMD Arrow logo and combinations thereof are trademarks of Advanced Micro Devices, Inc.