Infobar UX

[Grymffin]

Originally Posted by Gethe The new Infobar is part of an ongoing effort to make RealUI scale better for high resolution displays. This means that if you use a high res monitor (e.g 1200px or more vertically), the Infobar will be noticeably larger than it had been. This is by design. The hud config bar has this same property as well, though this may not be as noticeable since it's not visible all the time.

One of the reasons most people use RealUI is that is (was) clean and minimalistic. That includes a neat, clean, minimalistic toolbar. Take it from me as a UX guru of 16 years, the toolbar needs revisiting. Saying it's "by design" doesn't stand as an argument against the fact that it breaks the entire experience. It needs to get back to its original look while retaining the new functionality.

I'll recap a few issues that need to be addressed:

• Font that you selected for toolbar isn't working. It's too thick, and it needs that nasty thick outline to work. A crisp, pixel-perfect font is what is needed. Change it.
• Toolbar font is too large - scale it down by 40%. You can retain the height of the toolbar to provide some spacing, but the text needs to be smaller.
• Individual widgets in the toolbar need more breathing room - give them at least one letter's width of extra space both to the left and right.
• Colored icons need to go. They don't fit with the rest of the UI, and they are horribly distracting without adding any value.
• In the rollouts (such as "Currency"), title font is HUMONGOUS. Title is NOT the focus of the rollout. Get rid of the titles, or decrease their size by 60%. On the other hand, the thing that IS the focus is entirely tiny: the text of the rollout itself. Increase the text size by 20%.

[KonigTX]

Originally Posted by Grymffin One of the reasons most people use RealUI is that is (was) clean and minimalistic. That includes a neat, clean, minimalistic toolbar. Take it from me as a UX guru of 16 years, the toolbar needs revisiting. Saying it's "by design" doesn't stand as an argument against the fact that it breaks the entire experience. It needs to get back to its original look while retaining the new functionality. I'll recap a few issues that need to be addressed: Font that you selected for toolbar isn't working. It's too thick, and it needs that nasty thick outline to work. A crisp, pixel-perfect font is what is needed. Change it. Toolbar font is too large - scale it down by 40%. You can retain the height of the toolbar to provide some spacing, but the text needs to be smaller. Individual widgets in the toolbar need more breathing room - give them at least one letter's width of extra space both to the left and right. Colored icons need to go. They don't fit with the rest of the UI, and they are horribly distracting without adding any value. In the rollouts (such as "Currency"), title font is HUMONGOUS. Title is NOT the focus of the rollout. Get rid of the titles, or decrease their size by 60%. On the other hand, the thing that IS the focus is entirely tiny: the text of the rollout itself. Increase the text size by 20%.

I agree. If these things could all be added as options it'd be way better. Same look as before, better functionality. The new bar works extremely well but looks entirely out of place with the design feel of RealUI.

As I've said before, RealUI is the best UI out there and thank you for the hard work you put into it. However, the recent InfoBar seems to stray away from the original intent of RealUI -- clean and minimal.

[Gethe]

Originally Posted by Grymffin One of the reasons most people use RealUI is that is (was) clean and minimalistic. That includes a neat, clean, minimalistic toolbar. Take it from me as a UX guru of 16 years, the toolbar needs revisiting. Saying it's "by design" doesn't stand as an argument against the fact that it breaks the entire experience. It needs to get back to its original look while retaining the new functionality. I'll recap a few issues that need to be addressed: Font that you selected for toolbar isn't working. It's too thick, and it needs that nasty thick outline to work. A crisp, pixel-perfect font is what is needed. Change it. Toolbar font is too large - scale it down by 40%. You can retain the height of the toolbar to provide some spacing, but the text needs to be smaller. Individual widgets in the toolbar need more breathing room - give them at least one letter's width of extra space both to the left and right. Colored icons need to go. They don't fit with the rest of the UI, and they are horribly distracting without adding any value. In the rollouts (such as "Currency"), title font is HUMONGOUS. Title is NOT the focus of the rollout. Get rid of the titles, or decrease their size by 60%. On the other hand, the thing that IS the focus is entirely tiny: the text of the rollout itself. Increase the text size by 20%.

This is great feedback, thank you. I can agree with some of your points, but there are a few hard lines in going to draw.

• I can see your point about the font being too thick, but it won't go back to the pixel font. Along the lines of the post you quoted, pixel fonts will be phased out because they simply don't scale at all, at least not with how WoW renders its fonts. When building this initially I was going to use the thinner chat font instead, but that is also a narrow font and I felt it might look too cramped. I may just include another font.
• I can adjust the font height, for both the blocks as well as the tooltips. The block width is already adjustable, but I can increase the default.
• So first off, icons are part of the LDB spec and I can't not support them. The only icon that I expicitly color is for Durability, which is graded from green at 100% to red at 0%. Other colored icons are actual icons from the game. With all that said I'm not really sure what you're suggesting.

[KonigTX]

Originally Posted by Gethe This is great feedback, thank you. I can agree with some of your points, but there are a few hard lines in going to draw. I can see your point about the font being too thick, but it won't go back to the pixel font. Along the lines of the post you quoted, pixel fonts will be phased out because they simply don't scale at all, at least not with how WoW renders its fonts. When building this initially I was going to use the thinner chat font instead, but that is also a narrow font and I felt it might look too cramped. I may just include another font. I can adjust the font height, for both the blocks as well as the tooltips. The block width is already adjustable, but I can increase the default. So first off, icons are part of the LDB spec and I can't not support them. The only icon that I expicitly color is for Durability, which is graded from green at 100% to red at 0%. Other colored icons are actual icons from the game. With all that said I'm not really sure what you're suggesting.

Would you consider leaving the option to use a pixel font? I'm on a 1440p monitor and the InfoBar looked great on my screen with the pixel font.

Adding options vs. outright removing something is always preferable. I'm willing to bet there are others who would love to keep the pixel font.

[Grymffin]

Originally Posted by Gethe This is great feedback, thank you. I can agree with some of your points, but there are a few hard lines in going to draw.

You're welcome, and thank you for taking the feedback. Sorry to have taken this long to respond, life got a bit crazy.

Originally Posted by Gethe I can see your point about the font being too thick, but it won't go back to the pixel font. Along the lines of the post you quoted, pixel fonts will be phased out because they simply don't scale at all, at least not with how WoW renders its fonts. When building this initially I was going to use the thinner chat font instead, but that is also a narrow font and I felt it might look too cramped. I may just include another font.

I understand. Pixel font look awesome when you can rely on a fixed display size. And they fall apart as soon as the user changes UI scaling, too. If you'd like to, I could work with you on those UX things. It's just an offer from a fan of the UI package (and a long-time UX designer), take it or leave it.

Either way, picking a font that supports thin/light/regular/semibold/bold weights would be a good start. I would recommend OpenSans or Roboto - both meet those criteria, and both also have narrow/condensed versions, and both are free. I personally use narrow/condensed font almost everywhere in my RealUI. It doesn't hurt the legibility and feels more tight and orderly.

Originally Posted by Gethe I can adjust the font height, for both the blocks as well as the tooltips. The block width is already adjustable, but I can increase the default.

Yes, I've noticed about a week after I posted the original feedback. The spacing between blocks in the toolbar can be adjusted with /realadv, section Infobar, property Block Gap. That's good. As for the text in the infobar, I still think decreasing size of the bar text by ~20%, increasing block text in the popups by ~20% and either decreasing size (or opacity) of the popup title, would be a good step forward. My thinking is, the title is something that people will read once, maybe twice.. it's the data below that is the focus.

Originally Posted by Gethe So first off, icons are part of the LDB spec and I can't not support them. The only icon that I expicitly color is for Durability, which is graded from green at 100% to red at 0%. Other colored icons are actual icons from the game. With all that said I'm not really sure what you're suggesting.

I see. Is there a hard requirement that the icons look exactly the way they're provided by a 3rd party? If not, then I'd suggest changing them to monochrome flat look. The Guild, Friends, and Bags icons look good, and they're exactly what I'm thinking of. That's the look that goes best with RealUI. Again, I can offer my assistance in providing those.

[Gethe]

Originally Posted by Grymffin You're welcome, and thank you for taking the feedback. Sorry to have taken this long to respond, life got a bit crazy.

It's all good, things happen. I actually haven't even started on these changes for similar reasons

Originally Posted by Grymffin If you'd like to, I could work with you on those UX things. It's just an offer from a fan of the UI package (and a long-time UX designer), take it or leave it.

That would be awesome. I've done a bit of research on UX principles myself, but it's a lot to take in and some things can be difficult to apply in the context of WoW.

Originally Posted by Grymffin Either way, picking a font that supports thin/light/regular/semibold/bold weights would be a good start. I would recommend OpenSans or Roboto - both meet those criteria, and both also have narrow/condensed versions, and both are free. I personally use narrow/condensed font almost everywhere in my RealUI. It doesn't hurt the legibility and feels more tight and orderly.

RealUI actually does use Roboto (NotoSans for CJK) for the non-pixel fonts by default in four styles: Regular (normal), Condensed-Regular (chat), BoldItalic (CBT crits), and Slab-Regular (non tooltip headers). The problem though with multiple weights is that each one needs to be included as a separate font file, which has a non-negligible impact on the download size, especially for CJK.

Originally Posted by Grymffin I see. Is there a hard requirement that the icons look exactly the way they're provided by a 3rd party? If not, then I'd suggest changing them to monochrome flat look. The Guild, Friends, and Bags icons look good, and they're exactly what I'm thinking of. That's the look that goes best with RealUI. Again, I can offer my assistance in providing those.

There isn't so much a requirement that the icons are the same, but rather that I don't know what icon they might use. For example, WeakAuras can provide a block with an icon. This icon is actually a custom texture of their own logo, so unless I create a new icon specifically for that addon, it simply won't mesh. Most 3rd party blocks, as well as RealUI's own currency block, use the game's built in icons. The problem here is that WoW has literally thousands of icons (17k+), it's impractical to make minimal versions of even a portion of these. I could instead desaturate these icons, but depending on what that icon is it may end up looking worse.

This is the primary reason why I made sure that the icon and label can be hidden or shown on a per block basis.