|
|
| Spire |
| Posted: Nov 4 2002, 01:26 PM |
 |
|
Unregistered
|
This past weekend, I decided to see what I could do about improving the user interface of VirtualDub. We all know that VirtualDub is an incredible program, but there are areas where the UI isn't quite as polished as it could be.
I've long wanted to help improve VirtualDub in this way (as a way of giving back, since UI design is one of my strengths), but when I first broached the subject to Avery several years ago, he didn't seem to be interested. As a result, I didn't seriously pursue the endeavor, figuring that it would hardly be worth my time if I were the only one to benefit.
However, Avery's recent decision to adopt my icon as the standard VirtualDub icon, as well as his willingness to make substantial changes to the new Logo filter dialog box based on my suggestions, have put a glimmer of hope in me that he might perhaps be willing to adopt some of my UI design, as long as I did all the hard implementation work myself.
I and many others consider UI design to be one of the most time-consuming and utterly thankless aspects of software development. Although it takes an enormous amount of thought and effort to achieve, good UI design generally ends up going completely unnoticed. Additionally, UI design does not result in any "real" functional improvements. No new features are added; the only difference is an intangible "it's easier to use" quality. As a result, many programmers are understandably quite loath to devote a disproportionate amount of time to the UI, believing instead that "if it works, it works", and that their time is better spent implementing important new features.
In light of this, I would greatly appreciate hearing everyone's opinion on my UI efforts -- in particular, whether the degree of improvement merits the exceptional amount of work required to achieve it.
For my first project, I decided to tackle the Levels filter dialog box. The Levels filter is a wonderful feature, one that I use on a daily basis. Unfortunately, there have been elements of the UI that have always bothered me, so I figured that the Levels filter dialog box would be as a good a place as any to start with my UI efforts.
After a long weekend of designing, coding, testing, and debugging (to the exclusion of any normal human activities), the work is complete! I hereby present my new-and-improved Levels filter dialog box.
Before:
After:
Release notes:
- The dialog box controls have been reorganized to better reflect their respective functions. Related controls have been grouped together in frames. Most importantly, the Input levels gradient has been directly coupled with the histogram.
- The Input levels gradient has been made to always align precisely with the histogram, independent of screen resolution and font settings. This ensures that the gradient triangles always point to the correct data slice, making visual adjustments considerably more precise.
- The histogram has been made "live". Adjustments to the gradient triangles now cause portions of the histogram to be shaded or highlighted, in real-time. This not only helps further enhance the precision of visual adjustments, but also helps new users understand the direct relationship between the gradient and the histogram. For example, portions of the histogram that would be clipped by the current levels adjustments are made to appear appropriately "grayed out".
- The histogram now conforms to the user-defined Windows color scheme, instead of being hard-coded to black-on-white. This ensures that the histogram does not clash in appearance when the user has defined an unusual color scheme.
- The gradient triangles have been redesigned with a three-dimensional "button-like" look, in order to provide a strong visual hint to the user that they can be clicked and dragged. Additionally, for visual consistency, the histogram and gradients have also been given an aesthetically pleasing "sunken" three-dimensional look.
- "Spin" controls (left/right buttons) have been added to all of the levels numeric input boxes. These allow the user to quickly and precisely fine-tine values without having to type them in manually or drag the triangles with the mouse. (Usage note: The spin controls support the Up and Down arrow keys rather than the more obvious Left and Right arrow keys, because the latter keys are already used for editing the corresponding input box text. This is an unfortunate but necessary compromise.)
- Adjustments to levels triangles now cause the corresponding numeric input box to be selected automatically. As a result, the user can first make rough adjustments by dragging the triangle, and then fine-tune immediately afterwards by using the Up and Down arrow keys.
- A small graphical legend has been added to each numeric input box, further reinforcing the direct relationship between the input box and its corresponding triangle. Previously, the user had been forced to "discover" this relationship by accident, by dragging triangles and then noting that each triangle happened to affect a different input box.
- The "Operate in luma instead of RGB" check box has been moved into its own named section, and expanded into two radio buttons with brief explanations of each option. (As a general UI rule, it's a bad idea to have a check box of the form "do A instead of B". Check boxes are intended to be used only in situations when the absence of A directly implies B, so that only A needs to be explicitly named, as in "do A".)
- Several of the dialog box changes had caused the dialog box to become significantly taller, so the histogram has been vertically shortened somewhat in order to compensate. Careful testing has been done to ensure that shortening the histogram has not adversely affected its functionality.
The new Levels filter dialog box has been thoroughly tested under a wide variety of conditions, and appears to be rock-solid. It is important to note that it does not alter the functionality of the actual filter itself in any way, so it is 100% backwards-compatible.
A custom private build of VirtualDub (based on 1.4.11) with the new dialog box is available by request to those who are seriously interested in testing it and providing useful feedback. (Send me a Private Message if you’re interested.) Source code is not available at the moment; I'd rather just furnish the source directly to Avery, in case he is interested in incorporating it into the official build.
Thanks for reading! I'm looking forward to hearing everyone’s opinion on the new dialog box, and on the whole UI effort in general. I have many ideas in mind, and this dialog box is only the first. |
|
| Morsa |
| Posted: Nov 4 2002, 01:39 PM |
|
|
Moderator of the Vdub support board
Group: Moderators
Posts: 640
Member No.: 246
Joined: 9-September 02
|
Really a great improvement!!!
I think it will be added to Vdub very soon.
Meanwhile you could send your updates to VirtualdubMOD Team.
Good luck.
By the way, I´ve got a little suggestion.
I use video compositing tools (Combustion and some others) and I really know that for making an accurate levels correction Vdub should have its workplace dark grey, not light grey as it is now.
|
|
| Sarreq Teryx |
| Posted: Nov 4 2002, 04:43 PM |
|
|
VirtualdubMod Alpha tester
Group: Vdubmod Alpha Testing Team
Posts: 175
Member No.: 41
Joined: 16-July 02
|
| QUOTE (Spire @ Nov 4 2002, 07:26 AM) | "Spin" controls (left/right buttons) have been added to all of the levels numeric input boxes. These allow the user to quickly and precisely fine-tine values without having to type them in manually or drag the triangles with the mouse. (Usage note: The spin controls support the Up and Down arrow keys rather than the more obvious Left and Right arrow keys, because the latter keys are already used for editing the corresponding input box text. This is an unfortunate but necessary compromise.)
|
Why not use vertical spinners? makes it more obvious as to what keys to use, without harming the function any
--------------------
And as I walk through the Valley of the Shadow of Death, Lord, thy balls and shaft, they comfort me, you annoint my head with oil, some salt, a dash of pepper, a sprigg of parsley......Lord?............Lord??? What dost thou intend to do with that fork??? |
|
| Spire |
| Posted: Nov 4 2002, 05:25 PM |
|
|
Unregistered
|
| QUOTE (Sarreq Teryx @ Nov 4 2002, 08:43 AM) | | Why not use vertical spinners? makes it more obvious as to what keys to use, without harming the function any |
Good question. Using vertical spin controls solves the keyboard problem, but unfortunately, it creates other problems. (Believe me, I've thought a lot about this.  )
First, it breaks the connection between the spin buttons and the triangles; currently, clicking the left button moves the corresponding triangle left, and clicking the right button moves it right.
Second, it exacerbates the already-present dilemma concerning the center (gamma) value. Unlike the white and black point values, the gamma value increases as the triangle is moved to the left. If we were to use vertical spin buttons here, should the up button increase the gamma value (but move the triangle to the left), or should it decrease the gamma value (and move the triangle to the right)? Neither option is really good. Currently, with the horizonal spin control, I'm making the left button move the triangle left, which makes perfect sense, but at the same time it counterintuively increases the gamma value. Oh well. At least the strong directional connection between the button and the triangle makes up for it.
All in all, I think the advantages of the horizontal spin control outweigh the disadvantages. |
|
| Spire |
 Posted: Nov 4 2002, 05:32 PM |
|
|
Unregistered
|
| QUOTE (Morsa @ Nov 4 2002, 05:39 AM) | Really a great improvement!!!
[snip]
[F]or making an accurate levels correction Vdub should have its workplace dark grey, not light grey as it is now. |
Thanks for your kind words!
I'm afraid I don't understand your suggestion. Could you please explain what you mean by "workplace"? |
|
| mil_alex |
| Posted: Nov 4 2002, 09:02 PM |
|
|
Unregistered
|
I think workplace means main window background (which should be 50% grey).
Mainly this comes out the publisher studios and web design classrooms. They should be achromatic, not too bright and not too dark, to avoid undesired human eyes perception shifts.
|
|
| Neo Neko |
| Posted: Nov 4 2002, 09:09 PM |
|
|
VirtualdubMod Alpha tester
Group: Vdubmod Alpha Testing Team
Posts: 474
Member No.: 24
Joined: 11-July 02
|
Looks quite good. As you said no new functionality. But it is easier to understand several of the options. |
|
| Sarreq Teryx |
| Posted: Nov 5 2002, 01:46 AM |
|
|
VirtualdubMod Alpha tester
Group: Vdubmod Alpha Testing Team
Posts: 175
Member No.: 41
Joined: 16-July 02
|
| QUOTE | | from spire: All in all, I think the advantages of the horizontal spin control outweigh the disadvantages. |
OK, good point.
now about the size of the box, I'm using my brother's computer at the moment, and it's rather huge with the system res at 800x600 (highest on this particular vid card), it might be good to, without changing the size of the histogram window any more, give the window a bit of a diet. like, mainly, instead of the 20 pixel (guessing) margins around everything, make them 5 pixels. or if you don't want to shink the window, you could use the extra pixels to bring the size of the histogram up again.
--------------------
And as I walk through the Valley of the Shadow of Death, Lord, thy balls and shaft, they comfort me, you annoint my head with oil, some salt, a dash of pepper, a sprigg of parsley......Lord?............Lord??? What dost thou intend to do with that fork??? |
|
| Spire |
| Posted: Nov 7 2002, 02:31 AM |
|
|
Unregistered
|
| QUOTE (Sarreq Teryx @ Nov 4 2002, 05:46 PM) | | now about the size of the box... it's rather huge with the system res at 800x600.... |
I should have mentioned that I took the above screen shots with my display configured to 120DPI ("Large fonts"), rather than the default 96DPI ("Small fonts").
If you're running at 800x600, presumably you'd be running at 96DPI (unless you're some sort of masochist  ), so the dialog boxes would be 36% smaller in area on your display than what you see in my screen shots.
I should point out that my revised dialog box is less than 15% taller than the original one, and that it's actually a tiny bit narrower. |
|
| Sarreq Teryx |
| Posted: Nov 7 2002, 06:12 AM |
|
|
VirtualdubMod Alpha tester
Group: Vdubmod Alpha Testing Team
Posts: 175
Member No.: 41
Joined: 16-July 02
|
that's fine then, nevermind.
--------------------
And as I walk through the Valley of the Shadow of Death, Lord, thy balls and shaft, they comfort me, you annoint my head with oil, some salt, a dash of pepper, a sprigg of parsley......Lord?............Lord??? What dost thou intend to do with that fork??? |
|
| Spire |
| Posted: Nov 27 2002, 09:16 AM |
|
|
Unregistered
|
Just a quick update on this: I haven't heard either way from Avery on this, so until I do, I'm putting the whole UI effort on indefinite hold. (FWIW, my next project was going to be implementing fully customizeable menus and keyboard accelerators, and possibly toolbars.) |
|
| ChristianHJW |
| Posted: Nov 27 2002, 11:16 AM |
|
|
Advanced Member
Group: Moderators
Posts: 1768
Member No.: 2
Joined: 7-July 02
|
spire,
would you allow implementing of your sourcecode into VirtualdubMod ? I like your UI a lot ..
--------------------
Visit the unofficial Virtualdub support forum on http://forums.virtualdub.org - help to reduce the big number of emails Avery Lee is getting every day !!
Support matroska as container and Gstreamer as the only truely open, x-platform multimedia platform .... |
|
|
