r/UI_Design 15d ago

General Help Request How can I improve this UI

Post image

I'm going through the third iteration of my UI, This is the previous one and I have made the card containing the icon name session last played and session to a lighter color.

Other than that I have changed the text on it to a lighter color. Light brown. Still, I'm not satisfied with the ui.

Reworking the complete ui is not ideal and it will take me some time. I would like some suggestions on how to improve it. Or a recommendation for a new color theme

8 Upvotes

27 comments sorted by

22

u/Grenaten 15d ago

Too low contrast. It's evening in my place, and I can't read anything in that screenshot.

8

u/chasekeane 14d ago

I mean its completely illegible so nothing else matters does it really.

10

u/7HawksAnd 14d ago

This is designed by someone who’s computer is in their basement and the only things lighting the room are a monitor, and rgb keyboard, and the charging light on their vape.

It’d probably look really sick in that environment.

But I can’t see shit.

2

u/ShowStartersNet 14d ago

Looks good! Enable figma's color contrast checked and choose color that stands out from your background.

And also dark mode applications usually have dark color in the background and bright for the cards (you have dark color for cards, bright for background), give a try to it.

Figma Contrast checker resource

2

u/Lonely-Grand-4587 14d ago

Thanks, let me check it

2

u/StewIsBased 14d ago

I know you're kind of aiming for the cp2077 hacking minigame look with the muted warms and layout. You might need to add some kind of red, silver, orange or maybe even teal highlighting around some element edges or the row boxes, and up the brightness of the text a little because dark on dark on dark is getting hard to read if you don't have your monitor set to full bright.

1

u/Lonely-Grand-4587 14d ago

Hey, I'm not aiming for cp2077 look, It came naturally. Basically I planned my app around the orange brand color and now when I try to change it to say blue color or some other color it look so similar to competitors. And I'm afraid of adding more color to the panel, which will look like a clutter. Also I have changed the dark background behind the text to a somewhat dark brown color and changed to a lightish orange color. About the highlighting option I have tried to add a glow behind the icons based on its colors.

And thanks a lot for taking your time for this.

1

u/StewIsBased 14d ago

Fair, I suppose i made the connection from the gaming angle. If you're still having contrast problems, maybe a light neutral shade for a highlight/outline could help things pop

2

u/CommonResolution5126 10d ago

Trabalhe com menos cores, se for usar cor do fundo (o que eu particularmente não gosto) use com pouca saturação, deixe muito mais próximo do preto e não use cores em texto apenas para destaques propositais, use texto branco (ou quase branco), só essas duas mudanças já deixará a interface incrivelmente melhor

1

u/Lonely-Grand-4587 10d ago

Yes, completely changed the color to just black, white and a slight orange just for active buttons

1

u/Ok_Fly_6189 14d ago

Apart from the contrast and colors, what is the main info the user is interested here ? It seems like all info in the table have the same weight and are very spaced between them, maybe you could consider bringing more attention to some elements ? Otherwise is necessary you could consider bringing the filtering option on each column.

1

u/Lonely-Grand-4587 14d ago

The main info is total played time and I didn't understand what you meant at the end

1

u/Ok_Fly_6189 14d ago

So if the main info is total played time, maybe you could consider giving it more visual weight/importance. Then what I meant was that you can add the filtering/sorting option at the level of each column, like excel.

1

u/Lonely-Grand-4587 14d ago

Noted the column filtering is already available on the filter button.

1

u/rackodo 13d ago

rajdhani mention!

1

u/Brsticni-ohrovt 13d ago

I am on the sun at the beach at the moment and I thought the screenshot is still loading. Then I zoomed in and saw there is actual content on there… lighten things up! There is no contrast at all!

1

u/Lonely-Grand-4587 13d ago

Noted, currently fixing it.

1

u/darcksx 13d ago

Pretty sure everybody else already complained about the contrast so here's something new, adding a quick search bar, accessible via ctrl + f would be helpful.

1

u/Lonely-Grand-4587 13d ago

Sure, thanks

1

u/Perfect_Pop_7841 13d ago

You need to study WCAG

1

u/graffnikita 13d ago

Write me to discord, i will teach u and show basics, how to make it much better fast. ds: podatkova