VST GUI Rant

[pough]

I made some similar comments over a year ago, but I didn't use the word "rant" in the thread title and so there was never any kind of war involved. I was completely ignored.

[Lunch Money]

Story of my life.

As some of you know, I'm a teacher... and part of my job is to help the kids get along, and to help them along in expressing themselves constructively.

So, that instinct took over, and on... oh... page 3 or so, you can see the teacher in me trying to sort it out a bit. But nope... the flames start again.

It's no different than my grade 6 classroom. Tell them the rules and proper classroom etiquette a million times, and they still ignore you.

Greg

[McLilith]

Now this is a GUI.


The Knob
http://www.kvr-vst.com/get/1271.html

That's really cute.


McLilith

[amoebe]

Now this is a GUI

Why did you have to draw that black edge around the knob? Don't you know the meaning of the word 'minimalistic'

Even if you can still read a GUI which falls into one the categories mentioned, wouldn't it be better if your eyes could read it easier?

In itself, no doubt about it.

Is there anyone here that doesn't think that eliminating purposefully rendered glare from areas of the GUI which need to display parameters and other important data, is a good idea?
(Sure, you can keep your specular highlights around the edges of panel windows and such, just don't let the glare intrude on the important data areas of the GUI.)

Yes, but that glare just looks so good and it took so long to get it right. Most people will choose (therefore buy) what looks best, not what works best. So companies (and illustrators) have to compromise between looks and usability, resulting is GUI's with obtrusive lighting and less-than-optimal contrast between controls. Of course you can take the lighting too far, but who'll decide.

Am I the only one who thinks that low-contrast text and graphic displays are generally best avoided?

(I personally don't like subtle gray-on-gray lettering, for example.)

High contrast text on screen is very tiresome for the eyes and must be avoided at all cost. Of course too subtle isn't right either.

Does anyone else think that rendered backlit meters and displays should be lit evenly, and GUI designers should not try to emulate some of the worse examples of spotty hardware backlighting?

Uneven lit displays etc. look&sell better, besides, most GUI's are 3d illustrations and to suggest the 3d-ness of objects you need 1-point lighting (for dropshadows, etc.)

Finally, I just want to repeat that I don't care if a GUI designer creates a nice 3D GUI, or a nice 2D GUI. I just want them to create a nice legible GUI which is easy on the eyes.

Is that a reasonable thing to wish for?

Reasonably enough. Unfortunately, most people won't decide rationally what to buy and what not (ever taken a look at the average advert? ) and therefore not interesting for any company, trying to make a profit. Ideally every synth should come with 2 GUI's: one for the adverts and the neighbours, one for the studio.

[McLilith]

Yes, but that glare just looks so good and it took so long to get it right. Most people will choose (therefore buy) what looks best, not what works best. So companies (and illustrators) have to compromise between looks and usability, resulting is GUI's with obtrusive lighting and less-than-optimal contrast between controls. Of course you can take the lighting too far, but who'll decide.

I don't think that a sheet of glare over a control panel window (or even the main control panel itself) really looks good. You already know what I think about the funtionality.

I suspect that I'm probably not the only one who feels this way.

I want to suggest again, that I believe you can have your specular highlights (in the proper places), while keeping the data-containing areas of the GUI free from glare, and everyone should be happy. For example, instead of a sheet of glare that impairs the contrast of over half a display window (or more), simply use some specular highlights in other places, such as corners or edges of the panel window. That way, people can see cute realistic sparkly hightlights, refractive effects, dispersion, caustics, etc. Their jaws can drop to the floor marveling at the sparkly bits, and being impressed at how 3D and realistic the glass areas of the GUI appear--all while the data-bearing areas of the GUI are left totally intact and separated from this miniature light show.

Do you really think anyone is going to pass up a synth because none of the data-containing areas of the GUI were covered in a sheet of glare?

High contrast text on screen is very tiresome for the eyes and must be avoided at all cost. Of course too subtle isn't right either.

Hmm... I was saying that I didn't like low-contrast displays. That doesn't mean that I think the GUI should always have the maximum amount of contrast possible. In one of my earlier posts, I mentioned that Albino 1 used bright red letters against a black background, and that Albino 2 had switched from bright red, to a more legible wine red. The lower contrast and color saturation of the darker red really improved the legibility of that synth.

Uneven lit displays etc. look&sell better, besides, most GUI's are 3d illustrations and to suggest the 3d-ness of objects you need 1-point lighting (for dropshadows, etc.)

I don't think it's to be taken for granted that they categorically look better. For example, I don't think they look better, and there are probably others who feel the same way.

There's also a bit of question about "needing" uneven lighing on backlit displays to make the GUI look more 3D. I don't agree that it enhances a 3D effect. To me, it just makes the GUI look more like crappy hardware, built with crappy uneven backlighting, because the hardware maker didn't want to put the time, money, and effort into incorporating a higher-quality even backlight. If this really were such a cool thing, we would have computer notebook manuafacturers bragging about the uneven backlighting implemented in the screens of their latest notebook computer.

Now, carefully rendered shadows can enhance the 3D look of a GUI. Perhaps it was this that you were primarily thinking of, in that last quote?

The principle light source for these shadows is going to be the virtual "room lighting" that is used when doing a 3D rendering of the GUI. The backlight won't usually be the principle light source, and won't usually contribute the most prominent shadows, if it contributes any noticeable shadows at all.

I still believe that unevenly backlit displays serve no really useful purpose--neither aesthetic, nor functional.

I also can't imagine a typical consumer not purchasing a synth because it lacked poor lighting in its backlit displays.

As for the notion of shadows, you can have lots of shadows if you want. I just don't think it's a good idea to have shadows intruding upon the data-containing areas of the GUI, in order to achieve a 3D look. Intrusive shadows are not a requirement to achieve a good 3D appearance, and they impair the legibility.

Again, I suggest that the way some GUIs have their virtual shadows arranged is just like arranging desk lamps around your favorite hardware synth, to make sure that at least some of the control panel legends are harder to read. I don't know anyone who would do such a thing, and I don't know anyone who would pass up purchasing a VSTi synth because there weren't any shadows over the legends or parameter displays.

Ideally every synth should come with 2 GUI's: one for the adverts and the neighbours, one for the studio.

Well... there are some plugins which offer interchangeable skins. Dash Signature's TubiLeSax offers multiple skins, to cite just one example.


take care,
McLilith

[Lunch Money]

I'm still of several opinions--

My favourite GUI of all is the Tracktion GUI, but strangely enough it's one of the ones that many people have negative comments about-- "I love the way Tracktion looks, but I dislike the flat GUI."

On the other hand, my favourite Wusik skin is Amoebe's 'Smudge', which is 3D and hardware-like, whereas I can't enjoy using the 'flat' skin very much. On the other hand, the 'Dirty' skin, which is a mod of 'Smudge' has some cracked bits and pieces here and there, and I think that's an example of taking it TOO far. Smudge is also brilliant because it uses the right colours and clear text, though.

Greg

[McLilith]

Hi Greg,

I haven't actually used Tracktion, but the screen shots on the Mackie site look interesting. I certainly didn't see any obvious problems with the GUI. Is it simply because it's 2D that people don't like it?

I've looked at the Smudge and Dirty screen shots, and I do like Smudge. I think the color scheme is very nice, and the moderate amount of aging hasn't impaired the legends or data displays very much. There seems to be a drop shadow over the triangle display, but notice how the shadow doesn't really intrude on the actual triangle waveform. That's acceptable to me. Surprisingly, the hardest thing to read is actually the "W STATION" logo at the top of the GUI. William might understandably disagree, but if something is going to be hard on the eyes, it's quit possibly best that it be the logo, and not a functional part of the GUI that has to be read and interacted with. (Of course, it would be ideal to have the logo be easy on the eyes as well.)

(Incidently William, this is a nice synth you have created. I've tried the demo version, and I'm definitely impressed.)

I think that Dirty goes a bit too far, because it is beginning to noticeably impair the view of the legends and data displays. It also seems to have a certain amount of extra blur applied, which is something I really don't care for. It's entirely possible to make the GUI very aged and dirty looking without making it blurry. I have to wonder if the blur is an artifact in that particular lossy JPEG screen shot, or whether it's an integral part of the actual GUI?

However in a situation like this, where the end user can easily pick between the two skins, I have no problem with one of them being somewhat less legible than the other. I don't care if someone wants to create an alternate skin that looks like the synth is buried under 2cm of Vaseline Petroleum Jelly and illuminated by the faint glow of narcoleptic fireflies, as long as there is a legible skin I can use instead.

Now there's real thought for all you lovers of things decaying and flawed. Add flickering lighting to your next GUI. It could either simulate blinky fluorescent room lighting hanging over the hardware synth you are emulating, causing the shadows cast on your GUI to move around in a flickery manner--or it could be something like a blinky neon power indicator on the GUI itself, a failing Vacuum Fluorescent Display panel that needs to be "banged on" (clicked on) periodically with the mouse to temporarily counteract the virtual "loose connection" hidden somewhere inside the synth's "virtual wiring". Heck, you might even want a few sparks spraying around once in a while, possibly at the moment a switch is thrown. If there is a vacuum tube visible through some window in the GUI, you might want to have some occasional arcing noticeable inside the tube. This would might make a very nice overload indicator. There are numerous possibilities to be explored!


take care,
McLilith

[BONES]

the GUI is far too soft for my taste. Much of the lettering is a fairly low-contrast gray instead of a nice crisp black.

Ok, in my experience creating GUI graphics it is very hard to get crisp characters at low res because of anti-aliasing issues and without anti-aliasing things look even worse and very unprofessional. I use low contrast for this reason and also because it is much, much easier on your eyes over a long period. Most of the software I use in my work is designed in a similar fashion for the same reason.

I agree about bright colours, particularly red, but those are probably more marketing decisions than anything, to help the product stand out.

Lots of people say how much they like the 2D graphics in things like ConcreteFX stuff but I find it much harder to work with when everything is a uniform tone and one thing blends into the next with no distinction. Simulating real-world shading helps my mind to grab hold of the GUI and to be able to use it intuitively in a much shorter time.

Haven't read the last 6 pages so sorry if I've been left behind.

[Lunch Money]

Hi Greg,

I haven't actually used Tracktion, but the screen shots on the Mackie site look interesting. I certainly didn't see any obvious problems with the GUI. Is it simply because it's 2D that people don't like it?

Yes. Ironically, they call it "toy-like", when in my opinion, trying to make something look like a piece of hardware has more in common with the appearance of 'toys'.

(Incidently William, this is a nice synth you have created. I've tried the demo version, and I'm definitely impressed.)

Innit just a killer?

I think that Dirty goes a bit too far, because it is beginning to noticeably impair the view of the legends and data displays. It also seems to have a certain amount of extra blur applied...

I don't think there's any extra blur, compared to Smudge. There are just more cracks and stuff.

Greg

[McLilith]

Ok, in my experience creating GUI graphics it is very hard to get crisp characters at low res because of anti-aliasing issues and without anti-aliasing things look even worse and very unprofessional.

I realize that low-res characters are a true challenge, but I've seen several GUIs that could have been done better in either the contrast or sharpness categories.

I use low contrast for this reason and also because it is much, much easier on your eyes over a long period.

I agree that large expanses of white or very light backgrounds with black letters can be hard on the eyes after a prolonged period, but this doesn't account for some of the GUIs that don't allow their dark letters to actually reach a true black. I think in the case of viewer fatigue, it's usually more productive to tone down the bright background, than to lighten the dark letters. (This is assuming a dark letter on light background scenario.)

Having too little contrast can also cause eye strain, but you probably already know that. One of my strongest pet peeves is the use of truely low-contrast gray-on-gray lettering in a software GUI. I've also seen some GUIs that had a "black-on-black" scheme, which I think is a very dubious choice for a GUI.

I agree about bright colours, particularly red, but those are probably more marketing decisions than anything, to help the product stand out.

I'm not sure who makes those decisions in the larger companies, but I think they are making a flawed decision, regardless. You would seem to agree, I think?

Lots of people say how much they like the 2D graphics in things like ConcreteFX stuff but I find it much harder to work with when everything is a uniform tone and one thing blends into the next with no distinction. Simulating real-world shading helps my mind to grab hold of the GUI and to be able to use it intuitively in a much shorter time.

I can understand that reasoning, especially for complex GUIs. What is your opinion on using a generous amount of "color coding" of GUI features? Does that help improve the 2D GUIs usability for you, or do you tend to prefer a minimalistic color scheme in a 2D GUI? (Let's just assume the GUI has to be 2D, for the moment.)

I tend to like mulicolored GUIs myself, but I think some people get overly distracted by a lot of colors. (Truth be known, they are probably trying to apply the same color-matching "rules" they use when picking out a pair of slacks or something. I think picking GUI colors should be a bit more "liberated" than that.)

Haven't read the last 6 pages so sorry if I've been left behind.

Don't worry, you haven't missed anything substantial. There was a huge flame war that broke out, and it ran on for several pages. I'm hoping we can all move past that now.


take care,
McLilith

[ouroboros]

BONES' synths are interesting in that they are 3-d but don't look modeled after existing hardware. (I think)

[jaypee]

I just stumbled over this thread here, and although I didn't read all of it I got the main points - I think.

I don't really understand why people feel the need to fight holy wars for the one or the other type of user interfaces. It's about personal preferences and taste, who would want to claim 'mine is the only valuable'? I guess there are good reasons for both the 2D and the 3D concepts.

One may feel the legibility of an icon-esque, simplified style like in Ableton Live suits him best, the next one will feel a visual 'emulation' like Propellerhead Reason is more accessible for him because of its reference to gear he's got used to for years. What's the point in devouring each other for that type of different point of views? That much about the 2D versus 3D topic. Tsktsktsk ...

In the very beginning of the thread, McLilith writes about reflections in displays, blurred texts and other stuff to lower the usability of just too many UI's. True - basically. But still, it's not that easy to get around the problems.

The probably easiest-to-read UI's I can think of were the Dialog boxes in early Mac OS'ses ... monochrome, black type on a white background, no blurry anti-aliassing - who the heck would want this nowadays, although this concept *is* the best bet regarding legibility on a computer screen? My point is: A GUI is always a compromise.

For example, if you have a lot of controls that you need to be in one 'page' or screen or whatever you want to call it, you can either go for tiny controls or a huge window. Let's say you go for the exact 50/50 compromise - the guy running his 17" monitor with a 1600x1024 resolution will blame you for the much too tiny text, whereas the guy running the very same monitor on 800x600 will tell you the window is just too big. That's how it is, if it doesn't work for you, don't buy it.

Another example: If you want (or need) to credibly recreate the visual style of some classic, you will eventually have to recreate the flaws also. Somebody wrote about unevenly lit displays being crappy and a sign of bad technology ... oh well. There is so many gear from way back when which has lots of flaws in the 'unevenly lit display' category, but still it has zillions of times the soul of most of the contemporary mass production plastic boxes.

Somebody quoted this eternal designer statement of 'form follows function'. This is basically true - but the common interpretation is wrong in so far as it equals the dictate of the function over the form. The form is integral to functionality and not some kind of inevitable 'packaging'. If you look at something, and what you see makes you want to (virtually) touch it - then, the designer has succeeded in having you wanting to use his product, which is an extremely important step in a functionality discussion. What's it worth presenting a 'functional' UI which is boring you to death? How functional is a product you don't want to use?
If you work with something and you like what you see, you will work more easily with it. To actually like something means you find it inspiring in some way (and that's a good thing, even more in creative processes like making music) - although you wouldn't file this under functionality right away.

One word (well, not exactly one ...) about the idea of using glow and reflection only in areas where you have no texts, i.e. 'round the corners of displays instead of on the glass cover: The idea seems obvious, but it doesn't work right. You can't use one elaborate lighting situation for the GUI, and just skip it occasionally. This would always look wrong and confusing.
If you have to represent glass, you'll have a hard time doing it without reflections. And the reference to pro photographers keeping reflections off is not precise - the will always try to have them applied in some controlled way, but they also need the reflections to have the audience understand that it actually *is* glass.

There are rules for all kinds of formal aspects in visual creation, no need to go them through one by one. The paragraph above applies to all of them: if you decide for a paradigm, don't brake it at the first occasion.

So, what to do? Well, compromise. Optimize everything in a consistant way, within the limits given be the general idea/style/soul of the product.
The example of blurry-looking anti-aliassed text was given and is perfectly illustrating what I mean by 'optimizing': If you want to use characteristic typefaces and still want them to loook as sharp as possible, you have to experiment with the fontsize settings, position offsets, rendering procedures, and finally you have to use manual kerning (fine-tuning) for every single letter/space on the panel to get the best possible results. I guess most ppl aren't ready to spend hours on this, or they all simply have no clue how to do it. But that's not a crime, after all.

Jackle&Hyde somewhat went off, and besides his not so perfect english writing I share another thing with him: The feeling that it is somewhat groce and arrogant to vituperate over other people's hard work, especially since we are talking about really complex interrelationships. And his mock-up isn't bad at all imho. I mean - it deserves respect, doesn't it?

And, just in case, yes, I do know what I'm talking about.

Cheers,
/jaypee aka Thomas Merkle
Bitplant

GUI's for
Propellerhead Software Reason, Arturia Yamaha CS-80V, rgc:audio z3ta+/sfz+, Cakewalk p5 Psyn synth, Digidesign Venue OS, Universal Audio Mastering Precision Limiter/Plate-140 Reverb, ...

[Lunch Money]

Heh,

I DO respect the work that goes into them, and I for one respect J&H's GUI... it's way better than I'd ever be able to come up with. In fact, I had seen it before this thread even started, and thought to myself, "Pretty slick looking!"

Of course everyone's entitled to their opinion. But we're also entitled to rant about it and/or engage in meaningful discussion about it. I believe McLilith (not that I'm qualified to speak for him) was simply demonstrating that more care can be taken for legibility's sake.

And, at the end of the day... it was just a rant, which is OVERTLY his saying, "Hey, this is my personal opinion, but I wanted to get it off my chest."

Nothing wrong with that... not any more than me sitting down at a pub with my friends and saying, "You know what burns my ass? Pubs that have a really thick glass bottom on the mug to make you feel like there's more in there than there really is!"



Greg

[edited to be even more polite-- I wasn't particularly rude in the first place, but I didn't like one of the things I said. ]

[reflekshun]

I just HAVE to add, that i'm really satisfied and happy with the way vsti guis are turning out these days.. awesome hehe. Seriously, I can't complain much they are constantly getting better IMO.

[Warmonger]

jaypee, I was just wondering exactly which devices you did for Reason? I saw the Subtractor on your website, so I would assume that you did that. What else did you work on?

I really love the Subtractor's overall gui, and without trying to sound too ass-kissing, I find it more intuitive than any VST I've ever used.
But cyan? Why must you remind me of Windows 95?