New icon for the AGS Editor [HELP PLEASE]

Started by ChamberOfFear, Wed 19/04/2017 14:49:59

Previous topic - Next topic

ChamberOfFear

So I was trying to make a new icon for the editor when Crimson Wizard pointed out a potential issue, I was maybe hoping that someone who know Photoshop, GIMP or similar software could help out.

The issue is that the icon is entirely blue, and when it is placed over a blue background it fades in and becomes sort of invisible. Crimson Wizard suggested that adding a white outline to the shape could help, although I suppose a black outline would do the same thing. If anyone wants to try giving it a nicer color or do other edits they're free to do so.

Showcase:
Spoiler
[close]

Problem:
Spoiler
[close]

Image:
Spoiler
[close]

Original:
Spoiler
[close]

LameNick

Not sure it helps but I did some things to it like outline, gradient, drop shadow.

when i tried to upload the pngs to an image sharing site it messed the files up so i just uploaded them in a zip:

https://www.sendspace.com/file/adh7mq
How much wood would a wood chuck chuck if a wood chuck could chuck wood?

abstauber

#2
Lets not rush this ;)

First of all:
Here are the source photoshop files (the cup is in splash3). The cup is done in vectors so it should be easy to create custom icons.
http://shatten.sonores.de/wp-content/uploads/2013/06/splashes2.zip

Here is an icon creation guide:
https://msdn.microsoft.com/en-us/library/windows/desktop/dn742485(v=vs.85).aspx

And an icon creator, unfortunately this one can only create icons up to 64x64
http://www.xiconeditor.com/


Made a quick 128x128 icon:


Here's the ico:
http://shatten.sonores.de/wp-content/uploads/2017/04/ags_icon_64.ico

And here's the source psd:
http://shatten.sonores.de/wp-content/uploads/2017/04/single_cup.psd

LameNick

The splash screen looks really cool, so wouldn't including the skewed white screen solve the background problem?

https://www.sendspace.com/file/ljjj37
How much wood would a wood chuck chuck if a wood chuck could chuck wood?

ChamberOfFear

#4
Quote from: LameNick on Thu 20/04/2017 12:38:37
The splash screen looks really cool, so wouldn't including the skewed white screen solve the background problem?

https://www.sendspace.com/file/ljjj37

It would, however it requires additional space in an already cramped environment which would make the icon harder to see. Maybe trim off the sides so that it just covers the cup.

LameNick

Sorry for flooding you with all these versions, I'm not much of a graphic designer, just hope that one of them will be perceived as not crippling the original too much.

https://www.sendspace.com/file/r6emqj
How much wood would a wood chuck chuck if a wood chuck could chuck wood?

Crimson Wizard

#6
I like the ones with mirrored tilted rectangle. I do not like ones with ellipsis, because our current splash design (and cup design we are using) is based on metro style, which seem to favor straight lines.

But this needs to be tested in small size (like on window title bar) to see if it fits well.

EDIT: BTW, we do not have to use same shapes on every size of an icon. We may use complex shape on large icons, and simplified shape on small icon, to keep it distinguishable.

ChamberOfFear

We're getting somewhere, however, LameNick, can you send me a 256x256 version of the narrowscreen image?

LameNick

i had to retrace it in vectors since all the provided original images were smaller than 256x256

https://www.sendspace.com/file/a83elb
How much wood would a wood chuck chuck if a wood chuck could chuck wood?

ChamberOfFear

This is pretty cool I think.

Spoiler
[close]

I think it might look even better, especially on the smaller icons, if we also had scaled each individual image by vector, but maybe this is too much hassle? I don't know. It probably would be better than the stretch scale that I used when I made the test icon. I would need copies of the file "ags_cuponscreen_256x_v2.png" in the following dimensions.

  • 256x256
  • 128x128
  • 96x96
  • 64x64
  • 48x48
  • 32x32
  • 24x24
  • 16x16

LameNick

#10
Unfortunately I don't know how to directly export vector graphics in specific resolution. I can just import it in specific resolution, but I don't know whether the scale transformation happens before it's conversion into bitmap or after. If these are not good I might try different rescaling algorithms but I doubt at these small resolutions there would be much of an observable difference.

https://www.sendspace.com/file/nvzzka
How much wood would a wood chuck chuck if a wood chuck could chuck wood?

ChamberOfFear

Thank you, it looks much better than what I did. I uploaded the changes to PR #397.

Crimson Wizard

#12
This may be just me, but I liked the old stronger blue color better. Now it became rather blusih grey, very unelaborate in my opinion.

Also, have you considered the white background with blue outline variant (I saw one in the LameNick's archive) ? How would that work for large icons in your opinion? Hmm maybe not.

Well, anyway, if people are generally okay with it, I may merge the request now.

ChamberOfFear

I'm not a designer myself or have any sort of proficiency in anything related to that, so I'll let others weigh in on that. It makes sense however to go with that color as it is closer the AGS logos color scheme.

I did consider the blue outline ones that LameNick provided, but ultimately decided against it as it didn't look good on the smaller icons and I preferred to use the same image for all the sizes, just for sake of simplicity.

If anyone wants to see what the icon looks like under specific circumstances I can provide screen shots if they're unable to check out the dev branch themselves.

Crimson Wizard

I'd also try a background that matches blue cup's tilt angle. Especially on small icons, different tilt make it look too complex.

I am comparing it with uTorrent icon, which is a "nu" symbol on the green field, it also has a thin white outline around it, following general shape.

ChamberOfFear

I'm sorry I don't understand what you're saying or what a tilt angle is in this context.

Crimson Wizard

I mean, currently the white background is tilted inverse compared to the blue cup's tilt. Maybe make it just outline the cup?

LameNick

Like this? https://www.sendspace.com/file/99jq7a

I think personally i like more the original, but i don't mind either way.
How much wood would a wood chuck chuck if a wood chuck could chuck wood?

Crimson Wizard

I guess I will stand aside here, because I cannot decide myself, so I will leave this for others.

The main issue I am having with this new icon is that IMHO it looks bland, if you compare it with more elaborate deep blue color of the existing icon, and other program icons I have around it on the task bar or programs menu.

LameNick

How much wood would a wood chuck chuck if a wood chuck could chuck wood?

SMF spam blocked by CleanTalk