Page 1 of 1

GUI Feedback please

Posted: Wed May 06, 2020 4:50 am
by MoonByte
So UI design is kind of my weakness and while I feel I am getting somewhere, I believe I am not yet where I want to.
And since some people here have amazing designs, I'd like some feedback on what I got and would appreciate any input.
(Note: Font and color are NOT up for debate. It has to be black&white and I want this specific font)
The style should reflect at least a little bit an old newspaper.
It is not set in the 20s (1920, that is), but should feel a bit like from an old noir movie.
It has a newspaper texture, but I feel it looks...bland? But I am unsure on how to make it feel more...GUI. If I maybe should use some "roaring 20s" design patterns to give it more of that effect or something.
The texture up close cause it is pretty washed out (since I thought the actual VN text might otherwise be hard to read):

Re: GUI Feedback please

Posted: Wed May 06, 2020 5:50 am
by Imperf3kt
It looks okay to me, but the really high contrast black takes away from the aged look somewhat. If you look at an actual newspaper, you'll see they don't usually use pure black, but rather a dark grey.

Re: GUI Feedback please

Posted: Wed May 06, 2020 6:57 am
by Wudgeous
I feel like you're going for a more subtle touch, so I would steer away from any roaring 20s art deco textures. Those are overused anyway.

We'll focus on the two points of inspiration you've mentioned: an old newspaper and film noir.

If we examine some actual reference images of newspapers, we will notice their usage of clear border lines to help the reader divide the page into sections. I think that could be used for your namebox and quick menu, and perhaps the textbox can be a little frayed at the corners.

As for film noir, my main observation is that it's very high contrast, with compositions mainly filled by a dark gray grunge. Have you considered using a dark backdrop with white text?

That's all the ideas I've got to toss your way. Best of luck. :)

Re: GUI Feedback please

Posted: Wed May 06, 2020 8:21 am
by MoonByte
To Imperfekt:
I think I actually read about that, they called it the difference between "True Black", "Print Black" and "Rich Black"?
Like, #000000 is Rich Black I think and there are two other blacks (True Black which actually reads as pitch black by CMYK printers and Print Black which is printer-friendly)
I will look into that, that was totally not even on my radar! :D

To Wudgeous:
The textbox is a bit frayed, but maybe I go even deeper in how frayed it is to properly show it.
But the dividers is actually a neat little advice. I believe I keep my style for name and quickmenu (since that one is from a newspaper section where they showed the date which would be at the top, like the namebox), but I might use the box thing to literally frame the text and then have the newspaper texture text more clear outside of it, to really show off that it is newspaper without zooming in...
To the noir observation, yes I have but the problem is that my game is split into two parts called Black and White which work with opposite values. I currently work on White so the menus are bright with dark text while Black (which I hopefully can start on in 2-4 years lol) will be the opposite. So while I appreciate that comment, a dark grunge with bright letters is a no-no. But the contrast in itself might be something to look into.
I will play around a bit in Photoshop and see if something hits me in regard to that :3

Re: GUI Feedback please

Posted: Thu May 07, 2020 5:16 am
by meowworkstm
At the moment the GUI feels pretty modern with how sleek the gradient and textbox edges are.The upper right menu and name box give me more of an old noir vibe and I definitely think you could apply the same elements to the body! For example, a stronger texture, increasing the size of the washed out text, and paper wrinkles in the main textbox might give it the extra contrast and variation it needs. And if it fits the aesthetic some ink blotches or paper stains might be a nice touch! Like the previous users mentioned I think using a dark grey for the font and adding borders/dividers would also make the GUI feel more balanced and nuanced.

I know that you preferred for the font to remain the same but I think the name box could benefit from being a different font, maybe bold or in all caps to imitate a section heading if you really wanted to push a newspaper theme. This textbox is really nice all things considered though, I hope this helps!