GUI Feedback please

Questions, skill improvement, and respectful critique involving art assets.
Post Reply
Message
Author
User avatar
MoonByte
Regular
Posts: 150
Joined: Thu Mar 24, 2016 9:18 pm
Completed: Shine (RPG Maker), Heroes (RPG Maker), Lantern Bearer (RPG Maker), Loop the Loop (Unity), Other Stars (Unreal), Sky Eye (RPG Maker), WIN Delivery & Fateful (Ren'Py)
Projects: Weird Is Normal (Ren'Py)
Location: Germany
Contact:

GUI Feedback please

#1 Post by MoonByte » Wed May 06, 2020 4:50 am

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)
test.png
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):
test1.png

User avatar
Imperf3kt
Lemma-Class Veteran
Posts: 2982
Joined: Mon Dec 14, 2015 5:05 am
Location: Your monitor
Contact:

Re: GUI Feedback please

#2 Post by Imperf3kt » Wed May 06, 2020 5:50 am

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.
Warning: May contain trace amounts of gratuitous plot.
pro·gram·mer (noun) An organism capable of converting caffeine into code.

Twitter
Imperf3kt Blackjack - a WIP blackjack game for Android made using Ren'Py
Free Android GUI - Updated occasionally

User avatar
Wudgeous
Regular
Posts: 37
Joined: Tue Apr 30, 2019 5:59 am
itch: wudgeous
Contact:

Re: GUI Feedback please

#3 Post by Wudgeous » Wed May 06, 2020 6:57 am

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. :)
Have confidence. Let go of perfectionism. I love you!
Image
A superhero dating sim in fresh hot development!


You can also keep up with me on Twitter and Itch!

User avatar
MoonByte
Regular
Posts: 150
Joined: Thu Mar 24, 2016 9:18 pm
Completed: Shine (RPG Maker), Heroes (RPG Maker), Lantern Bearer (RPG Maker), Loop the Loop (Unity), Other Stars (Unreal), Sky Eye (RPG Maker), WIN Delivery & Fateful (Ren'Py)
Projects: Weird Is Normal (Ren'Py)
Location: Germany
Contact:

Re: GUI Feedback please

#4 Post by MoonByte » Wed May 06, 2020 8:21 am

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

User avatar
meowworkstm
Regular
Posts: 27
Joined: Wed Dec 23, 2015 4:08 am
Projects: The Riddlemaster, Hollowed
Tumblr: ladymeowsith
Deviantart: Meowworkstm
Contact:

Re: GUI Feedback please

#5 Post by meowworkstm » Thu May 07, 2020 5:16 am

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!

Post Reply

Who is online

Users browsing this forum: No registered users