Advertisement

Seeking advice on presenting game information

Started by October 09, 2013 12:31 AM
2 comments, last by King of Men 11 years, 2 months ago

I'm working on a turn-based, hex-based, 4X game. It is currently in a "playable" state, in that you can move armies around, recruit, attack, and there's a nod in the direction of supply lines. Much gameplay remains to be coded. Right now, though, I'm thinking of the interface. I've spent some time trying to reflect the game state in the main view, and am reasonably pleased with the engine, but the content needs a bit of work, and more to the point, input from someone who knows a bit about graphics. My screenshots, let me show you them:

overview_zps4291691a.png

This is a view of the main playing area, with an army selected - specifically, the one under the red banner. You can see the hex-line-vertex structure that forms the game surface, overlaid on green plains rising to a mountain in the center-right. If, like me, you know what's going on, you can also pick out villages, with their militia units and cows showing supply stockpiles, and the two castles. But none of this is very clear.

mainarea_zps71f11395.png

A different view of the playing area, offering perhaps some better idea of what's happening. Note the trees on the right.

closeup_village_zpsfc87028b.png

A closeup on a village. At this distance the chimneys that distinguish the houses from being blobs of wood are visible. Note the militia on the left, armed with pitchforks.

closeup_cows_zps243383e7.png

A closeup on the cows, indicating that this village has a largish supply stockpile. Note also the fields among the trees, in the center; at the moment they are in the "fallow" state, but will change colour as the turns go and the village works them. Turns are a week long.

closeup_army_zps3c1fd0d0.png

A closer view of the armies - distinct from the militias - showing the pikemen of the AI army, with their green banner, repeated on their uniform. In the background on the left, the archers and militia under the red banner of the human player; the archers get the banner on their uniform, the militia do not.


Now: I'm reasonably pleased with the way my graphics engine works, and with the sprites in a close view. What I'm not so happy about is how it all appears in an overview, ie zoomed out. Nothing stands out; you have to zoom in and fiddle with the view angle to extract any real information. So I'm open to suggestions. Could I have a better colour scheme? (The militia, especially, are a rather greyish blob at any sort of distance. Realistic-ish, but not very interesting.) Fiddle with the level of detail - abstract when zoomed out? (If so, I'd like to hear suggestions for how to present the same information: Size of the village, supply stockpile, size and unit type of the militia, and location/size/units of the field armies.) Something else?

To win one hundred victories in one hundred battles is not the acme of skill. To subdue the enemy without fighting is the acme of skill.

There's too much noise and not enough contrast.

eiGFnKp.png

You can barely pick anything out for all the similar values! I'd start with flatter colors and no noisy texture (never a good idea at the best of times), if I were you. Especially for testing purposes. And as for the grass; don't have squares the size of your units. No wonder it's hard to see.

Next thing; the values/contrast. Perhaps make all the factions lighter on top, sort of a vertical gradient from light > dark. That in itself will help them pop and their details/props a little more visible, but more importantly make sure it's much lighter than the grass. The brighter and warmer things are, the more they pop and become obvious (as a general rule. This can be messed with, but as you're not well versed with the fundamentals)... Subsequently, the things popping out here the most are the cows, as they are both the brightest and the warmest.

So to sum up:
Make the textures flat color (no tiling textures at this scale, it will only make things noisy, but perhaps some hand detailing or painting), make the floor darker and the units lighter.
Top/Light Bottom/Dark gradient on the units might also help a little.

(Like so: icdUkAf.png)


Finally, yes, your color scheme could also be improved upon. Right now it seems like you're picking colors at random based on what the real world equivalent's color is usually named (eg: trees = green, armor = sorta grey). A solid color scheme would also help the visibility issues, but I've nothing to suggest, sorry.

Advertisement

If you don't plan on having any kind of distance shading / shadows and want to use perspective views you're going to have a lot of work to do. When a grass/character pixel pattern in foreground is exactly the same color as grass/character pixel pattern many miles away the depth is very hard to perceive even though the pixel pattern gets resampled/scaled according to the distance. Maybe it's not so bad when you're on the move and the movement of the pixels give you some sense but marketing wise the still images are hard to read.

Have you tried a basic "fog effect"? I mean tinting pixels some color based on depth? That is how they did some of the earliest 3D games such as Doom. (screenshot, screenshot) Based on those couple screenshots you can imagine the importance that simple shader has to depth perception and reading shapes.

So to sum up: Make the textures flat color (no tiling textures at this scale, it will only make things noisy, but perhaps some hand detailing or painting), make the floor darker and the units lighter. Top/Light Bottom/Dark gradient on the units might also help a little.

Thanks, I will fiddle with this tonight. Perhaps having the terrain texture more fine-grained would also help?

Finally, yes, your color scheme could also be improved upon. Right now it seems like you're picking colors at random based on what the real world equivalent's color is usually named (eg: trees = green, armor = sorta grey).

*Coughs* Er, well, yes, guilty as charged. I'll have a bit of a think about this.

Have you tried a basic "fog effect"? I mean tinting pixels some color based on depth?

I haven't. Guess it's time to figure out how that OpenGL shader language works. Thanks for the suggestion. smile.png

To win one hundred victories in one hundred battles is not the acme of skill. To subdue the enemy without fighting is the acme of skill.

This topic is closed to new replies.

Advertisement