OCTOBER, 1996
Therefore, over the next few months, this column will be devoted to improving the user interface. This month, we will look at a few aspects of UI that are sometimes forgotten in this world of deadlines. Later, we will be looking at some bad interfaces, and how to improve them. While this is a Visual Basic magazine, developers in any language will benefit from the techniques presented in this column.
System Color Name | Hex Value |
Menu Text | &H80000007& |
Scroll Bars | &H80000000& |
Window Background | &H80000005& |
Window Frame | &H80000006& |
Window Text | &H80000008& |
Active Border | &H8000000A& |
Active Title Bar | &H80000002& |
Active Title Bar Text | &H80000009& |
Application Workspace | &H8000000C& |
Button Face | &H8000000F& |
Button Highlight | &H80000014& |
Button Shadow | &H80000010& |
Button Text | &H80000012& |
Desktop | &H80000001& |
Disabled Text | &H80000011& |
Highlight | &H8000000D& |
Highlighted Text | &H8000000E& |
Inactive Border | &H8000000B& |
Inactive Title Bar | &H80000003& |
Inactive Title Bar Text | &H80000013& |
Menu Bar | &H80000004& |
Take the Test
One way to see if your forms' colors are changing properly, simply change your color scheme. Since Halloween is approaching, change your color scheme to Pumpkin. If the form, and other 3-D controls, change to an orange hue, and highlighted items become purple, you passed the test (and you did not have to study)! If none, or only a few, of the controls change color, you may have to go back and assign one of the system color constants to that control (see Figure 1). Since the system color constants not included in the Visual Basic manuals, or in online help, we have included a handy chart for your reference.
Figure 2: That's better! By using the system color constants, the colors on your form update when the color scheme changes.
Figure 3: Look what can happen when you forget to set the tab order (circled numbers represent the TabIndex property).
If developers take a few minutes to insure that the tab order is properly laid out, it would make navigation easier (see Figure 4.) In fact, no one would notice, but that's a good thing, remember! To do so is also quite easy. After you lock your form, click on the first control (located in the upper left hand side). In the properties box, click on the TabIndex property. Set it to 0. Work your way across the form, increasing each TabIndex by one. It is important to note that while labels are frames have a TabIndex property, they are actually skipped in the tab order.
Figure 4: Setting the proper tab order will eliminate confusion, and make your users happy (circled numbers represent the TabIndex property).
Secrets of Effective GUI Design
Minasi, Mark, SYBEX Press, ISBN: 0-7821-1495-4
Alan Cooper, known to some as the father of Visual Basic, has also written a number of articles on user interfaces. More recently, an article of his appears in the September edition of Dr. Dobbs.
Because of Visual Basic's RAD interface, many times key aspects of the user interface are overlooked . This month, we looked at few of those components. In the next few months, we will look at more of these, including examples from commercial applications. If you have any examples of what you feel is poor design (whether in your own or in commercial applications ), please send bitmaps of them to rheldt@netins.net, and we will help you build a Usable Interface!
[About Ryan Heldt: Ryan is an MIS major at Iowa State University. In addition to writing for Visual Basic Online, he also maintains The Toolbox Visual Basic Home Page. Ryan can be reached at rheldt@netins.net]
Click here to go back to the October '96 Article Index