13

I'm building a graphical tool for programmers to ease the use of a library. The library has a data type which I will call AbstractType that all types inherit from - Image, File, etc. The list of object types is enumerable.

When the user is specifying the AbstractType object in the properties sheet, how should I arrange the form?

My current thought is something like this:

mockup

download bmml source – Wireframes created with Balsamiq Mockups

Basically, the type is changed on one tab, which changes the form on the other tab. So if you chose Image, the other tab would have fields for "Width", "Height", etc, but if you then changed to File, the other tab would change its fields to have a "path" field.

Improve this question
1
  • As a programmer: We're lazy, we want things to happen with the least amount of action. And use the TAB key. Neither works in your current suggestion.
    – Martijn
    Commented Apr 11, 2017 at 12:15

2 Answers 2

Reset to default
29

Simply put: DO NOT USE TABS.

This is not what tabs are meant for, so just use the box you have. Once the user selects the type, show the fields you have in second tab, only that right below the select field you have in first box. Basically: use only one box and get rid of tabs , then the "abstract type" will render no use at all, ergo problem solved, type will be visible at every time, you won't need any labels and users will be aware that by changing the dropdown, they can change the type as needed, without the need of going back and forth

Improve this answer
4
  • 1
    I was using the tabs because I couldn't figure out how to get SWT to update the size of the form when I changed GUI elements, so I guess now I need to go figure that out.
    – Justin
    Commented Apr 10, 2017 at 19:49
  • @Justin, I don't know what SWT is, but can't you simply leave the size as fluid? Otherwise, simply measure the current size you have + the select field, then use that as fixed size to contain everything. While not very pretty, that will also help to let users understand there will be more content in the blank space
    – Devin
    Commented Apr 10, 2017 at 22:01
  • @Justin Scrollbars? Optionally, scrollbars that only appear when necessary. IIRC it's possible in SWT, though I haven't used it in a while.
    – anon
    Commented Apr 11, 2017 at 4:25
  • 1
    @Devin I think SWT is supposed to be The Standard Widget Toolkit. I don't know anything about SWT but in the docs the couple widgets I saw had a setSize method. Justin I also think you should get rid of the tabs. The more automatic the better.
    – armatita
    Commented Apr 11, 2017 at 15:50
15

To expand on Devin's point ...

Make the change obvious

Tabs mask the state change, asking users to know what you want without the help of visual cues. When an interaction changes the state of some other thing, make that change self-evident. In this case, changing the first control should pop the additional controls immediately into view (a little animation to soften the change is always appreciated).

Interaction with first control makes additional controls appear

When possible, it's nice to let users know what to expect before hand. If the additional controls were normalized from one "object type" to the next, you could show them in a disabled state. In your case, it sounds like the additional parameters (if they exist at all) will be different from one object type to the next. In such cases, I prefer to just populate them on demand.

Improve this answer
2
  • You could also visually separate the "type selection" dropdown from the box which contains the type-specific properties. I find that subtle separation gives the user a little more indication that the fields will appear and disappear when the dropdown selection changes. A different background color, a border between "Object type" and "Caption", or even different indentation levels let the user know that the fields are dependent on "Object type".
    – Harrison Paine
    Commented Apr 11, 2017 at 14:13
  • @HarrisonPaine In this case, the type-specific options wouldn't even been in view until the type control is set. In the context of a potentially larger form, keeping these related elements spaced together is probably better for overall organization.
    – plainclothes
    Commented Apr 11, 2017 at 18:32

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.