0.3 Tech Category icons

Development of artwork, requests, suggestions, samples, or if you have artwork to offer. Primarily for the artists.
Post Reply
Message
Author
User avatar
Tyreth
FreeOrion Lead Emeritus
Posts: 885
Joined: Thu Jun 26, 2003 6:23 am
Location: Australia

0.3 Tech Category icons

#1 Post by Tyreth » Mon Jan 24, 2005 1:36 am

For 0.3 we need tech icons, one for each of the categories. As a reminder, these are:
* Growth
* Learning
* Construction
* Production
* Economics

We want these as 128x128 so that they scale well. We need them to look good scaled to 16x16.

Tzlaine said:
I'd like them to be 128x128. They should look good scaled to about 16x16, though. This is to accomodate viewing them in the detail window, as well as in the tech-panels in the tech graph.
Thanks.

User avatar
Mystiqq
Space Kraken
Posts: 119
Joined: Mon Oct 18, 2004 3:37 pm

#2 Post by Mystiqq » Sun Feb 13, 2005 1:28 pm

Is there any tech screen done yet, i could try to make something but id like to have something to "make them for", if you know what i mean. So i could have some idea where to fit the graphics to, it would be lot better to work with.

Also are the icons suppose to be something similar to what has been suggested in this topic?
viewtopic.php?t=866

Cheers...

User avatar
Geoff the Medio
Programming, Design, Admin
Posts: 12423
Joined: Wed Oct 08, 2003 1:33 am
Location: Munich

#3 Post by Geoff the Medio » Sun Feb 13, 2005 2:22 pm

Mystiqq wrote:Is there any tech screen done yet
There is:
Image
Also are the icons suppose to be something similar to what has been suggested in this topic?
viewtopic.php?t=866
Yes and no. tzlaine / Tyreth were asking about icons for the categories, not the individual techs. These icons will likely replace the text in the buttons (or rather, the buttons entirely) on the above image that allow the player to switch between categories ("Growth", "Production", etc.) being displayed on the tree view below the buttons. I imagine there'll be some other use for the category icons as well.. . though what I'm not sure. Some sort of "ALL" icon would be good too, if you can figure out how to represent "ALL" in icon form...

The style of the icons is undecided, but I'd suggest having each one have a clear colour predominant, and have these be similar to the colours of the existing resource icons that can be seen at the top of the screenshot (Growth = Yellow like Farming / Food, Production = Red or Blue or a mix thereof since Minerals are Red and Industry is Blue, Learning = Green like Research) and to use Grey for Construction, and I'm not sure what for Economics... maybe Brown or whichever of Blue or Red didn't get used for Production, or Cyan or Majenta/Purple.

User avatar
Mystiqq
Space Kraken
Posts: 119
Joined: Mon Oct 18, 2004 3:37 pm

#4 Post by Mystiqq » Sun Feb 13, 2005 7:29 pm

Few questions and my first attempt on the learning category icon.

Regarding the scaling, what kind of scaling are we talking about? In-game or pre-scaled in ie. photoshop or such? As i understand, there wouldnt be much anti-aliasing effects if done in-game?

How about transparencies, are you using alpha channel or perhaps some color that defines the transparent areas? or is there no transparencies?
and what image format should i save these?

Also you mentioned that "growth = yellow like farming / food". does this mean that the growth in this case is growth of "food" and not eg. population or anything such?

Im gonna read a bit more about this later on, so i might find something on my own if they exist in these forums, but atm if its possible i could use the above information i asked. :)

Heres my first attempt, not sure if it is the best one, thou ive got some other ideas ill try out, but heres the current. Am i on the right tracks? I liked the SMAC style so i used that.

Image

This one scales pretty nicely, but at 16x16 level (or so) it needs some sharpening at least when scaled within photoshop. Used illustrator and photoshop to make this, if anyone cares :) .

Cheers...

User avatar
Geoff the Medio
Programming, Design, Admin
Posts: 12423
Joined: Wed Oct 08, 2003 1:33 am
Location: Munich

#5 Post by Geoff the Medio » Sun Feb 13, 2005 7:52 pm

You might want to email tzlaine about this... I'll answer what I can though...
Mystiqq wrote:Regarding the scaling, what kind of scaling are we talking about? In-game or pre-scaled in ie. photoshop or such? As i understand, there wouldnt be much anti-aliasing effects if done in-game?
I suspect the scaling will be done in-game, though if you provide pre-scaled, hand-touched up versions for specific uses / locations in the GUI, I suspect they could be specially used where intended.
How about transparencies, are you using alpha channel or perhaps some color that defines the transparent areas? or is there no transparencies?
and what image format should i save these?
FO uses the PNG format (either mostly or exclusively), which includes an alpha channel, and you should save images in that format, and they will be rendered in game using the alpha channel appropriately.
Also you mentioned that "growth = yellow like farming / food". does this mean that the growth in this case is growth of "food" and not eg. population or anything such?
The Growth category currently covers anything related to population growth, including food production, medicine, public health, bio-augmentation, cloning, etc. Later, we might add some migration or colonization stuff as well, if it seems appropriate. However, a major "theme" of the effects of techs and buildings that become available in the Growth category will be to increase the Farming meter of planets, which determines how much food they produce, so I figured the colour of the food icon (yellow) might be good for the Growth category icon as well. This is just a suggestion though... if you have a better idea, feel free. Actually, it would be best if the colouration was just "extra" and the icons were completely distinct and clear if shown in black / white or shades of grey.
Image
Looks nice to me (though miu will be the judge).

I'd suggest making the icons less "busy" though. There's too much "brain stuff" going on in there. If you look at the SMAC icons, they're generally fairly simple, with a few clean edges separating large simple shapes, or limited complexity mostly at the edges between large areas of solid colour, rather than a jumbled mix of intertwined lines. IMO it'd be nice if one could draw the icons from memory, without having to resort to "filling space" with an innacurate approximation / thematic representation of what was in the original... (again though, that's just me...)

I posted some SMAC icon shots here:
viewtopic.php?p=14371#14371

Edit: OH! And remember, many (in fact, most) races in FO probably won't be humanoid... so a human head might not be the best choice for an icon that will be seen regardless of player race(s).

User avatar
Mystiqq
Space Kraken
Posts: 119
Joined: Mon Oct 18, 2004 3:37 pm

#6 Post by Mystiqq » Mon Feb 14, 2005 7:15 am

I'd suggest making the icons less "busy" though. There's too much "brain stuff" going on in there. If you look at the SMAC icons, they're generally fairly simple, with a few clean edges separating large simple shapes, or limited complexity mostly at the edges between large areas of solid colour, rather than a jumbled mix of intertwined lines. IMO it'd be nice if one could draw the icons from memory, without having to resort to "filling space" with an innacurate approximation / thematic representation of what was in the original... (again though, that's just me...)
Personally id like to see some minor details, such as the ones i have on the brain, for relatively big icons like this one. Making a really nice and good looking icon that scales flawlessly between 16x16 and 128x128 seems to be a bit difficult.

Id suggest making at least 2 different stypes of icons, one for scaling between 16x16 to 32x32 (or so) and one for bigger ones. Making these after you have the idea that works as small as 16x16 and so on, it isnt really a problem to pre-scale these if it will produce better quality icons ingame.
Getting an inspiration and a good idea, those are the real problems at the moment. :)

My first test versions didnt have any "brain stuff" details and it felt like its missing something. Thou the icon works better as small image without the details, but id rather remove the details for smaller sizes and have little bit of details for bigger ones.
Also i had another idea that had a "book thing" going on, but it ended up looking/feeling more like something out of a fantasy game.
Edit: OH! And remember, many (in fact, most) races in FO probably won't be humanoid... so a human head might not be the best choice for an icon that will be seen regardless of player race(s).
I actually thought about this, but it adds whole new "restriction" for the idea(s) you can use for making this icon. At least for me, its already little difficult to comeup with decent ideas that work.

This is the best idea ive come up with that at least little fits to the "learning" theme or context (or something).

Also i think the whole idea of these icons are to make the player to easily regognize what these icons represent? I dont feel like it lessens the "immersion" of the game or anything. The icon looks like something "scientific" which i think is a good thing. :)

Any ideas are welcome, getting an inspiration is pretty difficult. Especially for the Economics icon, i havent had any real ideas what so ever what to try out for that one.

Heres a scaling test done, no sharpen added except for the last one. First and last (left to right) are the 128x128 and 16x16 scaled ones.

Image

EDIT:
Heres how it looks at the moment... just small adjustments. Mainly to make it look nicer in smaller scale.
Image

I think the icon works pretty nicely, thou i really think i should take out the brain details out in the smallest ones.
Im going to try to make some tests, taking out the human looks but i think the whole "brain" thing is what im gonna leave more or less intact.

Currently im working on the learning (obviously) and growth icons.

PS. Where can i suggest ideas for that techscreen?

User avatar
noelte
Juggernaut
Posts: 872
Joined: Fri Dec 26, 2003 12:42 pm
Location: Germany, Berlin

#7 Post by noelte » Mon Feb 14, 2005 8:43 am

@Mystiqq, geoff is right about graphics.

fo can scale images (buildin) so if you only provide one image it should be the one with the highest res. (power of 2) IMO, a whole bunch of images f.i. 1024x1024, 512x512, ..., 16x16 is a wast of memory. So i guess two images would be the right way, maybe 128x128 and 16x16, but it always depends on where those images are used and at which res.
Press any key to continue or any other key to cancel.
Can COWs fly?

User avatar
Mystiqq
Space Kraken
Posts: 119
Joined: Mon Oct 18, 2004 3:37 pm

#8 Post by Mystiqq » Mon Feb 14, 2005 9:40 am

Only thing im really curious about is how is this scaling done, mainly what kind of "method" it is. In the "photoshop terms", what kind of "image interpolation" will it use? or will it use any at all.

Regarding the sizes, id say 128x128 and 32x32, depending of course on how the scaling will be done. If the scaling method kicks ass, it might be easily possible to have just one image. If not, i wouldnt compromise quality over memory, i mean how much can extra 16x16 (or so) image take.
@Mystiqq, geoff is right about graphics.
Right about the "brain stuff" thing? Should i remove the details? or do you mean something else he said...

Awww... i like those brain thinggies. ;)

User avatar
utilae
Cosmic Dragon
Posts: 2175
Joined: Fri Jun 27, 2003 12:37 am
Location: Auckland, New Zealand

#9 Post by utilae » Mon Feb 14, 2005 9:43 am

Let's come up with some ideas of what kinds of icons we should have for each category and get people to draw them.

Growth
=plant,
Learning
=books,scrolls
Construction
=building
Production
=factory
Economics
=money

User avatar
Geoff the Medio
Programming, Design, Admin
Posts: 12423
Joined: Wed Oct 08, 2003 1:33 am
Location: Munich

#10 Post by Geoff the Medio » Mon Feb 14, 2005 10:09 am

Mystiqq wrote:Personally id like to see some minor details, such as the ones i have on the brain, for relatively big icons like this one. Making a really nice and good looking icon that scales flawlessly between 16x16 and 128x128 seems to be a bit difficult.
It's a aesthetics judgement call obviously... I find that an overly busy icon just looks... well... busy. And I'm also not really sure why tzlaine asked for 128x128 icons; I can't imagine where we'd use an icon that big in the actual interface... And even if we do, most of the time, the icon will be scaled down significantly... so looking good at 32x32 or 16x16 is probly the most important... at which size, lots of tiny details probably won't show up. Since large clearly defined shapes will look at least semi-good at any scaling, that's partly why I prefer them to lots of busy details.
My first test versions didnt have any "brain stuff" details and it felt like its missing something. Thou the icon works better as small image without the details, but id rather remove the details for smaller sizes and have little bit of details for bigger ones.
Also i had another idea that had a "book thing" going on, but it ended up looking/feeling more like something out of a fantasy game.
Maybe try a more tech-ish representation for knowledge... like a lightbulb shape?
I actually thought about this, but it adds whole new "restriction" for the idea(s) you can use for making this icon. At least for me, its already little difficult to comeup with decent ideas that work.

This is the best idea ive come up with that at least little fits to the "learning" theme or context (or something).

Also i think the whole idea of these icons are to make the player to easily regognize what these icons represent? I dont feel like it lessens the "immersion" of the game or anything. The icon looks like something "scientific" which i think is a good thing. :)
The representation can be stylized... Civ games use a little lightbulb icon to represent research points and tech progress, even if you're in the bronze age. Lightning bolts of inspiration or thought bubbles might also work. Maybe a lightbulb in a thought bubble?

One thing you could do is just have the brain, and not the humanoid head around it. While other forms of life wouldn't necessarily have human-shaped brains, it's at least not quite so obviously human-centric...

And some of the techs in the Learning category, or at least the suggested techs, are specifically about moving beyond simple biological brains... so a brain icon might be a bit odd.

FYI, you can read through the suggested techs for each category on the relevant DESIGN threads on this forum:
viewforum.php?f=15
Any ideas are welcome, getting an inspiration is pretty difficult. Especially for the Economics icon, i havent had any real ideas what so ever what to try out for that one.
For Economics, maybe a grid background with an an angled line moving form bottom left towards top right with an arrow point, with a few dips and jumps, looking a bit like a stock history graph...
Image
PS. Where can i suggest ideas for that techscreen?
The thread discussing it is here:
viewtopic.php?t=980

You can also post a feature request on the sourceforge page:
http://sourceforge.net/tracker/?group_i ... tid=544945

If you want a major change or complete overhaul though, you're probly out of luck, as tzlaine has already implemented the screen. Cosmetic additions (some of which I've already suggested and/or had implemented) are more likely to be acted upon though.

edit: noelte answered question below /edit
@Mystiqq, geoff is right about graphics.
Right about the "brain stuff" thing? Should i remove the details? or do you mean something else he said...
I think he mean the format (PNG)...
Last edited by Geoff the Medio on Mon Feb 14, 2005 10:17 am, edited 1 time in total.

User avatar
noelte
Juggernaut
Posts: 872
Joined: Fri Dec 26, 2003 12:42 pm
Location: Germany, Berlin

#11 Post by noelte » Mon Feb 14, 2005 10:14 am

Mystiqq wrote: Only thing im really curious about is how is this scaling done, mainly what kind of "method" it is. In the "photoshop terms", what kind of "image interpolation" will it use? or will it use any at all.
We use DevIL, see http://openil.sourceforge.net/
Press any key to continue or any other key to cancel.
Can COWs fly?

User avatar
Mystiqq
Space Kraken
Posts: 119
Joined: Mon Oct 18, 2004 3:37 pm

#12 Post by Mystiqq » Mon Feb 14, 2005 10:16 am

At the moment, i have a tree style thing for the growth icon, but its still WIP.

I dont like the "learning - books scrolls" idea, they just dont fit in. I might be wrong thou, but as ive got 16x16 open book done as a test, it really looks like it belongs to a fantasy/rpg or something in that area. Also has the usual problem of looking good as smallest as in biggest size.

Also i cant think anything that could represent "economics - money". One that is simple and looks good in 128x128 size too... well i have one, but i donno. :)

For construction, ive got small idea about a "wrench thing"... not sure if it will fit but im sure as hell gonna at least try it out. :P

User avatar
Mystiqq
Space Kraken
Posts: 119
Joined: Mon Oct 18, 2004 3:37 pm

#13 Post by Mystiqq » Mon Feb 14, 2005 11:11 am

It's a aesthetics judgement call obviously... I find that an overly busy icon just looks... well... busy. And I'm also not really sure why tzlaine asked for 128x128 icons; I can't imagine where we'd use an icon that big in the actual interface... And even if we do, most of the time, the icon will be scaled down significantly... so looking good at 32x32 or 16x16 is probly the most important... at which size, lots of tiny details probably won't show up. Since large clearly defined shapes will look at least semi-good at any scaling, that's partly why I prefer them to lots of busy details.
True. Personally the picture looses some interest if theres no details at all, especially if the picture used is relatively big. At the moment im making these icons in away that the details dont play a huge role in the picture, you can remove them from the smaller images and they still look like the "original".
At least i think im doing that... :)
Maybe try a more tech-ish representation for knowledge... like a lightbulb shape?
Lightbulb thing sounds boring IMO, but it might work. Sounds easy to make so i might give it a try...
New ideas, at least new for me, are always welcome.
The representation can be stylized... Civ games use a little lightbulb icon to represent research points and tech progress, even if you're in the bronze age. Lightning bolts of inspiration or thought bubbles might also work. Maybe a lightbulb in a thought bubble?
Interesting, thou i liked the lightbulb only idea better...
One thing you could do is just have the brain, and not the humanoid head around it. While other forms of life wouldn't necessarily have human-shaped brains, it's at least not quite so obviously human-centric...
I thought about this too. Problem for me is, how to make it not look like a just a "blob" on the screen. :)
Its idea, but i need to think about it a little. If the head is removed, there has to be something else to replace it. Otherwise, like i mentioned, it just looks like a "blob".
And some of the techs in the Learning category, or at least the suggested techs, are specifically about moving beyond simple biological brains... so a brain icon might be a bit odd.
I dont think thats the correct way to look at it. The icon is suppose to represent the "learning", if the techs in that category dont fit to the learning then theres something wrong in the tech placement.
I might be wrong and just talking out of my ass but im pretty confident about this one. :)
For Economics, maybe a grid background with an an angled line moving form bottom left towards top right with an arrow point, with a few dips and jumps, looking a bit like a stock history graph...
Nice... i gonna try and work something out from that, at least ive got something to start with.
If you want a major change or complete overhaul though, you're probly out of luck, as tzlaine has already implemented the screen. Cosmetic additions (some of which I've already suggested and/or had implemented) are more likely to be acted upon though.
No, nothing major. I like how it is at the moment, its just very small suggestion that i think should be feasable to implement and could give some (more) work for the gfx people. ;)

Thou i think i posted it in the wrong forum...
Nice, thanks. Im gonna check out if theres any info that i can understand.

User avatar
Geoff the Medio
Programming, Design, Admin
Posts: 12423
Joined: Wed Oct 08, 2003 1:33 am
Location: Munich

#14 Post by Geoff the Medio » Mon Feb 14, 2005 11:34 am

Mystiqq wrote:
And some of the techs in the Learning category, or at least the suggested techs, are specifically about moving beyond simple biological brains... so a brain icon might be a bit odd.
I dont think thats the correct way to look at it. The icon is suppose to represent the "learning", if the techs in that category dont fit to the learning then theres something wrong in the tech placement.
I didn't say they weren't about learning, I said they weren't about biological brains.
If you want a major change or complete overhaul though, you're probly out of luck, as tzlaine has already implemented the screen. Cosmetic additions (some of which I've already suggested and/or had implemented) are more likely to be acted upon though.
No, nothing major. I like how it is at the moment, its just very small suggestion that i think should be feasable to implement and could give some (more) work for the gfx people. ;)

Thou i think i posted it in the wrong forum...
Hence my pming you to indicate this... it should go on this thread:
viewtopic.php?t=980

You can delete the post on the wrong thread if nobody's replied to it yet, though as I said in the pm, the post is probably relevant to the production UI as well...

User avatar
Mystiqq
Space Kraken
Posts: 119
Joined: Mon Oct 18, 2004 3:37 pm

#15 Post by Mystiqq » Mon Feb 14, 2005 4:13 pm

Attemp on the production icon.

Image

Not much details, looks nice when small but little empty when in 128x128 or so... the color is not right in this one.

Post Reply