Transport Tycoon Forums

OK, been trying to think about the icons for the new graphics engine. I haven't done much so far, I'm not really good at this. But thought I'd post a little of what I'm doing.

Existing icons (22x22 pixels - 100%):



Proposed icons (44x44pixels - 200%):
PLAY:


PAUSE:


FAST FORWARD:


SETTINGS/OPTIONS:


SAVE:


DISPLAY MAP:


FINANCE:


GRAPH:


RAIL:


ROAD:


ZOOM IN:


ZOOM OUT:


SOUND/MUSIC:


NEWS REPORTS:


LAND INFO:


Proposed icons (22x22pixels - 100%):

Nice buttons I must say although the spanner doesnt really seem to fit in (colour wise)?

They looks good, but IMO they are too big. They should maybe be 66% of that.

Yes, i agree, they are slightly too big, or is that just an impression?

Looking good though
James

I think spanner fits better, unless your screwing bolts in a car tighter with a cog(just a example)..

Yes, I'm aware the icons are too big. But I wanted to post them here a little bigger so you could actually see what I was doing. No way would they be this big in the game

yeah they look good to me, what owuld they look like with a drop shadow under things like the play button...

2d is the way to go for these BTW

and one last thing, you will also need to come up with how "hover" and "clicked" look for all icons, they will need all those states. (wheter that is somthing you need to draw, or somthing the compositing engine needs to deal with i dunno.

Alltaken

Alltaken wrote:yeah they look good to me, what owuld they look like with a drop shadow under things like the play button...

2d is the way to go for these BTW

and one last thing, you will also need to come up with how "hover" and "clicked" look for all icons, they will need all those states. (wheter that is somthing you need to draw, or somthing the compositing engine needs to deal with i dunno.

Alltaken

Thanks Alltaken, I'll try the drop shadow thing (see pics above). I would like to have a go at the whole "hover" and "click" styles of the buttons. And also the "disabled" state - like when you can't zoom in anymore.

I'm not sure about how to go about doing the train and road ones. Maybe someone could help me with those. Maybe even a frontal render of a sprite? And I can "trace" to make it look more cartoony perhaps.

track and roads, can be cartoony (infact i think it would be nicest)

the next level down (building) will have more realistic images that will be made by set designers i.e. all the track pieces, trees....

Alltaken

Showing my support.
The Icons are real nice!

to go against my original idea i don't much like drop shadows LOL (don't listen to me in the future )

but it made me think, why from the top left? then i did some research and every single OS has used top left as its standard lighting direction for years back... but why?

during design and drawing courses, we were alwyas taught that lighting should come from the top right of a page (generally) as its the 'most' recognised as 3d by the human eye.

all around town i see fake 3d paintings, all done from the top right.

furthermore the lighting setup for OTTD is coming from the top right direction.

i am wondering if (especially if we do drop shadows) we should change the lighting direction to top right....

i would be interested in seeing (that isn't hard to change your icons is it Joed, are they in vector GFX or photoshop?)

just an idea/ observation/ question.

i just don't know why top left is the standard.

Alltaken

Alltaken wrote:i would be interested in seeing (that isn't hard to change your icons is it Joed, are they in vector GFX or photoshop?)

Pretty much everything I've done has been Illustrator. So all vector based - easy to change things then when people ask for different lighting directions

But It's annoying that Illustrator doesn't have "emboss" like Photoshop does...don't know why...

I've down all showdows ala OSX and I think my UI's kinda show that influence. I probably should modify the window mockups as well with the different lighting - also want to try square corners as well.

Also, got an idea for a different Newspaper icon which I need to start on - a bit more 3d like (but still cartoony). Pity no one likes the cog though I'm a bit over the spanner.

who said they didn't like the cog, i love the cog.

way nicer form.

i don't like the 3d cog though i like the 2d one

Alltaken

Maybe change the colour of the bolt to something more metallic grey? The rest looks good, imo, and I take it these are enlarged versions?

White Rabbit wrote:Maybe change the colour of the bolt to something more metallic grey? The rest looks good, imo, and I take it these are enlarged versions?

Bolt? What bolt? And more metalic grey? lol. Do you mean more blue grey? Give me an RBG and I'll have a look. I've added a variation on the cog above.

And as I said before, they are enlarged version so people can see them better. ATM they are 48x48 pixels (though they are vector so can be any size). The original icons are 22x22 pixels. Should the new ones be the same size? I think we could go up to about 28x28 pixels. Alltaken what do you think?

Alltaken, I also much prefer the cog as a form. The original "spanner" doesn't really look like anything and I think is too vague. A cog represent the "inner workings" and I think other apps have used the cog type symbol.

I've also updated those shadow'd icons, do you prefer these Alltaken? And I added the "News Reports" icon. What do people think of this new one?

imo, there should be a double size version 44x44 and a current size version 22x22 of all buttons.

would be better for the more costom GUI system planned a lot later for the 32bpp system

Hey congratulations for the icon graphics! They look really fit for the game.

I don't like the ones with shadows, i like the ones without
Hmm can't decide on the cog colour, maybe the one on the left

Nice cog, newspaper and everything, best icons I've seen in a game for a while, makes a good difference from all those Sims-cloned icons!

Great work, looks quality to me allthough I believe that instead of drop shadows you should make the outlines somewhat thicker to add contrast (especially because they will be about 2x smaller). wp!

also... alltaken have you received my e-mail?

more metalic = shiney = look how aqua does it kinda, one bright line/ high contrast area.

size = 100% (22) 150% (33) and 200% (44) for everything

this will give room (ingame) to do
100% 150% 200% (beutifully) 300% 400% (good on high res monitors where you would hardly notice the jaggy pixels) 600% 800% (crap and HUGE)

shouldn't be hard at all, but when it comes to putting them into the game we may remove some steps depending on how we do it.

also keep the vector GFX files, the game engine MAY (real unpossibility ) be able to understand vector GFX if they are converted into a thing it can understand, and someone wants to code some vector stuff into the game. but hey we arn't holding our breaths.

p.s. yeah the new light direction IMO is much much better, don't know what the others think, but i think its really good.

Alltaken

The small version of the compass is, well, hard to identify, I think it's because you can't see the light blue lines anymore, maybe make them thicker? Also the newspaper being small, is harder to distinguish.