Tuesday, October 17, 2006

Looking Like LabVIEW

Ideally, you should first design your user interface without worrying about the visual design. Make sure the right controls and indicators are there, that they have the right names, and that they're in the right place.

But at some point, you have to decide on a style. With LabVIEW, there are basically three options:
  • You can use the controls and indicators on the top-level palette (which became the Modern sub-palette in 8.x).
  • You can make something that uses the colors and styles of your platform.
  • Or, you can make something completely customized with your own graphics.

Each has pros and cons.

The first option is super easy. The "Modern" controls and indicators were designed by professional visual designers, and they look good together. But, anyone who's familiar with LabVIEW will be able to recognize the tool that you used. Some people complain that they don't want their applications to "look like LabVIEW."

Making a "system" UI is difficult to get completely right. When you use the system controls and the system colors, you have to think about everything more abstractly. You're not placing that listbox. You're placing a listbox. The frame, the scrollbar, the font, the colors... everything can change out from under you, and you have no control over it whatsoever. You also don't have a complete set of controls and indicators. Microsoft hasn't defined a system graph indicator, so LabVIEW can't offer it. The best you can do is create controls with similar fonts and colors, that blend well with the system controls. [Here's a tip: if you need a control for a system style UI that isn't on the palette, see if you can find a custom probe that has it. We've made system-like graphs and arrays for the custom probes that ship with LabVIEW].

A word of warning: do not mix system style with modern style! If you're doing a system style UI, you have to do it 100%. System colors change based on user preferences at the OS level. So, if you put black text on top of a system panel color background, even though the background may look gray to you, it could easily be black on someone else's machine. And black text on a black background is notoriously difficult to read. :-)

The third option is to create (or acquire from a visual design company) graphics and customize your controls in the control editor. Many people I talk to are surprised at how much customization is possible in the control editor. I'm not saying this is easy... just possible.

My advice is to weigh the requirements, benefits, and cost on a case-by-case basis. I have seen some impressively beautiful UIs from LabVIEW customers. It is possible, but it takes more effort. It's up to you to decide how much you want to invest in your visual style.



Anonymous Matt Holt said...

I find that custom controls, when done well, will add to the visual appeal of the "modern" palette. (ex. I have a custom pic control with the white background in the shape of a 3ph motor and the border hidden. This allows me to change the background color of a semi-transparent image to change the "state" of the motor under test. It looks like a regular image, but I have programmatic control of the color.) Using custom controls like this, in conjunction with the LabVIEW Look makes my panels look more custom and professional.

9:53 AM, October 25, 2006  
Blogger Christina said...

Very cool, Matt! Sounds like a simple approach with high impact.

2:25 PM, October 25, 2006  
Anonymous Anonymous said...

I'm looking for documentation about how to realize nice controls from the customize control utility. Do you have an idea of where I could find such info? Thanks!

10:40 PM, November 13, 2006  
Blogger Christina said...

I don't know of any documentation other than the help for the Control Editor. But if you have specific questions, I'll try to answer them. You can also try the forums at NI or LAVA, or the info-labview mailing list.

2:41 PM, November 14, 2006  
Blogger Shaun said...

LabVIEW always makes life a challenge when it comes to professional looking interfaces - They may be simple to use, but what was "Modern" in LabVIEW 7 looks positively antique when compared to even what NI ships with Measurement Studio, let alone what other development environments. Its amazing how much time my colleagues and I can end up spending "hiding" the LabVIEW modern controls!

Still, a little bit of time and judicious use of the transparent color can go a very long way, and with a bit of effort, some very intuitive results are possible :-)

5:53 PM, November 25, 2008  
Blogger Christina said...

Shaun, I completely agree. Thanks for the feedback!

3:49 PM, January 05, 2009  

Post a Comment

<< Home