FreeOrion

Thanks! You've done the tedious graphic work, I've just done some touch ups.

Do you have those in a higher resolution maybe? They current ones are by no means meant to be included into freeOrion. It's always better to work in a higher resolution and scale down later.

I'm glad you agree about the placement as well.

Such a mockup is here. An issue at the time, that I don't think was really addressed, was that putting the specials icon to the right of the planet name might not leave enough room if there are more than a few icons. Particularly for a long planet name and three or more icons, it might be an issue. The alternate suggestion of having a little asterix next to the name that would indicate that specials would be shown elsewhere isn't very appealing either, as the icons need to be immediately visible.

So, if there's a reasonable way to handle the case of a few more icons in the space to the right of the planet name, then we could move them up...


Agreed. Nice job, both of you.

I've finished those icons. Once again, thanks Silent for the ground work.

24x24


64x64


Here is a mockup showing the small icons next to the planet name and the large one in the tooltip popup(Is this possible?)


If there is not enough room for the tiny icons, maybe we could add an extra row, right below the name? Is there a limit of how many specials a planet can have? I haven't seen more than 4 at the same time until now.

The icons can downloaded here.

These are top-notch. Excellent work!

I don't believe it's possible at present to put any pictures into the tooltips. tzlaine can confirm.


Can I get a mockup?

Also, note that the resource icons scale with the font size. How should the special icons be sized, in comparison? They can be the same size as (scale with) the resource icons, or slightly larger to match the planet name font size? If the latter, should the name be a bit bigger than it is not for a given UI font size setting (ie. relative to the meter numbers)?


No. In practice, there should rarely be more than 2, let alone more than 4, but we should have something set up for the possibility of it occurring.

Whoa, lets take a step back and look at the big picture.
The new treatment looks better if we were going to frame these and put them on a wall, but the style needs to support the function of the icon. Look at the icons in the sidebar. They DOMINATE the sidebar. The size is too big for that context, and the flashiness is too much.


Geoff raises some important points.
IMO the hight of this icons (if placed in the sidebar) should match the height of the planet name (currently ~13 pix). That hight might be increased by a few pixels, but very quickly that leads to too little space for the planet's name or icons.
At any reasonable hight the air-brushy treatment will hurt the "legibility" of the icon. If we limit the planetary names to about 16 characters we can fit about 6 13x13 icons next to the planet's name. Of course we might fiddle with the scale and give more/less space to the icons, but i think this general range could work.

A slightly larger size can work under the planet, as is currently, but i favor the position next to the name as long the outside number of icons doesn't overlap a reasonably long planet name. Of course if we do this, there should be a cap on the number of characters in a planet's name.

_________________
—• Read this First before posting Game Design Ideas!
—• Design Philosophy
—•— My Ideas, Organized —•— Get an Avatar —•— Acronyms —•—

The width of the sidepanel can likely be made adjustable. If you increased the font size (and remember, you can do so) it would cause long planet names to extend too far right, and (since icons enlarge with font size) icons to extend too far left... But if this was a problem, you could extend the sidepanel left, causing all its contents to widen or enlarge appropriately, and in particular making more room for the name and icons side-by-side.

System resources are shown in 2 rows, so there is no longer overlapping. The icons could even be enlarged again. This rescaling by code looks like crap.

Colonized planet names are bolded, to pop out some more. Especially with this blue color it's hard to read, if not.

There is an extra row, just for the special icons, they are aligned to the left.

The colonize button is moved at the bottom and centered. This way there is no longer overlapping and free space is used much better.

eleazar: Yes, those icons are shiny and I've explained why they are previously. Yes, they are popping out and this is what an indicator of something special should do. I don't want freeOrion to look like Excel in space, so this is what I'm continue going to do.
The resource icons are pretty dull(as the planets, btw) and could get some pollishing as well. They should be enlarged too, IMO.
The thing with those icons is, that they convey some pretty complex subjects and you can't do this with a 16x16 pixel blob of color.

Perhaps the special icons could be made a little smaller, but don't do it by code! I've used 24x24 because I thought that's the size we are using and I think it is the right size.

I suggest considering replacing the wheat food icon as well. I'm not sure what should replace it, but I've never liked that icon...


Note that the resource icons next to the meter bars for each planet scale in size with the UI font size... so you can enlarge them by increasing your font size.

If the current icon size is too small at a given font size, then it can perhaps be tweaked, but the icons already barely fit into the space between text lines with the current scaling.


As much as possible, I'd like to retain the resolution-independence that code-scaling of images allows. If these and similar icons have to be fixed-sized, it's unfortunate, as they won't fit in as well as the UI around them scales. (Though obviously we'd pick a reasonable default scale at which the fixed size icons do fit fairly well...)

pd, these icons look great. It may not match the current style, but if work continues in this direction perhaps the rest of the game's style will catch up to this kind of quality.



Forgive me if I'm missing the point - but resolution independence can be maintained by having fixed sizes for certain elements or sections, while the main screen can be any size. A few examples:
* A website fixes the width of the left hand menu, but allows the main content area on the right to scale to any size
* A game like civ has the panel at the bottom take up the same number of pixels at any resolution, but the main game window where you see your empire scales to any size

This way fixed sized images can be used effectively at any resolution. The only main downside that I can see is that at larger resolutions they may appear to small to the eye - but then such a user has the freedom to use a smaller resolution if their eyesight isn't good enough.

I agree, on some occasions rescaling the UI elements is desirable - take the tech screen as an example: at larger screen resolutions, you'd be able to recognise the tech icons much better. The point is, would it be hard to find/borrow an algorithm that does a better and efficient rescaling job? Maybe we could adopt some of the source code of the GIMP?


In some situations, this may also be the way to go. I can't think of an example right now, but I don't think those two ideas are mutually exclusive.

In the case of an icon that is next to some text, the text and the icon probably need to scale with eachother to not look silly. I suppose this isn't really "resolution independence", in that the resolution and the font size aren't strictly linked, but in general I would expect someone with a much higher resolution to be more inclined to use larger font sizes than someone near 1024x768.


Not everyone can resize their screen, particularly if they're using an LCD or other display with a native resolution. Also, if FreeOrion is running in a window, it can't expect the resolution to be reset for it, so it shouldn't depend on the physical pixels being a certain size.


I think tzlaine mentioned something about the scaling being done by OpenGL or in hardware or some other reason why it couldn't easily be replaced. You'd have to ask him, though.

I second what Tyreth has to say.

I'm using 1600x1200 as screen resolution by the way and I'm fine with the text size(12). But the icons on the sidepanel are just too small compared to the text. I don't see a reason why the icons can't be a little larger than the text. If they don't fit between the lines, well make the lines heigher... Bascly what I'm saying is, that the relationship isn't right. A letter or number might read at this size, but an icon hardly does.

Coming back to some questions asked:


They should either be fixed, what I would favour or shouldn't be any smaller than 24x24 and then scale up with the fonts, which is not necessary, if they are in a seperate line/row.


That's a general assumption, which is only partly true for our case. I've mentioned it previously, but I'll do it again: I don't believe, you can read the meaning of those icons as they were previously and at a size like 13x13. You will have to learn the meaning anyway(using tool tips). And what then counts, is the ability to remember and distinguish the icons. This is so much easier having colorful, shiny, 'airbrushy' icons than tiny, dull monocolored icons. Putting color in there, I can even put more information in there, than one can with graphical, absract shapes.

When i mention pixel dimensions, i'm referring to how things should look on a 1024x768 screen.
It's fine if things take up more pixels on larger screens, but that's an entirely different issue.



By "legibility" i don't mean that the user magically knows what the icons represents. The user will have to learn the meaning, (or check tooltips) no matter what the size.
A "legible" i mean the forms and shapes are distinct and easy to recognize. My complaint with the airbrushing technique used here blurs edges, makes form less distinct.

Look at any professional favicon, or the smilies in this forum, or small element of your OS's UI.
BTW, How many hundreds of Favicons can you easily differntiate at 16x16? It's quite possible to make a distinct image at that size or a few pixels smaller.

There may be be gradation in value, but you find relatively few colors, and the major shapes are distinct. Simply adding more colors and more variations of lightness does not make an icon better. The distinctness of the primary forms is most important.

_________________
—• Read this First before posting Game Design Ideas!
—• Design Philosophy
—•— My Ideas, Organized —•— Get an Avatar —•— Acronyms —•—