Ideas for a UI facelift
Moderator: Forum Moderators
Forum rules
Before posting critique in this forum, you must read the following thread:
Before posting critique in this forum, you must read the following thread:
Re: Ideas for a UI facelift
doesn't make me think of waffles at all...
and i like the new distinction between normal and hover button status - will there be a pressed status, too? only thing about the buttons is the asymmetrical border (which i like), i think if you use such an asymmetrical element here it needs to be present elsewhere in the ui, too. just to keep things together.
and i like the new distinction between normal and hover button status - will there be a pressed status, too? only thing about the buttons is the asymmetrical border (which i like), i think if you use such an asymmetrical element here it needs to be present elsewhere in the ui, too. just to keep things together.
- West
- Retired Lord of Music
- Posts: 1173
- Joined: October 30th, 2006, 7:24 am
- Location: In the philotic connections between ansibles.
- Contact:
Re: Ideas for a UI facelift
Yes, absolutely. It will be some variation or other on the hover state.kitty wrote:will there be a pressed status, too?
I was planning on that, actually. Not sure where, but I'm sure there will be a lot of oppurtunities to weave in little visual themes like that.kitty wrote:only thing about the buttons is the asymmetrical border (which i like), i think if you use such an asymmetrical element here it needs to be present elsewhere in the ui, too. just to keep things together.
- West
- Retired Lord of Music
- Posts: 1173
- Joined: October 30th, 2006, 7:24 am
- Location: In the philotic connections between ansibles.
- Contact:
Re: Ideas for a UI facelift
Did some more work on the window frames. I think this is a better approach, as the center parts of the frame can easily be tiled if needed.
I noted that there's a certain risk involved in doing stuff like this: adding too much detail. I'm trying to find a balance between clear and pretty but it's also too easy adding more and more and more little decorations. If you feel that it's starting to look too busy and cluttered, just tell me to stop
I noted that there's a certain risk involved in doing stuff like this: adding too much detail. I'm trying to find a balance between clear and pretty but it's also too easy adding more and more and more little decorations. If you feel that it's starting to look too busy and cluttered, just tell me to stop
- Attachments
-
- ui-mockup7.png (156.68 KiB) Viewed 6677 times
Re: Ideas for a UI facelift
Looks really nice, but those kind of decorations set quite a large minimum size for the dialogs/windows (or alternatively you'd have to come up with a more complicated scheme of avoiding the corners getting cut off in smaller dialogs/windows). Dialogs such as the "game has been saved" and "you have been defeated" ones are really small, at least vertically.
I'm not sure how complicated a workaround would be. Basically a good method would be to provide two sets of corner images, normal and small, and have the engine semi-automatically use the small ones if the dialog/window is too small to accomodate the normal sized ones.
I'm not sure how complicated a workaround would be. Basically a good method would be to provide two sets of corner images, normal and small, and have the engine semi-automatically use the small ones if the dialog/window is too small to accomodate the normal sized ones.
- West
- Retired Lord of Music
- Posts: 1173
- Joined: October 30th, 2006, 7:24 am
- Location: In the philotic connections between ansibles.
- Contact:
Re: Ideas for a UI facelift
/me smacks foreheadzookeeper wrote:Dialogs such as the "game has been saved" and "you have been defeated" ones are really small, at least vertically.
You're right. I'm an idiot, I didn't think about that.
Yeah, that is probably the best way. Making a smaller frame is no problem at all. In fact, why not have two separate sets; one for 'real' windows (like... preferences, campaign selection, combat etc) and a more basic one for dialog boxes? This assumes that the engine will differentiate between the two types of course.zookeeper wrote:Basically a good method would be to provide two sets of corner images, normal and small, and have the engine semi-automatically use the small ones if the dialog/window is too small to accomodate the normal sized ones.
- West
- Retired Lord of Music
- Posts: 1173
- Joined: October 30th, 2006, 7:24 am
- Location: In the philotic connections between ansibles.
- Contact:
Re: Ideas for a UI facelift
Standard window frame + smaller version for dialogs/notices.
Re: Ideas for a UI facelift
If that doesn't work for technical reasons or something, maybe you could try one combining the shorter height with the longer width.West wrote:Standard window frame + smaller version for dialogs/notices.
"When a man is tired of Ankh-Morpork, he is tired of ankle-deep slurry" -- Catroaster
Legal, free live music: Surf Coasters at Double Down Saloon, Las Vegas on 2005-03-06. Tight, high-energy Japanese Surf-Rock.
Legal, free live music: Surf Coasters at Double Down Saloon, Las Vegas on 2005-03-06. Tight, high-energy Japanese Surf-Rock.
- West
- Retired Lord of Music
- Posts: 1173
- Joined: October 30th, 2006, 7:24 am
- Location: In the philotic connections between ansibles.
- Contact:
Re: Ideas for a UI facelift
I did try that but it didn't look any good IMO; I would really like to keep the corners symmetrical. Having separate graphics should work though, or so I've been told.xtifr wrote:If that doesn't work for technical reasons or something, maybe you could try one combining the shorter height with the longer width.
Yay, post # 800!
Re: Ideas for a UI facelift
nice! i really hope that this will be possible.
not a real crit, but personally i find the right version way too see-through, i find that kind of dialogue horribly distracting when trying to read something or get any info quickly.
not a real crit, but personally i find the right version way too see-through, i find that kind of dialogue horribly distracting when trying to read something or get any info quickly.
- West
- Retired Lord of Music
- Posts: 1173
- Joined: October 30th, 2006, 7:24 am
- Location: In the philotic connections between ansibles.
- Contact:
Re: Ideas for a UI facelift
Well, the transparency was just added as an afterthought to indicate that the smaller windows should be transparent; the opacity can easily be changed (and I'm not sure transparency is handled by the images at all).kitty wrote:not a real crit, but personally i find the right version way too see-through, i find that kind of dialogue horribly distracting when trying to read something or get any info quickly.
I also dislike transparent windows, because to keep text intelligible and things not looking messy you need to keep the opacity so high there's really no point in having transparency at all. Also, transparent windows are so utterly done to death what with the Vista Aero look and all, but as the current skin has transparency I think we should stick with it for consistency's sake if nothing else. I also realize that I'm part of the minority who doesn't think transparency looks cool; most people do like it.
Re: Ideas for a UI facelift
To keep the text intelligible, you need to have a certain "large difference in luminosity" between the text and the background (at least 50 on a scale from 0->100, preferably more like 75). But also, you need the background to not have "high frequency" changes in luminosity. That's where the blurring comes in. Our eyes are keyed on recognizing edges, and blurring the background means that there are no edges in the background.West wrote:I also dislike transparent windows, because to keep text intelligible and things not looking messy you need to keep the opacity so high there's really no point in having transparency at all.
So, it's not just opacity. You're definitely right that if you don't do the blurring, you need to be about 90-95% opaque, and at that point there's almost no point in bothering with transparency.
I like transparency, partly because it has the functional benefit of still allowing you to get the general gist of what's behind something. It's not just "sparkle", it's actually a functional addition to a UI.West wrote:Also, transparent windows are so utterly done to death what with the Vista Aero look and all, but as the current skin has transparency I think we should stick with it for consistency's sake if nothing else. I also realize that I'm part of the minority who doesn't think transparency looks cool; most people do like it.
It's much like (very quick) animation effects when you minimize a window - it's not just a flashy animation, it shows you where it went (versus insta-minimizing where you find yourself wondering "[censored] - which taskbar button did that minimize to?", and then have to hunt around for it to find it. Not an issue when you have 3-4 taskbar buttons present, becomes a serious issue when you have more than 20 (which is normal for me when I'm working on windows)).
Play Frogatto & Friends - a finished, open-source adventure game!
- West
- Retired Lord of Music
- Posts: 1173
- Joined: October 30th, 2006, 7:24 am
- Location: In the philotic connections between ansibles.
- Contact:
Re: Ideas for a UI facelift
Aha, that's interesting! I've never thought about that aspect, I always thought blurred transparency was just some sort of gimmick. And in Vista I guess it is a gimmick; it's only the window borders that are transparent IIRC, i.e. such a small part of a window that there's no real benefit from it being transparent in the first place -- as always, you can trust MS never to get anything really rightJetryl wrote:But also, you need the background to not have "high frequency" changes in luminosity. That's where the blurring comes in. Our eyes are keyed on recognizing edges, and blurring the background means that there are no edges in the background.
I dunno, over the years I've tried several different apps that let you make windows transparent and TBH I just find it annoying. Especially if we're talking about windows with text in them. But I guess I'm old. Or a traditionalist. Or both...Jetryl wrote:I like transparency, partly because it has the functional benefit of still allowing you to get the general gist of what's behind something. It's not just "sparkle", it's actually a functional addition to a UI.
IOW, it's a question of preference really. I've never been able to 'get' transparency unless used tastefully and just for decorative purposes, but like I said, I know lots of people like it and I'm not saying they're wrong.
- Sgt. Groovy
- Art Contributor
- Posts: 1471
- Joined: May 22nd, 2006, 9:15 pm
- Location: Helsinki
Re: Ideas for a UI facelift
I would vote against window transparency in this instance. It's the "hi tech" feel of it that rubs me the wrong way, it clashes with the quasi-medieval ornamentation and materials of the theme (unless it is made to look like stained glass, with rippled distortions to account for the uneveness of antique glass, but that might be overkill).
There is the benefit Jetryl mentions, but then again, the game is freezed during dialogs and menus, so it's not like the player needs to see what's under the windows.
There is the benefit Jetryl mentions, but then again, the game is freezed during dialogs and menus, so it's not like the player needs to see what's under the windows.
Tiedäthän kuinka pelataan.
Tiedäthän, vihtahousua vastaan.
Tiedäthän, solmu kravatin, se kantaa niin synnit
kuin syntien tekijätkin.
Tiedäthän, vihtahousua vastaan.
Tiedäthän, solmu kravatin, se kantaa niin synnit
kuin syntien tekijätkin.
- West
- Retired Lord of Music
- Posts: 1173
- Joined: October 30th, 2006, 7:24 am
- Location: In the philotic connections between ansibles.
- Contact:
Re: Ideas for a UI facelift
Just for fun...
I haven't checked for browser compatibility, but it should work in FF3.
Edit: added the smaller version of the window frame as well. The transparency is borked in a spot places due to bad planning when cutting the images, but, meh.
I haven't checked for browser compatibility, but it should work in FF3.
Edit: added the smaller version of the window frame as well. The transparency is borked in a spot places due to bad planning when cutting the images, but, meh.
Re: Ideas for a UI facelift
That is an... interesting effect that takes place when you resize where the extra length seems to come from a small square in the lower right corner.
Mainline Maintainer: AOI, DM, NR, TB and THoT.
UMC Maintainer: Forward They Cried, A Few Logs, A Few More Logs, Start of the War, and Battle Against Time
UMC Maintainer: Forward They Cried, A Few Logs, A Few More Logs, Start of the War, and Battle Against Time