Latest Posts

Topic: [GUI] Icons for stock policy buttons

Forums » Widelands Development » Graphic Development » [GUI] Icons for stock policy buttons
fraang

Topic Opener
Joined: 2010-02-15, 13:13
Posts: 239
Ranking
Widelands-Forum-Junkie
 Posted at: 2015-06-01, 04:31

Hello again!

I have made some icons for the stock policy buttons:

I hope you like them. face-smile.png Any preferences for the general icon style? Currently the icons have various styles and I would like to make the future ones more coherent. Does anybody know what exact resolution the buttons icons should be? I used 24x24 pixels in the above screen shot and am not sure if that's right. face-confused.png

24px 48px

Template:

I have also made a template .blend file for future use the easy the creation of a coherent icon set for all the buttons etc.

24px 48px
Top Quote
einstein13
Avatar
Joined: 2013-07-29, 00:01
Posts: 1116
Ranking
One Elder of Players
Location: Poland
Posted at: 2015-06-01, 09:06

Idea of new button is very good. Especially for "red" part. But this green is not intuitive for me. I had to think about it for few minutes before I've got your idea.

Green tick is something opposite to red cross, so it means to me that the ware should be stocked there. I don't know what should mean green arrow to the left. Arrows usually means "exit", so it is still behaviour of exit to me. Better idea is to lave this box without any arrow, tick or cross for normal behaviour for ware. So my idea is to use:

  • pure box for normal behaviour
  • green tick for "prefer stock here"
  • red cross for "don't put wares here"
  • red arrow to the right for "get rid of stocks"

einstein13
calculations & maps packages: http://wuatek.no-ip.org/~rak/widelands/
backup website files: http://kartezjusz.ddns.net/upload/widelands/

Top Quote
kaputtnik
Avatar
Joined: 2013-02-18, 20:48
Posts: 2607
OS: Archlinux
Version: current master
Ranking
One Elder of Players
Location: Germany
Posted at: 2015-06-01, 18:37

einstein13 wrote:

Idea of new button is very good.

+1

I could only tell form my point of view:

  • pure box for normal behaviour

The disc sign was very intuitive for me.

  • green tick for "prefer stock here"

A tick has for me the meaning: "Put wares here" (normal behavior). The green up arrow was good.

  • red cross for "don't put wares here"

That is like fraangs suggestion face-smile.png

  • red arrow to the right for "get rid of stocks"

Arrow to the right is much better than arrow to the bottom. fraangs decision is great plus. I think red colored button would also be better.

I am thinking about the cube. I think this should be a generic placeholder for each type of ware? If so, it is not optimal to show this on the buttons. Reason: We should think about what function those buttons have:

  1. They are related to the choosen warehouse
  2. They do something with wares which are stored in this (the choosen) warehouse

Wares are choosen at the top of the window, the buttons at the bottom make actions related to this (!) warehouse. So my suggestion (if there is enough space) is to use an icon similar to the second in last row (a stylized building). The arrows and crosses could be adjusted to the door of this icon. As said: If there is enough space face-smile.png

We should also consider people whose eyes do not work as good as eyes from younger people face-wink.png (or are colorblind). F.e. the red arrow do not contrast to the wooden background. A higher contrast would be appreciated face-smile.png

Top Quote
DragonAtma
Avatar
Joined: 2014-09-14, 01:54
Posts: 351
Ranking
Tribe Member
 Posted at: 2015-06-01, 20:36

I definitely recommend either making the red arrows lighter, or giving them an outline for more contrast.

Top Quote
GunChleoc
Avatar
Joined: 2013-10-07, 15:56
Posts: 3317
Ranking
One Elder of Players
Location: RenderedRect
Posted at: 2015-06-01, 21:04

kaputtnik wrote:

Wares are choosen at the top of the window, the buttons at the bottom make actions related to this (!) warehouse. So my suggestion (if there is enough space) is to use an icon similar to the second in last row (a stylized building). The arrows and crosses could be adjusted to the door of this icon. As said: If there is enough space face-smile.png

+1

Busy indexing nil values

Top Quote
fraang

Topic Opener
Joined: 2010-02-15, 13:13
Posts: 239
Ranking
Widelands-Forum-Junkie
 Posted at: 2015-06-16, 05:21

Take 2 and 3 xD:

The idea in the upper row is to make a symbol similar to the existing "gray dot" icon and color it yellow (don't prefer (green) neither remove (red) the wares).

Top Quote
einstein13
Avatar
Joined: 2013-07-29, 00:01
Posts: 1116
Ranking
One Elder of Players
Location: Poland
Posted at: 2015-06-16, 15:48

Now the icons are more intuitive face-smile.png I have to think for short time, but I can imagine what they mean face-smile.png

Very good work!

einstein13
calculations & maps packages: http://wuatek.no-ip.org/~rak/widelands/
backup website files: http://kartezjusz.ddns.net/upload/widelands/

Top Quote
GunChleoc
Avatar
Joined: 2013-10-07, 15:56
Posts: 3317
Ranking
One Elder of Players
Location: RenderedRect
Posted at: 2015-06-17, 10:09

To me, the yellow dot looks like it is blocking the door, so I prefer the version without it. For the "don't stock" icon, how would it look with a closed door and no box?

Busy indexing nil values

Top Quote
fraang

Topic Opener
Joined: 2010-02-15, 13:13
Posts: 239
Ranking
Widelands-Forum-Junkie
 Posted at: 2015-06-21, 15:41

GunChleoc wrote:

To me, the yellow dot looks like it is blocking the door, so I prefer the version without it. For the "don't stock" icon, how would it look with a closed door and no box?

Here you go!

Top Quote
DragonAtma
Avatar
Joined: 2014-09-14, 01:54
Posts: 351
Ranking
Tribe Member
 Posted at: 2015-06-21, 16:31

For "don't stock" I'd show the red X but no box.

For "no special orders" I'd show a double-headed arrow.

Top Quote